un bricolage pour afficher les articles en colonnes. la plupart des maquettes de WordPress affichent les articles sur une seule colonne. il existe des solutions permettant de les afficher sur 2 ou 3 colonnes , à la manière d’un magazine – mais elles ne m’ont pas satisfaites du point de vue ésthétique. En effet, elles utilisent une technique d’affichage horizontale (par l’intermédiaire d’un float), ce qui laisse de vilains espaces blancs verticaux, puisque l’alignement vertical du rang suivant sera déterminé par l’article le plus haut.

ma solution est simple: afficher les articles verticalement, ce qui permet aux articles de chaque rang d’être directement sous leurs voisins d’en haut:
chaque colonne est contenue dans sa propre DIV.
Voici comment procéder, en sachant que cette solution est basée sur la technique de la grille 960. Si vous ne connaissez pas, allez sur le site et informez vous.
D’abord, lancer votre query, puis:
<?php $postcount= 0 ?><!--Set post counter to 0--> <div class="grid_4 alpha"><!-- Open Left Column Div--> <?php while (have_posts()) : the_post(); ?> <div class="post"> <h2 class="postnormal"> <a href="<?php the_permalink() ?>" rel="bookmark" title="lire <?php the_title_attribute(); ?>"><?php the_title(); ?></a> </h2> <div class="entry"> <?php the_excerpt(); ?> </div> <div class="spacer"></div><!--Clear so articles with high pics dont overlap--> </div><!--End Div Post--> <?php $postcount++ ?><!-- Increase Post Count--> <?php if ($postcount == 5) : ?><!--5th just displayed post so --> <!--a)Close Left column Div --> </div> <!--b)Open Right Column Div --> <div class="grid_4 alpha"> <?php endif; ?> <?php endwhile; ?> </div><!-- Close either Left/Right Div-->
la DIV grid_4 alpha est une classe particulière au système grille 960. ma technique dispose 10 articles sur 2 colonnes de 5 articles chacune. changez suivant votre gout. il y a probablement une manière plus élégante de coder, mais pour moi ça marche. il y a d’autre part des techniques JQuery qui permettent un réglage automatique et optimal du placement de Divs à l’intérieur d’un espace donné, Cf sur Nettuts.
articles similaires
i encountered an interesting fluke in converting Lutecium, a site of which i am co-curator, from HTML to WordPress 2.91. A psychoanalytical archive, the site has in excess of 1500…
depuis WP 2.7, une fonction qui permet d’afficher certains articles dit sticky en haut de page a été intégrée. pratique, sauf que les query retournent toujours les articles demandés avec…
ce site tourne avec WordPress – un logiciel de gestion de contenu également dit blog – ce type de logiciel permet de n’avoir pas à se soucier du côté technique…













les commentaires sont fermés.