Autor Categorias Comentários8 Comentários

Neste post, nós vamos explicar como criar um loop WordPress personalizado, capaz de levar o loop nativo do WordPress a um outro nível.

Todo mundo já sabe que o loop WordPress é poderoso. O loop é responsável por fazer algumas mágicas interessantes e é impossível conceber o WordPress sem ele. Porém, existem várias situações em que ele sozinho não é suficiente para chegar ao resultado desejado.

Se você não tiver paciência para ler, talvez se interesse pela versão em vídeo deste tutorial.

Como funciona o loop WordPress?

Antes de falar em loop WordPress personalizado, vamos apenas relembrar como funciona o loop padrão WordPress.

Toda vez que você abre uma página ou um post num site feito com WordPress, por trás o que o sistema faz é consultar o banco de dados para ver se há conteúdo a ser exibido. Um loop padrão é mais ou menos isto aqui:

<?php 

if(have_posts()) :
    while (have_posts()) : the_post(); 
	// Exibe conteúdo do banco de acordo com alguma formatação 
    endwhile;	
		
?>

<?php else: ?>
    <!-- Mostra algo caso nao tenha conteúdo -->
<?php endif; ?>

Basicamente o que temos é uma estrutura condicional if…else e, dentro desse if, um loop while. O if…else verifica se existe algum post na base de dados usando a função have_posts() do WordPress. Se tem algum post, rodamos o que tem dentro do if. Caso não exista nada, caímos no else.

Caso tenha posts, entramos no laço de repetição while. Este sim é o coração do loop. O que ele faz basicamente é ir trazendo os posts enquanto houver posts no banco de dados (while have posts, enquanto houver posts). Pra completar, a função the_post() mostra o conteúdo do post. Dentro do while, podemos formatar ou exibir o que quisermos desse post. Por exemplo, poderíamos coloca aí dentro uma tag <article> e dentro dela chamar o título, o conteúdo, a data de publicação, o autor do post, uma miniatura, qualquer campo de um post WordPress.

Podemos também chamar um arquivo que contenha esses campos com o uso da função get_template_part(). Poderíamos criar um arquivo na raiz do nosso tema chamado “content-algumarquivo.php” e pedir para o loop repeti-lo quantas vezes forem necessárias.

<?php 

if(have_posts()) :
    while (have_posts()) : the_post(); 
	get_template_part( 'content', 'algumarquivo' ); 
    endwhile;	
		
?>

<?php else: ?>
    <!-- Mostra algo caso nao tenha conteúdo -->
<?php endif; ?>

E não ficamos limitados a posts tão somente. Podemos usar o loop para páginas ou tipos de posts personalizados.

Se me perguntassem quem é o verdadeiro responsável pelo funcionamento do loop, eu diria que é um objeto chamado $wp_query. Em termos de programação PHP orientada a objetos, o objeto $wp_query é uma instância de uma classe muito importante chamada WP_Query. Nós falaremos mais sobre ela adiante, mas esse detalhe aí fará toda diferença para você decidir como criar o seu loop WordPress personalizado.

Criando um loop WordPress personalizado usando query_posts

Todo desenvolvedor de temas WordPress deveria conhecer a função query_posts(). Eu diria que ela é ao mesmo tempo o remédio e o veneno, uma mão na roda e um artifício perigoso.

Uma limitação do loop padrão do WordPress é que você não consegue ter mais de um loop na mesma página. Vamos supor que na sua página inicial você quer ter uma listagem dos posts da categoria “esportes” e outra para a categoria “politica”. Você precisaria de dois loops e é aí que entra a função query_posts().

A implementação dela é bastante simples. Vamos modificar o loop mostrado acima para ver onde modificamos:

<?php 

$args = array(
    'category_name' => 'noticias',
    'posts_per_page' => 5
);

query_posts( $args );

if(have_posts()) :
    while (have_posts()) : the_post(); 
	get_template_part( 'content', 'algumarquivo' ); 
    endwhile;	
		
?>

<?php else: ?>
    <!-- Mostra algo caso nao tenha conteúdo -->
<?php endif; ?>

Note que criamos uma variável chamada $args. Ela contém um array com o apelido da categoria (category_name) e a quantidade de posts por página. No caso, queremos 5 posts por página. Depois, chamamos a função query_posts e passamos o array $args dentro dela. Por fim, basta construir o loop do jeito que fizemos antes.

Mas, por que pode ser perigoso usar query_posts()? A resposta está naquele objeto que falamos anteriormente, chamado $wp_query. Acontece que a função query_posts() é um tanto destrutiva. Ao invés de criar um objeto novo para ela fazer as suas estripulias, ela pega o mesmo objeto do loop nativo e sai modificando. Isso pode bagunçar todas as suas páginas caso você tenha outros loops rodando nela, ou detonar a paginação, por exemplo.

Sabe aquele seu amigo que só pensa nele e nem se importa se o que é bom pra ele não é bom para os outros, aquele que quer só “adiantar o lado dele”? Assim é a query_posts() desde que mal usada.

Mas dá para arrumar isso, calma… Basta chamarmos a função wp_reset_query() no final do bloco if…else e “já era”. Basicamente, ela faz com que todo o efeito da query_posts() cesse a partir dali, limpando o objeto $wp_query pra gente. Gente boa essa última função! Nosso loop WordPress personalizado ficaria assim:

<?php 

$args = array(
    'category_name' => 'noticias',
    'posts_per_page' => 5
);

query_posts( $args );

if(have_posts()) :
    while (have_posts()) : the_post(); 
	get_template_part( 'content', 'algumarquivo' ); 
    endwhile;	
		
?>

<?php else: ?>
    <!-- Mostra algo caso nao tenha conteúdo -->
<?php endif; 

// Parando a query_posts()
wp_reset_query();

?>

A última linha “corta o fluxo” do query_posts() e retoma o fluxo de renderização normal dos arquivos do WordPress, até que encontre outro query_posts(), se houver outro…

Não limpar o loop gerado por query_posts() é um erro muito comum para quem está começando. Agora que você já sabe disso, não cometa o mesmo erro dos novatos 🙂

Criando um loop WordPress personalizado usando WP_Query

Vamos seguir a cartilha do WordPress: “se você quiser personalizar o Loop principal, utilize o WP_Query”.

A forma mais correta de criar um loop personalizado é não fazer o que a query_posts() faz. Em outras palavras, se quisermos criar um loop todo nosso, devemos construir uma cópia do loop padrão e mexer nesta cópia. Vamos fazer isso criando uma nova instância da classe WP_Query, criando um objeto parecido com o $wp_query para pintarmos e bordarmos com ele.

Esse objeto é como se fosse uma variável PHP e pode ter qualquer nome de variável, menos $wp_query, é claro! Modificando nosso loop padrão, teríamos algo assim:

<?php 

$args = array(
    'category_name' => 'noticias',
    'posts_per_page' => 5
);

$objeto = new WP_Query( $args );

if( $objeto->have_posts() ) :
    while ( $objeto->have_posts() ) : $objeto->the_post(); 
	get_template_part( 'content', 'algumarquivo' ); 
    endwhile;
	
// Parando a query
wp_reset_postdata();
		
?>

<?php else: ?>
    <!-- Mostra algo caso nao tenha conteúdo -->
<?php endif; ?>

Da mesma forma que no método anterior, criamos um array de argumentos com o apelido da categoria que queremos buscar e a quantidade de posts. Logo depois, criamos uma nova instância da classe WP_Query chamada de $objeto. Lembrando que poderia ser qualquer nome, tipo $professorraimundo por exemplo… Passamos o argumento ao construir o objeto e, pra finalizar, escrevemos o loop.

Dois detalhes para notarmos.

  • Quando chamamos as funções have_posts() e the_posts() temos que colocar o objeto na frente e uma seta.
  • Como não estamos mexendo no loop principal, não temos que usar wp_reset_query(), mas é boa prática voltarmos os dados do post como era antes usando wp_reset_postdata() ao final do loop while.

Uma lista de argumentos que podem ser usados nos dois métodos ensinados aqui podem ser vistos na documentação do WordPress sobre query_posts() e WP_Query.

Conclusão

Criamos um loop WordPress personalizado para usarmos em nossos temas é uma boa saída para darmos mais versatilidade a eles sem ter que dependermos de plugins. Será indispensável saber como construir esses loops caso você queira fugir do padrão WordPress, criando novas áreas no tema.

No entanto, alguns cuidados devem ser tomados para que você não corra o risco de ver sua listagem de posts e páginas todas quebradas. Se você optou por se aprofundar no tema e sair do usual, já tem meio caminho andado para construir temas memoráveis.

E aí, já tentou criar um loop personalizado WordPress? Conta aí pra gente!

NÃO PERCA A CHANCE

Aprenda a criar o seu próprio tema WordPress GRATUITAMENTE AINDA HOJE.

Não fazemos spam! Leia nossa política de privacidade para mais informações.

Aprendiz de violeiro, amante do rádio, falador de grego moderno e outras línguas humanas e não humanas (PHP e afins). É formado em Análise de Sistemas e trabalha com desenvolvimento web desde 2008, inicialmente com foco em Joomla. Vem se especializando na construção de temas com WordPress desde 2012, tendo construído dezenas de sites com ele. É autor dos livros "WordPress para Desenvolvedores" e "The Web Developer's Guide to WordPress", além de instrutor de cursos online sobre WordPress, com quase 20 mil dedicados alunos.

8 respostas para “Como Criar um Loop WordPress personalizado?”

  1. Achei legal, eu como não entendo em relação a formatação do WordPress direto este artigo foi bem fácil, só que o problema não sei se serviria para a página e estilo que estou querendo.

  2. Carlos Freitas disse:

    Olá! Criei uma página de busca com WP_QUERY, a consulta funcionou corretamente mas ao carregar a página desloca o layout para a direita deixando um espaço vazio à esquerda. Teria alguma ideia do porque disto acontecer?
    Obrigado!

    • Oi, Carlos. Movi o seu comentário para o post mais adequado. Quanto ao problema, só vendo mesmo para poder te ajudar. Se puder dar mais detalhes, como imagens e códigos, pode ser que consiga ajudar.

  3. Estevao Acioli disse:

    Parabéns este foi o melhor post que já vi sobre este assunto, obrigado mesmo.

  4. Alan Silva disse:

    Excelente Post. Nunca havia encontrado um material tão completo e ao mesmo tempo tão objetivo sobre o assunto.
    Parabéns pelo material!!!

    • Alan Silva disse:

      Eu gostaria de fazer uma observação no código na linha “3”, onde vimos:
      $args( array(
      o correto seria:
      $args = ( array(
      E na linha linha “14” é preciso o fechamento do “if” (endif;).
      Mais uma vez, parabéns pela iniciativa. Me ajudou bastante.

      • Oi, Alan! Muito obrigado pelos seus comentários! Fico contente pelo conteúdo ter te ajudado.
        Eu já corrigi os erros do array de argumentos. Agora não vai dar mais problema.
        Quanto ao if, ele fecha na linha 19. Isso é porque tem um “else” antes do fechamento.
        Muito obrigado!

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.