Uso de mampostería: ¿Cómo hacer que cada xTh Post Thumbnail Image Span múltiples columnas?

wordpress.stackexchange https://wordpress.stackexchange.com/questions/151589

  •  28-09-2020
  •  | 
  •  

Pregunta

para ser específico:

  • Estoy usando mampostería para mostrar todos los mensajes dentro de una categoría determinada
  • Las imágenes en miniatura para cada publicación se muestran en la página de categoría en un formato de 3 columnas usando columnas de ancho de fluidos CSS
  • Necesito mostrar la 7ª imagen en miniatura que abarca el ancho de las 3 columnas

En el pasado, he agregado un contador a los publicaciones para apuntar a la Xth Post para aplicar una clase y estilo en consecuencia.¿Pero es posiblemente con la mampostería, que está de posicionamiento absolutamente los elementos?

editar

Estoy usando este código para consultar las publicaciones en la página de mampostería:

    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 );

¿Fue útil?

Solución 2

Así que no pude averiguar cómo agregar una clase de secuencia de números a cada publicación / artículo DIV, pero acabo de cambiar la plantilla para el séptimo post en la plantilla de mampostería.

Lo hice así:

<?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; ?>

Otros consejos

Esto no debería ser un problema con la mampostería, al menos nunca tuve uno con él (o su isótopo equivalente similar). En realidad, es solo la belleza de esas bibliotecas que puedes tener este tipo de diseño. El resto se reduce a los estilos CSS derecha. No sé cómo aplicas su clase de contador / índice, pero lo haría como se muestra a continuación:

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' );



Editar: Responder a comentar

Hay algunas cosas que me gusta notar,

  1. Hacer no use query_posts()

    Hay una razón por la que incluso la página Codex indica:

    Esta función no está destinada a ser utilizada por los complementos o temas. Como se explicó más tarde, hay opciones mejores y más actuantes para alterar la consulta principal.

    y más tarde en:

    Para las consultas de la publicación general, use WP_Query o get_posts .

    y:

    Es fuertemente recomendado que use la pre_get_posts Filtrar en su lugar, y alterar la consulta principal al verificar is_main_query

    Las dos fuentes más informativas y sobresalientes para el por qué se encuentran en realidad aquí en el desarrollo de WordPress, valen absolutamente la lectura:

  2. que post_class() no se puede usar fuera el bucle es no verdadero

    Incluso hay una sección sobre eso en la documentación. Por supuesto, la página Codex para post_class no es lo mejor que hay, pero está lo suficientemente claro como para que la función tenga dos parámetros, son: $classes y $post_id.

    post_class( $classes, $post_id );
    

    lo que significa:

    Para mostrar las publicaciones fuera del bucle o en un bucle alternativo, el segundo parámetro a la función Post_Class puede ser el ID de publicación. Las clases se determinarán a partir de ese cargo.

    Esto, además de la información de 1. - hace que sea muy posible usar esto para su propósito.

  3. The WP_Query El objeto tiene una propiedad llamada $current_post

    $ current_post
    (Disponible durante El índice de bucle ) del poste que se muestra actualmente.

    Se puede usar para su propósito, por lo que no es necesario reinventar la rueda.

Licenciado bajo: CC-BY-SA con atribución
scroll top