Mise en page sous dotclear.

J’ai cherché pendant un moment et je n’ai rien trouvé pour faire correctement la mise en page sous dotclear.

Mon problème était pourtant simple, je voulais pouvoir centrer une suite d’éléments sans retourner à la ligne à chaque fois comme ça le fait si l’on choisit de centrer les 2.

exemple :liensinutiles.jpgliensinutiles.jpg

Ne cherchez pas, à l’heure où j’écris ce billet il vous faudra passer par des manipulations compliquées à base de hack des .php de dotclear si vous voulez faire ça proprement.

Vous perdrez aussi votre temps en inventant des balises (la balise <b> permettant une mise en gras existe … ça se tentait… ça ne marche pas) à cause d’une sombre histoire de block.

Le plus efficace restait malheureusement de passer le billet en xhtml pour mettre :
<p style="text-align: center;">blabla </p>

autour de ce que je voulais, mais ce n’est pas pratique si ensuite l’on veut poursuivre le billet
J’en suis finalement arrivé à 2 solutions plus ou moins propres :

La classe

On l’appelle en faisant gentiment appel au html :
///html
<div class="C">blabla</div>
///

en wiki mais suppose de mettre remplir en html dans les balises ou plus simplement encore en utilisant
``<div class="C">``blabla``</div>``

avec dans le CSS :
.C {
display:block;
clear:both;
margin-left:auto;
margin-right:auto;
text-align: center; }

Le vol de balise

C’est moins propre, mais nettement plus efficace et nettement moins contraignant ou compliqué
L’idée est simple : vous allez voler une balise de mise en forme dont vous ne vous servez pas et qui existe/est reconnue/fonctionne
Personnellement j’ai détourné la balise titre de niveau 5 en modifiant juste son CSS comme ceci

.post-content h5, .post-excerpt h5 {
/* padding: 4px 0;
font-size: 1.0em;
color: #666;*/
display:block;
clear:both;
margin-left:auto;
margin-right:auto;
text-align: center;}

L’intérêt de garder la partie entre /* */ ? Qui sait, j’aurais peut-être besoin un jour de revenir en arrière.
Mais maintenant il sufit d’un ! en début de paragraphe pour une mise en page centrée.

liensinutiles.jpgliensinutiles.jpg
  • Share/Bookmark

Un commentaire sur “Mise en page sous dotclear.”

  1. une autre maniere de voir les choses!! :)

Laisser une réponse