X

Cómo añadir una clase a la primera entrada del bucle

Snippets by IsItWP

¿Está buscando una forma de añadir una clase a la primera entrada de El Bucle? Este fragmento añadirá una primera clase a la primera entrada en El Bucle, lo que le permitirá añadir un estilo único a la primera entrada.

Instrucciones:

Todo lo que tienes que hacer es añadir este código al archivo functions.php de tu tema o en un plugin específico del sitio:

add_filter( 'post_class', 'wps_first_post_class' );
function wps_first_post_class( $classes ) {
    global $wp_query;
    if( 0 == $wp_query->current_post )
        $classes[] = 'first';
        return $classes;
}

Nota: Si es la primera vez que añade fragmentos de código en WordPress, consulte nuestra guía sobre cómo copiar / pegar correctamente fragmentos de código en WordPress, para no romper accidentalmente su sitio.

Si te ha gustado este fragmento de código, por favor, considere revisar nuestros otros artículos en el sitio como: Revisión de CSS Hero.

Comentarios   Deja una respuesta

  1. Marek Jakubčík abril 18, 2021 en 9:59 pm

    Any idea why this does not work with woo shortcode? It adds class to each product in the loop. It works ok at the shop page.

    1. Which shortcode are you using?

  2. Hi,

    This has worked great, however, if I have pagination and i go, say, page 2, it adds the class to the first post on page 2, which I don’t particularly want. How would I be able to update the code to add the ‘first’ class to the first post of all the posts, even counting those paginated.

    Thanks a lot for the article it’s been very helpful! 🙂

    1. just add this condition if( 0 == $wp_query->current_post && get_query_var(‘paged’) == 0 ) : ?>

  3. Yeah! for adding a last class to the post, need only to add a condition like $wp_query->current_post === $wp_query->found_posts?

    1. Something like this should work,
      if( $wp_query->current_post == $wp_query->post_count-1 )

      1. Thank you man, i was unsafe about found_posts start from 0 (my bad). However, in same cases post_count isn’t a right choice because it contain the total number of posts being displayed. The use of found_posts or post_count depend which query had been performed, post_count have the same value of “posts_per_page” if is defined in a query or the default value defined into the read settings (sorry for my english).

        1. Hi Widzo, I think it depends on the results you want, if you want to add the class to the last post on every page you would use “post_count” on the very last post only you would use “found_post”

  4. great! And if I want to add a class always to the fourth column of the loop? For example, I have a loop showing my posts into 4 columns and I need to add this class to the right column. How can I do that?

    Thanks

    1. Hi Fabio, I would need to see your columns loop in order to see what would need to be done.

Añadir un comentario

Nos alegra que haya decidido dejar un comentario. Tenga en cuenta que todos los comentarios se moderan de acuerdo con nuestra política de privacidad , y que todos los enlaces son nofollow. NO utilice palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.

WordPress Launch Checklist

La lista definitiva para lanzar WordPress

Hemos recopilado todos los elementos esenciales de la lista de comprobación para el lanzamiento de su próximo sitio web de WordPress en un práctico ebook.
Sí, envíeme el ¡gratuito!