Utilisation de la maçonnerie - Comment faire en sorte que chaque Xème image miniature de publication s'étende sur plusieurs colonnes ?

Question

Pour être précis:

• J'utilise Masonry pour afficher tous les messages d'une certaine catégorie
• Les images miniatures de chaque article sont affichées sur la page de catégorie dans un format à 3 colonnes à l'aide de colonnes CSS à largeur fluide.
• Je dois afficher la 7ème image miniature couvrant la largeur des 3 colonnes

Dans le passé, j'ai ajouté un compteur aux publications pour cibler la Xème publication afin d'appliquer une classe et un style en conséquence.Mais est-ce possible avec la maçonnerie, qui consiste à positionner absolument des éléments ?

MODIFIER

J'utilise ce code pour interroger les publications sur la page maçonnerie :

    if ( get_query_var( 'paged' ) ) {
    $paged = get_query_var( 'paged' );
} elseif ( get_query_var( 'page' ) ) {
    $paged = get_query_var( 'page' );
} else {
    $paged = 1;
}
$args = array(
    'posts_per_page' => 12, 
    'paged' => $paged
);

// Override the primary post loop
query_posts( $args );

Answer 1

Donc, je ne pouvais donc pas comprendre comment ajouter une classe de séquence numérique à chaque post / article DIV, mais je viens de modifier le modèle du 7ème poste dans le modèle de maçonnerie.

Je l'ai fait comme ça:

<?php if ( have_posts() ) : ?>
<?php /* Start the Loop */ ?>
<?php while (have_posts()) : the_post(); ?>

<?php $count++; ?>
<?php if ($count == 7) : ?>

     <article class="masonry-entry masonry-3col masonry-post-no-7">
     </article>

<?php else: ?>  

     <article class="masonry-entry masonry-3col">
     </article>
<?php endif; ?>
<?php endwhile; ?>

Answer 2

Cela ne devrait pas être un problème avec la maçonnerie, du moins je n'en ai jamais eu (ou son équivalent isotope similaire).En fait, c'est la beauté de ces bibliothèques que vous puissiez avoir ce type de mise en page.Le reste dépend des bons styles CSS.Je ne sais pas comment vous appliquez votre classe compteur/index, mais je le ferais comme indiqué ci-dessous :

function wpse151589_indexed_post_class( $classes ) {
    global $wp_query;

    // the current_post property value starts counting at 0
    // we are doing + 1 to start from 1
    $index = $wp_query->current_post + 1;

    // if you want the number to always have 3 digits
    // like 001, uncomment the next line
    //$index = sprintf( '%1$03d', $index );

    // results in classes like post-nr-1/001
    $classes[] = 'post-nr-' . $index;

    return $classes;
}
add_filter( 'post_class', 'wpse151589_indexed_post_class' );

---

Modifier: Répondre au commentaire

Il y a certaines choses que j'aime noter,

1. Faire pas utiliser query_posts()

   Il y a une raison pour laquelle même la page du codex correspondante indique :

   Cette fonction n'est pas destinée à être utilisée par des plugins ou des thèmes.Comme expliqué plus tard, il existe des options meilleures et plus performantes pour modifier la requête principale.

   Et plus tard :

   Pour les requêtes de publication générales, utilisez WP_Query ou get_posts.

   Et:

   C'est fortement recommandé d'utiliser le pre_get_posts filtrez à la place et modifiez la requête principale en cochant is_main_query

   Les deux sources les plus informatives et les plus remarquables pour le pourquoi se trouvent en fait ici sur WordPress Development, ils valent absolument la peine d'être lus :

   • Quand devriez-vous utiliser WP_Query vs query_posts() vs get_posts() ?
   • Quand utiliser WP_query(), query_posts() et pre_get_posts
     
     

2. Que post_class() ne peut pas être utilisé à l'extérieur la boucle est pas vrai

   Il y a même un section à ce sujet dans la documentation.J'ai obtenu la page du codex pour post_class n'est pas la meilleure qui soit, mais il est assez clair que la fonction a deux paramètres, ce sont : $classes et $post_id.

   post_class( $classes, $post_id );
   

   Ce qui signifie:

   Pour afficher les publications en dehors de la boucle ou dans une boucle alternative, le deuxième paramètre de la fonction post_class peut être l'ID de la publication.Les classes seront alors déterminées à partir de ce poste.

   Ceci - en plus des informations de 1.- il est tout à fait possible de l'utiliser à vos fins.
   
   

3. Le WP_Query l'objet a une propriété nommée $current_post

   $poste_actuel
   (disponible pendant La boucle) Index du message en cours d'affichage.

   Il peut être utilisé selon vos besoins, vous n’avez donc pas besoin de réinventer la roue.