Tableless - Padrões Web com Pastel e Caldo de Cana

por Diego Eis Abril 28th, 2008

O LOOP do Wordpress

O Wordpress tem vários segredos. Um deles é muito interessante: The Loop.

O Loop é usado no Wordpress para mostrar os posts do site. O Wordpress procura os posts publicados no sistema e exibe na página seu conteúdo. Juntando isso com o resto das Template Tags você consegue ter qualquer informação relacionado ao conteúdo publicado no sistema.

Desenvolvedores que não trabalharam ainda com Wordpress, geralmente se assustam quando percebem a quantidade de arquivos utilizados para criar alguns temas. Se você é um deles, relaxe. Você precisa de apenas um arquivo para fazer um site inteiro no Wordpress, o index.php. E dentro deste index.php você coloca o código do LOOP.

<?php while (have_posts()) : the_post(); ?>
    <!-- Template Tags e conteúdo -->
<?php endwhile; ?>

Os passos são os seguintes:

  1. Primeiro o have_posts() checa se há posts para serem exibidos.
  2. Se houverem posts, o Loop começa. Enquanto o loop continuar a executar, tudo o que você colocar dentro dele será repetido para cada um dos posts exibidos. Por exemplo: links de comentários, data, autor, e etc.
  3. Se não houverem mais posts, a função have_posts() retorna false e então o loop pára de ser executado.

Dentro deste while vai sua estrutura com as Template Tags. Fica mais ou menos assim:

<?php while (have_posts()) : the_post(); ?>
    <?php the_content(); ?>
<?php endwhile; ?>

A Template Tag the_content() exibe o conteúdo do post. Vamos rechear mais este código:

<?php while (have_posts()) : the_post(); ?>
    <h1><?php the_title(); ?></h1>
    <div id="texto">
        <?php the_content(); ?>
    </div>
<?php endwhile; ?>

Agora o conteúdo fica dentro de um div específico chamado #texto. E o Título do post foi colocado dentro de uma tag apropriada, H1.

Dentro deste loop você coloca tudo quanto é objeto que você queira que se repita em cada um dos posts que forem exibidos. Normalmente: data, autor, número de comentários, links para feeds ou qualquer outro elemento normal em blogs.

<?php while (have_posts()) : the_post(); ?>
    <h1><?php the_title(); ?></h1>
    <div id="texto">
        <?php the_content(); ?>
        <small><?php the_time('F jS, Y') ?> por <?php the_author() ?> </small>
    </div>
<?php endwhile; ?>

Esse código puxa do banco: título do post, o conteúdo do post, o dia que foi publicado e o nome do autor. Recheando com mais códigos para inserir uma sidebar, cabeçalho e rodapé, já começamos a montar a estrutura de um site de verdade. Mesmo assim, o principal da informação do site, foi feito nestas poucas linhas.

Se quiser, pegue o arquivo de exemplo aqui.

Se ainda estiver interessado, leia também:

10 Comentários

Fernando

Parabéns pelo artigo Diego, é muito legal passar esses fundamentos do Wordpress, principalmente para os desenvolvedores perderem o medo de criar seus próprios templates.

Abraços.

Rafael Dourado

Poderia complementar com um if (have_posts())

Inside

Por isso que eu amo o Wordpress =]

[]’s

Acelio Filho

Acho que agora vou me aventurar neste wordpress…

Xi, caras…

Este menu novo achei importante, mas deu pau no IE… Corta algumas partes de palavras no texto…

Desmontou o layout e o menu na base da página ficou em duas linhas…

DGmike

Sei, sei… ando um pouco sumido da comunidade, mas pretendo aparecer de vez em quando…

ótimo artigo sobre o Wordpress. Semana pasada comecei a me aventurar no Wordpress e estou implementando um site institucional com matérias que serão publicadas por várias pessoas e administrado por outras (o wordpress permite isso de forma muito interessante para pequenos sites, veja o client-side do Elcio).

Foi muito simples de implementar e valeu a pena, agora só me faltam alguns ajustes sobre o layout (css das internas e talz) mas ao todo, acho que vou levar uns três dias de trabalho para montar o site completo (incluindo inserção de conteudo).

Só tenho uma questão sobre o post e acho que, como estamos no tableless.com.br posso questionar isto. O the_loop imprimirá varias vezes o #texto mas, se não me engano, um determinado id só pode aparecer uma vez na página. Assim, que tal trocar o id do exemplo do tutorial por class? Assim ficaria mais semântico e correto.

Pedro Assumpção

Post simples e útil,
parabéns.
Pedro
Codesignville.com

Tiago Curcio

Post muito útil Diego,
Parabéns

Renan Hagiwara

Hoje pude perceber tudo isso dai… acabo de terminar a edição do meu novo blog e o tema default que não é mais default porque refiz todo o CSS e também alguns pedaços do código, deu um pouco de trabalho, pois até entender toda essa estrutura de Loop do WordPress!

ps. vi este post um pouco tarde! hehehe
Vlw

Passageirodealgumtrem

Fiz coisas no meu tema que, se precisasse refazer pra consertar, não conseguiría… duplicação de loops chamando querys criadas por mim, randomização de chamadas de post sem duplicação… nem sei direito … no codex, conseguí o código pra daptar, pra poder criar minha query e chamar o loop duas vezes na index, uma para stickys estilo “notas do editor”, outro pros posts comuns… foi uma barra interpretar, mas depois de um monte de testes, ewrros, loops falsos, página que não carrega, loops que sumiam sozinhos, deu certo. Mas o caminho é esse; vc podia postar algo a respeito de trazer loops na index, mais de um.
Abraço

Gian

Daniel Ideriba

Olá Diego!

Li seu post e achei em explicativo! Parabéns.
No mini-Loop do WordPress dá também para fazer um filtro mais especifico dos posts, exemplo:

por

No caso eu coloquei o query_post para ele filtrar postagens somente da categoria de ID=6

Mais explicações sobre o query_posts no CODEX:http://codex.wordpress.org/User:JamesVL/query_posts

Como feito nos sites que desenvolvi:
http://www.guiamba.com.br
http://www.brasildestinos.com.br

Abraços

Voltar para o topo

Histórico