{"id":233968,"date":"2023-02-26T18:35:00","date_gmt":"2023-02-26T15:35:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233968"},"modified":"2022-11-11T13:28:04","modified_gmt":"2022-11-11T10:28:04","slug":"tutorial-de-tema-wordpress-para-iniciantes-parte-4-o-post-loop","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pt-pt\/tutorial-de-tema-wordpress-para-iniciantes-parte-4-o-post-loop\/","title":{"rendered":"Tutorial de Tema WordPress para Iniciantes \u2013 Parte 4: O Post Loop"},"content":{"rendered":"\n<p>Nesta li\u00e7\u00e3o do tutorial do tema WordPress para iniciantes, entraremos em detalhes sobre o &#8220;post loop&quot; no WordPress; o que \u00e9, como se parece, por que o usamos e como acessar os posts. loop em nosso tema.<\/p>\n<h2>O ciclo de postagem<\/h2>\n<p>Se voc\u00ea estiver familiarizado com PHP, deve reconhecer que um &#8220;loop&#8221; \u00e9 uma t\u00e9cnica de passar por cada elemento em uma matriz ou objeto com <code>for<\/code>, <code>foreach<\/code>ou <code>while<\/code>. O loop no WordPress funciona exatamente assim. Mas usaremos as pr\u00f3prias fun\u00e7\u00f5es do WordPress para fazer um loop para obter alguns benef\u00edcios e simplifica\u00e7\u00f5es adicionais.<\/p>\n<p>Em todos os momentos, o WordPress j\u00e1 consultou as postagens para voc\u00ea \u2013 dependendo da p\u00e1gina em que voc\u00ea est\u00e1. Se voc\u00ea estiver em uma p\u00e1gina de categoria, o WordPress j\u00e1 consultou todas as postagens associadas a essa categoria, e se voc\u00ea estiver em uma \u00fanica p\u00e1gina de postagem, o WordPress j\u00e1 buscou essa postagem para voc\u00ea.<\/p>\n<p>Quando queremos acessar as postagens que o WordPress consultou em nossos modelos, adicionamos o loop. Dentro do loop temos acesso a cada post. E para cada post decidimos o que mostrar ou fazer.<\/p>\n<p>Nota: Mesmo em modelos de postagem \u00fanica ou p\u00e1gina \u00fanica, voc\u00ea adicionar\u00e1 um loop, mesmo sabendo que cont\u00e9m apenas uma postagem! O loop simplesmente \u00e9 executado apenas uma vez.<\/p>\n<p>Aqui est\u00e1 o loop do WordPress em toda a sua gl\u00f3ria:<\/p>\n<pre><code>while (have_posts()): the_post();\n    \/\/ Access to each post here\nendwhile;<\/code><\/pre>\n<p>Este peda\u00e7o de c\u00f3digo faz duas coisas. A <code>while<\/code>parte (incluindo o <code>endwhile<\/code>) \u00e9 a parte do loop que far\u00e1 o loop independentemente do tempo em que houver postagens restantes. A segunda parte \u00e9 a <code>the_post()<\/code>que configura o acesso simplificado e intuitivo ao objeto post dentro do loop. Aprenderemos mais sobre isso mais adiante.<\/p>\n<p>\u00c9 uma boa pr\u00e1tica envolver o loop dentro de uma <code>if<\/code>verifica\u00e7\u00e3o que verifica se realmente existem postagens para percorrer. Ent\u00e3o, opcionalmente, tamb\u00e9m podemos mostrar uma mensagem se n\u00e3o houver. A consulta de postagem pode estar vazia se voc\u00ea for para um arquivo de categoria vazio ou tentar pesquisar algo que n\u00e3o tenha resultados. Esta \u00e9 uma vers\u00e3o melhor do loop:<\/p>\n<pre><code>if (have_posts()) {\n    while (have_posts()): the_post();\n        \/\/ Access to each post here\n    endwhile;\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}<\/code><\/pre>\n<p>Familiarize-se com este peda\u00e7o de c\u00f3digo, pois voc\u00ea o repetir\u00e1 sempre que quiser acessar as postagens! Vamos implementar o loop em nosso tema.<\/p>\n<h2>Implementando o loop em nosso tema<\/h2>\n<p>Vamos adicionar o loop em nosso <code>index.php<\/code>, substituindo o texto fict\u00edcio.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        the_title();\n    endwhile;\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}\n?&gt;\n&lt;?php get_sidebar(); ?&gt;\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>Eu adicionei uma fun\u00e7\u00e3o chamada <code>the_title()<\/code>dentro do loop que ecoa o t\u00edtulo do post. Isso \u00e9 s\u00f3 para que possamos ver o loop na pr\u00e1tica. N\u00e3o se preocupe, na <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-5-accessing-post-information\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">pr\u00f3xima etapa<\/a> aprenderemos tudo sobre como acessar todas as informa\u00e7\u00f5es reais da postagem.<\/p>\n<p>Vamos ver o que acontece no WordPress agora. Atualize a p\u00e1gina inicial. Dependendo de suas configura\u00e7\u00f5es e conte\u00fado, voc\u00ea dever\u00e1 ver alguns t\u00edtulos aparecendo. No meu WordPress eu tenho o post padr\u00e3o &#8220;Hello world!&#8221; e outro post que criei intitulado &#8220;Este \u00e9 outro post&#8221;. Isto \u00e9 o que eu recebo na primeira p\u00e1gina:<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-151614-61e4cd1ab5812.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-151614-61e4cd1ab5812.png\" alt=\"Tutorial de Tema WordPress para Iniciantes \u2013 Parte 4: O Post Loop\" ><\/a><\/p>\n<p>Se voc\u00ea tentar visitar uma \u00fanica p\u00e1gina de postagem, dever\u00e1 ver apenas um t\u00edtulo, o t\u00edtulo da postagem que est\u00e1 visualizando. Agrad\u00e1vel!<\/p>\n<h3>Para os curiosos\u2026<\/h3>\n<p>Se voc\u00ea est\u00e1 curioso sobre como o loop est\u00e1 circulando e quais par\u00e2metros o WordPress usou para esta consulta, voc\u00ea pode conferir. A vari\u00e1vel global \u00e0 qual o loop est\u00e1 se referindo \u00e9 chamada <code>$wp_query<\/code>. Voc\u00ea precisa defini-lo globalmente para acess\u00e1-lo. Tente usar <code>var_dump()<\/code>para imprimir seu conte\u00fado completo. O loop est\u00e1 percorrendo a <code>$wp_query-&gt;posts<\/code>propriedade.<\/p>\n<pre><code>global $wp_query;\nvar_dump($wp_query);<\/code><\/pre>\n<p>Vamos adicionar um detalhe importante ao nosso loop em <code>index.php<\/code>; uma maneira de o usu\u00e1rio navegar para a p\u00e1gina seguinte e anterior de postagens.<\/p>\n<h2>Adicionando navega\u00e7\u00e3o de loop de postagem<\/h2>\n<p>Lembre-se de que o loop buscar\u00e1 o n\u00famero de posts definido em suas Configura\u00e7\u00f5es do WordPress &gt; Leitura, sempre que voc\u00ea estiver em uma p\u00e1gina que mostre v\u00e1rios posts. Se houver mais postagens dispon\u00edveis no loop do que o n\u00famero definido aqui, precisamos de uma maneira de navegar entre as p\u00e1ginas. Para isso podemos usar a fun\u00e7\u00e3o <code>the_posts_pagination()<\/code>.<\/p>\n<p>Esta fun\u00e7\u00e3o aceita <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_posts_pagination\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">alguns par\u00e2metros<\/a> para personalizar sua sa\u00edda. Voc\u00ea pode definir o n\u00famero de p\u00e1ginas entre as elipses (quando houver muitas p\u00e1ginas). Voc\u00ea tamb\u00e9m pode definir quais devem ser os textos para os links das p\u00e1ginas &#8220;Anterior&#8221; e &#8220;Pr\u00f3xima&#8221;. Vou adicion\u00e1-lo sem nenhum par\u00e2metro para fazer os padr\u00f5es, mas voc\u00ea pode ajust\u00e1-lo se quiser.<\/p>\n<pre><code>...\n    while (have_posts()): the_post();\n        the_title();\n    endwhile;\n    the_posts_pagination();\n} else {\n...<\/code><\/pre>\n<p>Esta fun\u00e7\u00e3o n\u00e3o produz absolutamente nada se houver postagens menores ou iguais ao n\u00famero de postagens por configura\u00e7\u00e3o de p\u00e1gina. Portanto, n\u00e3o se preocupe se voc\u00ea acha que errou porque n\u00e3o v\u00ea nenhuma sa\u00edda. Quando houver mais postagens do que postagens por p\u00e1gina, essa fun\u00e7\u00e3o gera um div, um cabe\u00e7alho para leitores de tela (que voc\u00ea normalmente oculta com CSS) e v\u00e1rios links de pagina\u00e7\u00e3o.<\/p>\n<p>Agora que sabemos como ter acesso a qualquer post que o WordPress encontrou para n\u00f3s, o pr\u00f3ximo passo \u00e9 aprender a mostrar o que queremos de cada post; dentro do la\u00e7o.<\/p>\n<h2>Documenta\u00e7\u00e3o sobre os m\u00e9todos usados<\/h2>\n<ul>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/have_posts\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">have_posts<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_post\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">the_post<\/a><\/li>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_title\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">o t\u00edtulo<\/a><\/li>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_posts_pagination\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">the_post_pagination<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/awhitepixel.com\" class=\"external external_icon\">awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nesta li\u00e7\u00e3o de tema WordPress para iniciantes, entraremos em detalhes sobre o loop de postagem no WordPress; o que \u00e9, como funciona e por que o usamos.<\/p>\n","protected":false},"author":1,"featured_media":223872,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[930,898,898,722,722,837,920,1110,920,837,930,846,846,867,867],"tags":[1170],"class_list":["post-233968","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-assuntos","category-codigo-2","category-desenvolvedor","category-guia-para-iniciantes","category-outro","category-n-a","category-tutoriais","category-wordpress-8","tag-affiai-pt-pt"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/233968","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/comments?post=233968"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/233968\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/223872"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=233968"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=233968"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=233968"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}