WordPress

Numerar Post WordPress

Mais uma dica easy de WordPress pra vocês. Estou no meio de um projeto de um site institucional, onde o layout tem numeração ao lado de cada post, ou seja, tenho que numerar post WordPress que aparecem na categoria.

Veja Exemplo

Numerar Post WordPress

Vamos editar o arquivo da página de post, no exemplo, ela se encontra em /wp-content/themes/nome-do-seu-tema/ e tem o nome de page-post-numerada.php caso você não saiba, nesse tutorial eu ensino detalhadamente como criar uma página de post.

Antes do inicio do loop que chama os posts da página, vamos criar uma variável contador, que tem valor 1, e ficará assim:

 <?php $contador = 1 ?>

O inicio do seu loop WordPress deve ficar mais ou menos assim:

<!-- VERIFICA SE TEM POST PARA EXIBIR -->
<?php query_posts('cat=1');?>
<?php $contador = 1 ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

No exemplo, pra eu numerar Post WordPress, eu coloquei a numeração antes do título do post, então agora vamos colocar a variável contador com incremento ++ pra adicionar +1 a cada post. O código do titulo do post, ficou mais ou menos assim:

<h1><a class="tituloPost" href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>">
<?php echo $contador++ . '.'; ?> <?php the_title(); ?>
</a>
</h1>

O CSS do exemplo de como numerar Post WordPress, é bem simples e o código ficou assim:

.tituloPost {
    font-size:18px;
    color:#000;
    text-decoration:none;
}
 
.resumoPostNumerado {
    border-bottom: 1px dotted #333333;
    font-size: 15px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 0 20px 10px;
    text-align: justify;
    width: 580px;
}

Pronto, viu como é fácil numerar post WordPress? Você pode fazer várias edições conforme suas necessidades

Se o post te ajudou curte a página, não custa nada e me incentiva a continuar escrevendo.
Posts recomendados
Comentários

    2 respostas para Numerar Post WordPress

    1. Diego escreveu em 20 de abril de 2014

      Eu passei vários dias pesquisando como fazer isso.
      Seu post resolveu um grande problema pra mim. Obrigado.

    2. Qcabeca escreveu em 21 de abril de 2014

      Que bom que ajudou Diego, sucesso ae. Abs

    Envie seu comentário.

    Seu email não será publicado