{"id":234273,"date":"2023-02-26T18:26:00","date_gmt":"2023-02-26T15:26:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=234273"},"modified":"2022-11-12T03:10:38","modified_gmt":"2022-11-12T00:10:38","slug":"tutoriel-sur-le-theme-wordpress-pour-les-debutants-partie-4-la-boucle-de-publication","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fr\/tutoriel-sur-le-theme-wordpress-pour-les-debutants-partie-4-la-boucle-de-publication\/","title":{"rendered":"Tutoriel sur le th\u00e8me WordPress pour les d\u00e9butants \u2013 Partie 4 : La boucle de publication"},"content":{"rendered":"\n<p>Dans cette le\u00e7on du didacticiel sur le th\u00e8me WordPress pour les d\u00e9butants, nous aborderons en d\u00e9tail la &quot;boucle de publication&quot; dans WordPress\u00a0; qu&rsquo;est-ce que c&rsquo;est, \u00e0 quoi elle ressemble, pourquoi nous l&rsquo;utilisons et comment acc\u00e9der aux publications. Nous passerons ensuite \u00e0 la mise en \u0153uvre de la boucle dans notre th\u00e8me.<\/p>\n<h2>La boucle de poste<\/h2>\n<p>Si vous connaissez PHP, vous reconna\u00eetrez peut-\u00eatre qu&rsquo;une &quot;boucle&quot; est une technique consistant \u00e0 parcourir chaque \u00e9l\u00e9ment d&rsquo;un tableau ou d&rsquo;un objet avec <code>for<\/code>, <code>foreach<\/code>ou <code>while<\/code>. La boucle dans WordPress fonctionne exactement comme \u00e7a. Mais nous utiliserons les propres fonctions de WordPress pour boucler afin d&rsquo;obtenir des avantages et des simplifications suppl\u00e9mentaires.<\/p>\n<p>\u00c0 tout moment, WordPress a d\u00e9j\u00e0 interrog\u00e9 les publications pour vous, en fonction de la page sur laquelle vous vous trouvez. Si vous \u00eates sur une page de cat\u00e9gorie, WordPress a d\u00e9j\u00e0 interrog\u00e9 tous les articles associ\u00e9s \u00e0 cette cat\u00e9gorie, et si vous \u00eates sur une seule page d&rsquo;article, WordPress a d\u00e9j\u00e0 r\u00e9cup\u00e9r\u00e9 cet article pour vous.<\/p>\n<p>Lorsque nous voulons acc\u00e9der aux articles que WordPress a interrog\u00e9s dans nos mod\u00e8les, nous ajoutons la boucle. \u00c0 l&rsquo;int\u00e9rieur de la boucle, nous avons acc\u00e8s \u00e0 chaque poste. Et pour chaque publication, nous d\u00e9cidons quoi montrer ou faire.<\/p>\n<p>Remarque\u00a0: m\u00eame dans les mod\u00e8les de publication unique ou de page unique, vous ajouterez une boucle, m\u00eame si nous savons qu&rsquo;elle ne contient qu&rsquo;une seule publication\u00a0! La boucle ne s&rsquo;ex\u00e9cute qu&rsquo;une seule fois.<\/p>\n<p>Voici la boucle WordPress dans toute sa splendeur :<\/p>\n<pre><code>while (have_posts()): the_post();\n    \/\/ Access to each post here\nendwhile;<\/code><\/pre>\n<p>Ce morceau de code fait deux choses. La <code>while<\/code>partie (y compris le <code>endwhile<\/code>) est la partie en boucle qui bouclera aussi longtemps qu&rsquo;il reste des messages. La deuxi\u00e8me partie est la <code>the_post()<\/code>qui met en place un acc\u00e8s simplifi\u00e9 et intuitif \u00e0 l&rsquo;objet post \u00e0 l&rsquo;int\u00e9rieur de la boucle. Nous en apprendrons plus \u00e0 ce sujet plus tard.<\/p>\n<p>C&rsquo;est une bonne pratique d&rsquo;envelopper la boucle dans une <code>if<\/code>v\u00e9rification qui v\u00e9rifie s&rsquo;il y a r\u00e9ellement des publications \u00e0 parcourir. Ensuite, nous pouvons \u00e9galement \u00e9ventuellement afficher un message s&rsquo;il n&rsquo;y en avait pas. La requ\u00eate de publication peut \u00eatre vide si vous acc\u00e9dez \u00e0 une archive de cat\u00e9gorie vide ou essayez de rechercher quelque chose qui n&rsquo;a pas de r\u00e9sultats. Ceci est une meilleure version de la boucle\u00a0:<\/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>Familiarisez-vous avec ce morceau de code car vous le r\u00e9p\u00e9terez chaque fois que vous voudrez acc\u00e9der aux publications\u00a0! Impl\u00e9mentons la boucle dans notre th\u00e8me.<\/p>\n<h2>Impl\u00e9mentation de la boucle dans notre th\u00e8me<\/h2>\n<p>Ajoutons la boucle dans notre <code>index.php<\/code>, en rempla\u00e7ant le texte factice.<\/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>J&rsquo;ai ajout\u00e9 une fonction appel\u00e9e <code>the_title()<\/code>\u00e0 l&rsquo;int\u00e9rieur de la boucle qui fait \u00e9cho au titre du message. C&rsquo;est juste pour que nous puissions voir la boucle dans la pratique. Ne vous inqui\u00e9tez pas, \u00e0 <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\">l&rsquo;\u00e9tape suivante<\/a>, nous apprendrons tout sur l&rsquo;acc\u00e8s \u00e0 toutes les informations de publication r\u00e9elles.<\/p>\n<p>Voyons maintenant ce qui se passe dans WordPress. Rafra\u00eechir la premi\u00e8re page. En fonction de vos param\u00e8tres et de votre contenu, vous devriez voir appara\u00eetre certains titres. Dans mon WordPress, j&rsquo;ai le post par d\u00e9faut &quot;Hello world!&quot; et un autre message que j&rsquo;ai cr\u00e9\u00e9 intitul\u00e9 &quot;Ceci est un autre message&quot;. Voici ce que j&rsquo;obtiens sur la page d&rsquo;accueil\u00a0:<\/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=\"Tutoriel sur le th\u00e8me WordPress pour les d\u00e9butants \u2013 Partie 4 : La boucle de publication\" ><\/a><\/p>\n<p>Si vous essayez de visiter une seule page de publication, vous ne devriez voir qu&rsquo;un seul titre, le titre de la publication que vous consultez. Agr\u00e9able!<\/p>\n<h3>Pour les curieux\u2026<\/h3>\n<p>Si vous \u00eates curieux de savoir ce que la boucle parcourt et quels param\u00e8tres WordPress a utilis\u00e9 pour cette requ\u00eate, vous pouvez le v\u00e9rifier. La variable globale \u00e0 laquelle la boucle fait r\u00e9f\u00e9rence est appel\u00e9e <code>$wp_query<\/code>. Vous devez le d\u00e9finir globalement pour y acc\u00e9der. Essayez d&rsquo;utiliser <code>var_dump()<\/code>pour imprimer son contenu complet. La boucle parcourt la <code>$wp_query-&gt;posts<\/code>propri\u00e9t\u00e9.<\/p>\n<pre><code>global $wp_query;\nvar_dump($wp_query);<\/code><\/pre>\n<p>Ajoutons un d\u00e9tail important \u00e0 notre boucle dans <code>index.php<\/code>; un moyen pour l&rsquo;utilisateur de naviguer vers la page suivante et pr\u00e9c\u00e9dente des publications.<\/p>\n<h2>Ajout de la navigation post-boucle<\/h2>\n<p>Gardez \u00e0 l&rsquo;esprit que la boucle r\u00e9cup\u00e8rera le nombre de publications d\u00e9fini dans vos param\u00e8tres WordPress&gt; Lecture, chaque fois que vous vous trouvez sur une page qui affiche plusieurs publications. S&rsquo;il y a plus de messages disponibles dans la boucle que le nombre d\u00e9fini ici, nous avons besoin d&rsquo;un moyen de naviguer entre les pages. Pour cela, nous pouvons utiliser la fonction <code>the_posts_pagination()<\/code>.<\/p>\n<p>Cette fonction accepte <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_posts_pagination\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">certains param\u00e8tres<\/a> pour personnaliser sa sortie. Vous pouvez d\u00e9finir le nombre de pages entre les points de suspension (lorsqu&rsquo;il y a beaucoup de pages). Vous pouvez \u00e9galement d\u00e9finir ce que doivent \u00eatre les textes des liens des pages &quot;Pr\u00e9c\u00e9dent&quot; et &quot;Suivant&quot;. Je vais l&rsquo;ajouter sans aucun param\u00e8tre afin de faire les valeurs par d\u00e9faut, mais vous pouvez l&rsquo;ajuster si vous le souhaitez.<\/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>Cette fonction ne produit absolument rien s&rsquo;il y a moins ou autant de publications que le nombre de publications par param\u00e8tre de page. Donc ne vous inqui\u00e9tez pas si vous pensez que vous vous \u00eates tromp\u00e9 parce que vous ne voyez aucune sortie. Une fois qu&rsquo;il y a plus de messages que de messages par page, cette fonction g\u00e9n\u00e8re un div, un titre pour les lecteurs d&rsquo;\u00e9cran (que vous masquez g\u00e9n\u00e9ralement avec CSS) et un certain nombre de liens de pagination.<\/p>\n<p>Maintenant que nous savons comment acc\u00e9der \u00e0 n&rsquo;importe quel article que WordPress a trouv\u00e9 pour nous, l&rsquo;\u00e9tape suivante consiste \u00e0 apprendre \u00e0 montrer ce que nous voulons de chaque article ; \u00e0 l&rsquo;int\u00e9rieur de la boucle.<\/p>\n<h2>Documentation sur les m\u00e9thodes utilis\u00e9es<\/h2>\n<ul>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/have_posts\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">avoir_posts<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_post\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la poste<\/a><\/li>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/the_title\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le titre<\/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\">Source d&rsquo;enregistrement:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/awhitepixel.com\" class=\"external external_icon\">awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dans cette le\u00e7on sur le th\u00e8me WordPress pour d\u00e9butants, nous entrerons dans les d\u00e9tails de la boucle de publication dans WordPress ; ce que c&rsquo;est, comment \u00e7a marche et pourquoi nous l&rsquo;utilisons.<\/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":[915,893,893,717,717,832,915,1110,832,925,925,841,841,862,862],"tags":[1167],"class_list":["post-234273","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-autre","category-code-2","category-developpeur","category-guide-pour-les-debutants","category-n-a","category-sujets","category-tutoriels","category-wordpress-3","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/234273","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/comments?post=234273"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/234273\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media\/223872"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media?parent=234273"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/categories?post=234273"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/tags?post=234273"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}