X

Como Adicionar uma Classe ao Primeiro Post no Loop

Snippets por IsItWP

Você está procurando uma maneira de adicionar uma classe ao primeiro post no Loop? Este trecho adicionará uma classe first ao primeiro post no Loop, o que permitirá que você adicione estilos únicos ao primeiro post.

Instruções:

Tudo o que você precisa fazer é adicionar este código ao arquivo functions.php do seu tema ou a um plugin específico do site:

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

Observação: Se esta é a primeira vez que você adiciona trechos de código no WordPress, consulte nosso guia sobre como copiar / colar trechos de código corretamente no WordPress, para não quebrar acidentalmente seu site.

Se você gostou deste trecho de código, considere conferir nossos outros artigos no site, como: Revisão do CSS Hero.

Comentários   Deixe uma resposta

  1. Marek Jakubčík April 18, 2021 at 9:59 pm

    Alguma ideia do porquê isso não funciona com o shortcode do woo? Ele adiciona a classe a cada produto no loop. Funciona bem na página da loja.

    1. Qual shortcode você está usando?

  2. Olá,

    Isso funcionou muito bem, no entanto, se eu tiver paginação e for para, digamos, a página 2, ele adiciona a classe ao primeiro post da página 2, o que eu particularmente não quero. Como eu poderia atualizar o código para adicionar a classe 'first' ao primeiro post de todos os posts, mesmo contando os paginados.

    Muito obrigado pelo artigo, tem sido muito útil! 🙂

    1. basta adicionar esta condição if( 0 == $wp_query->current_post && get_query_var(‘paged’) == 0 ) : ?>

  3. Sim! para adicionar uma classe 'last' ao post, só precisa adicionar uma condição como $wp_query->current_post === $wp_query->found_posts?

    1. Algo assim deve funcionar,
      if( $wp_query->current_post == $wp_query->post_count-1 )

      1. Obrigado cara, eu estava inseguro sobre found_posts começar em 0 (minha culpa). No entanto, em alguns casos, post_count não é a escolha certa porque contém o número total de posts que estão sendo exibidos. O uso de found_posts ou post_count depende de qual consulta foi realizada, post_count tem o mesmo valor de "posts_per_page" se for definido em uma consulta ou o valor padrão definido nas configurações de leitura (desculpe pelo meu inglês).

        1. Olá Widzo, acho que depende dos resultados que você deseja, se você quer adicionar a classe ao último post em cada página você usaria "post_count" apenas no último post você usaria "found_post"

  4. ótimo! E se eu quiser adicionar uma classe sempre à quarta coluna do loop? Por exemplo, tenho um loop mostrando meus posts em 4 colunas e preciso adicionar essa classe à coluna da direita. Como posso fazer isso?

    Obrigado

    1. Olá Fabio, eu precisaria ver seu loop de colunas para ver o que precisaria ser feito.

Adicionar um comentário

Ficamos felizes que você tenha escolhido deixar um comentário. Por favor, tenha em mente que todos os comentários são moderados de acordo com nossa política de privacidade, e todos os links são nofollow. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.

Checklist de Lançamento WordPress

O Checklist Definitivo para Lançamento de WordPress

Compilamos todos os itens essenciais da lista de verificação para o lançamento do seu próximo site WordPress em um e-book prático.
Sim, envie-me o eBook Gratuito!