{"id":234201,"date":"2023-02-11T20:22:00","date_gmt":"2023-02-11T17:22:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=234201"},"modified":"2022-11-12T00:02:10","modified_gmt":"2022-11-11T21:02:10","slug":"tutoriel-sur-le-theme-wordpress-pour-les-debutants-partie-5-acceder-aux-informations-sur-les-publications","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fr\/tutoriel-sur-le-theme-wordpress-pour-les-debutants-partie-5-acceder-aux-informations-sur-les-publications\/","title":{"rendered":"Tutoriel sur le th\u00e8me WordPress pour les d\u00e9butants \u2013 Partie 5 : Acc\u00e9der aux informations sur les publications"},"content":{"rendered":"\n<p>Cette le\u00e7on du didacticiel sur le th\u00e8me WordPress pour les d\u00e9butants portera sur la fa\u00e7on dont nous pouvons acc\u00e9der et produire des informations telles que son lien, son titre, etc. \u00e0 partir de chaque article lorsqu&rsquo;il se trouve dans la boucle de publication. Nous faisons cela avec des balises de mod\u00e8le. Dans le processus, nous ajouterons \u00e9galement les mod\u00e8les de vue unique \u00e0 notre th\u00e8me.<\/p>\n<p>Dans l&rsquo; <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-4-accessing-posts-with-the-loop\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">\u00e9tape pr\u00e9c\u00e9dente,<\/a> nous avons ajout\u00e9 la boucle post qui inclut la <code>the_post()<\/code>fonction. Cette fonction d\u00e9finit des variables globales et s&rsquo;assure que nous pouvons utiliser des appels de fonction simples et intuitifs, appel\u00e9s <a href=\"https:\/\/codex.wordpress.org\/Template_Tags\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">balises de mod\u00e8le<\/a>, pendant que nous sommes \u00e0 l&rsquo;int\u00e9rieur de la <code>while<\/code>boucle.<\/p>\n<h2>Balises de mod\u00e8le les plus courantes \u00e0 utiliser dans la boucle de publication<\/h2>\n<p>Voici une liste des balises de mod\u00e8le les plus courantes que vous voudriez utiliser pour acc\u00e9der aux informations d&rsquo;une publication\u00a0:<\/p>\n<ul>\n<li><code>the_title()<\/code>fait \u00e9cho au titre du message.<\/li>\n<li><code>the_permalink()<\/code>affiche le permalien\/l&rsquo;URL de la publication.<\/li>\n<li><code>the_content()<\/code>affiche le contenu de l&rsquo;article (depuis l&rsquo;\u00e9diteur)<\/li>\n<li><code>the_excerpt()<\/code>fait \u00e9cho \u00e0 l&rsquo;extrait du message. Si le champ d&rsquo;extrait est vide, cela fera \u00e9cho aux 55 premiers mots du contenu de la publication avec &quot;&#8230;&quot;<\/li>\n<li><code>the_ID()<\/code>affiche l&rsquo;ID de la publication.<\/li>\n<li><code>the_category()<\/code>fait \u00e9cho \u00e0 toutes les cat\u00e9gories associ\u00e9es.<\/li>\n<li><code>the_tags()<\/code>affiche toutes les balises associ\u00e9es.<\/li>\n<li><code>the_date()<\/code>fait \u00e9cho \u00e0 la date de publication du message.<\/li>\n<li><code>the_time()<\/code>affiche l&rsquo;heure de publication du message.<\/li>\n<li><code>the_author()<\/code>fait \u00e9cho au nom d&rsquo;affichage de l&rsquo;auteur du message<\/li>\n<li><code>the_post_thumbnail()<\/code>produit l&rsquo;image s\u00e9lectionn\u00e9e du message. Nous apprendrons comment ajouter la prise en charge des vignettes en vedette plus tard dans ce didacticiel.<\/li>\n<\/ul>\n<p>Il y en a beaucoup plus. Si vous \u00eates int\u00e9ress\u00e9, jetez un \u0153il \u00e0 la documentation de WordPress Codex <a href=\"https:\/\/codex.wordpress.org\/Template_Tags\/#Post_tags\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">sur toutes les balises de publication<\/a>. Jetez \u00e9galement un coup d&rsquo;\u0153il en dehors de la rubrique &quot;tags de publication&quot; pour en savoir plus &#8211; ils sont un peu \u00e9parpill\u00e9s sur cette page.<\/p>\n<p>Commen\u00e7ons \u00e0 impl\u00e9menter certaines de ces balises dans notre fichier <code>index.php<\/code>. J&rsquo;ajouterai \u00e9galement du HTML tr\u00e8s basique juste pour mieux formater la sortie. Je vous encourage \u00e0 ajouter votre propre HTML! Ajoutez des divs, des spans, des sections, des en-t\u00eates, etc. avec les classes de votre choix.<\/p>\n<h2>Concr\u00e9tiser la boucle dans index.php<\/h2>\n<p>\u00c0 l&rsquo;int\u00e9rieur de la boucle de notre <code>index.php<\/code>, je voudrais ajouter un lien qui m\u00e8ne au permalien de la publication. \u00c0 l&rsquo;int\u00e9rieur du lien, je voudrais faire \u00e9cho au titre du message. Ensuite, je voudrais \u00e9galement faire \u00e9cho \u00e0 l&rsquo;extrait du message et \u00e0 ses cat\u00e9gories.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;\n                &lt;a href=\"&lt;?php the_permalink(); ?&gt;\" title=\"&lt;?php the_title(); ?&gt;\"&gt;&lt;?php the_title(); ?&gt;&lt;\/a&gt;\n            &lt;\/h2&gt;\n            &lt;?php the_excerpt(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n        &lt;\/article&gt;\n    endwhile;\n    the_posts_pagination();\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>Ce que fait le code ci-dessus est;<\/p>\n<ul>\n<li>La ligne #5 ajoute la <code>&lt;article&gt;<\/code>balise HTML avec un appel <code>post_class()<\/code>qui g\u00e9n\u00e8re des classes de publication utiles &#8211; tout comme <code>body_class()<\/code>nous l&rsquo;avons utilis\u00e9 dans une <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-3-dynamic-content\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">\u00e9tape pr\u00e9c\u00e9dente<\/a>.<\/li>\n<li>Aux lignes 6 \u00e0 8, nous ajoutons une <code>&lt;h2&gt;<\/code>balise pour le titre, avec un lien vers le permalien de la publication (vue unique).<\/li>\n<li>La ligne n \u00b0 9 fait \u00e9cho \u00e0 l&rsquo;extrait du message.<\/li>\n<li>Et \u00e0 la ligne 10, nous faisons \u00e9cho aux cat\u00e9gories de la publication. Comme je ne transmets aucun argument \u00e0 cet appel, il s&rsquo;agit par d\u00e9faut d&rsquo;une <code>&lt;ul&gt;<\/code>liste.<\/li>\n<\/ul>\n<p>Cela se traduit par le r\u00e9sultat suivant lors de l&rsquo;actualisation de la page d&rsquo;accueil\u00a0:<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e51609c0d16.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-153917-61e51609c0d16.png\" alt=\"Tutoriel sur le th\u00e8me WordPress pour les d\u00e9butants \u2013 Partie 5 : Acc\u00e9der aux informations sur les publications\" ><\/a><\/p>\n<p>Nous allons quelque part! Je vous encourage \u00e0 consulter la documentation de chaque fonction de balise pour les param\u00e8tres qu&rsquo;ils acceptent. Vous pouvez modifier un peu la sortie\u00a0! Et d\u00e9cidez vous-m\u00eame des balises de mod\u00e8le \u00e0 utiliser.<\/p>\n<p>Essayez de cliquer sur le lien d&rsquo;un article et voyez que vous arrivez sur cette page d&rsquo;article unique. Vous pouvez maintenant voir que la boucle ne montre qu&rsquo;un seul message. Cependant, \u00e9tant donn\u00e9 que nous n&rsquo;avons actuellement qu&rsquo;un seul mod\u00e8le, <code>index.php<\/code>, la vue unique utilise \u00e9galement ce mod\u00e8le. Donc, la vue unique n&rsquo;a pas beaucoup de sens. Nous n&rsquo;en avons pas besoin pour cr\u00e9er un lien vers lui-m\u00eame, et nous voulons voir le contenu complet de la publication\u00a0! R\u00e9solvons cela en cr\u00e9ant notre deuxi\u00e8me mod\u00e8le dans notre th\u00e8me.<\/p>\n<h2>Cr\u00e9ation de mod\u00e8les de vue unique<\/h2>\n<p>Si vous vous souvenez de la <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-1-introduction\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le\u00e7on 1<\/a> du didacticiel sur le th\u00e8me WordPress pour les d\u00e9butants, nous avons examin\u00e9 la hi\u00e9rarchie des mod\u00e8les? Lorsque nous sommes sur une seule publication ou page, WordPress recherche <code>single.php<\/code>des publications et <code>page.php<\/code>des pages. Si l&rsquo;un d&rsquo;entre eux n&rsquo;a pas \u00e9t\u00e9 trouv\u00e9, WordPress se rabat sur <code>singular.php<\/code>celui qui est partag\u00e9 quel que soit le type de publication. Cependant, les th\u00e8mes sont g\u00e9n\u00e9ralement mis en \u0153uvre <code>single.php<\/code>et en <code>page.php<\/code>raison des diff\u00e9rences entre les articles et les pages. Les pages n&rsquo;ont pas de cat\u00e9gories ni de balises, et comme les pages sont g\u00e9n\u00e9ralement utilis\u00e9es pour du contenu statique, elles n&rsquo;affichent normalement pas la date de publication ni les commentaires. Cela d\u00e9pend enti\u00e8rement de vous.<\/p>\n<p>Nous allons cr\u00e9er <code>single.php<\/code>et <code>page.php<\/code>pour notre th\u00e8me. Commen\u00e7ons d&rsquo;abord par les messages.<\/p>\n<h3>Mod\u00e8le de publication unique<\/h3>\n<p>Dans votre dossier de th\u00e8me, faites une copie de <code>index.php<\/code>et renommez-le en <code>single.php<\/code>. Dans <code>single.php<\/code>, nous supprimerons le permalien (qui renvoie \u00e0 lui-m\u00eame) et remplacerons l&rsquo;extrait par le contenu complet de la publication. Et enfin, nous n&rsquo;avons pas besoin de navigation dans les archives ici.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n        &lt;\/article&gt;\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>Ajoutons quelques informations plus utiles; tels que la date du message et le nom de l&rsquo;auteur. Encore une fois, je vous encourage \u00e0 ajouter des balises HTML pour cr\u00e9er une structure HTML beaucoup plus agr\u00e9able.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n            &lt;p&gt;Posted: &lt;?php the_date(); ?&gt; at &lt;?php the_time(); ?&gt;&lt;\/p&gt;\n            &lt;p&gt;Author: &lt;?php the_author(); ?&gt;&lt;\/p&gt;\n        &lt;\/article&gt;\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>Les fonctions <code>the_time()<\/code>et <code>the_date()<\/code>feront \u00e9cho \u00e0 la date et \u00e0 l&rsquo;heure dans le format que vous avez d\u00e9fini dans le panneau d&rsquo;administration &gt; Param\u00e8tres. Cependant, vous pouvez remplacer cela en fournissant un format de date diff\u00e9rent en tant que param\u00e8tre de ces m\u00e9thodes.<\/p>\n<p>La fonction <code>the_author()<\/code>fait \u00e9cho au &quot;nom d&rsquo;affichage&quot; de l&rsquo;auteur. Si l&rsquo;utilisateur n&rsquo;a fourni aucun autre nom dans son profil, cela fera \u00e9cho au nom d&rsquo;utilisateur.<\/p>\n<p>Je vous <strong>encourage fortement<\/strong> \u00e0 ne jamais imprimer les noms d&rsquo;utilisateur car cela peut constituer une menace pour la s\u00e9curit\u00e9. Assurez-vous toujours que tous les auteurs ont fourni un nom propre ou n&rsquo;utilisent pas <code>the_author()<\/code>.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e5160aa02dd.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-153917-61e5160aa02dd.png\" alt=\"Tutoriel sur le th\u00e8me WordPress pour les d\u00e9butants \u2013 Partie 5 : Acc\u00e9der aux informations sur les publications\" ><\/a><\/p>\n<p>Voici \u00e0 quoi ressemble un seul message pour moi maintenant. Impressionnant! Cr\u00e9ons le mod\u00e8le d&rsquo;une seule page.<\/p>\n<h3>Mod\u00e8le de page unique<\/h3>\n<p>Faites une copie de votre <code>single.php<\/code>et renommez-le en <code>page.php<\/code>. Tout ce que j&rsquo;ai fait <code>page.php<\/code>\u00e9tait de supprimer tout ce qui n&rsquo;\u00e9tait pas li\u00e9 aux pages. L&rsquo;\u00e9cho des cat\u00e9gories pour les pages ne fonctionnera pas, et j&rsquo;ai \u00e9galement supprim\u00e9 la date, l&rsquo;heure et l&rsquo;auteur. Voici ce que nous obtenons<code>page.php<\/code>\u00a0:<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n        &lt;\/article&gt;\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>Nous commen\u00e7ons enfin \u00e0 avancer avec nos mod\u00e8les\u00a0! Cependant, je ne peux pas r\u00e9p\u00e9ter cela assez; Je vous encourage \u00e0 modifier les mod\u00e8les et les param\u00e8tres des fonctions \u00e0 votre guise. Surtout en ajoutant plus de wrappers HTML pour faciliter le style plus tard.<\/p>\n<p>Dans l&rsquo;\u00e9tape suivante, nous nous \u00e9loignons un peu des mod\u00e8les et entrons davantage dans le codage backend des th\u00e8mes WordPress.<\/p>\n<h2>Documentation sur les m\u00e9thodes utilis\u00e9es<\/h2>\n<ul>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/post_class\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">post_class<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_permalink\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le_permalien<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_title\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le titre<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_excerpt\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">l_extrait<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_category\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la_cat\u00e9gorie<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_content\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le contenu<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_date\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la date<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_time\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le temps<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_author\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">l&rsquo;auteur<\/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>Cette le\u00e7on portera sur la mani\u00e8re dont nous pouvons acc\u00e9der aux informations de chaque publication et les afficher \u00e0 l&rsquo;int\u00e9rieur de la boucle WordPress \u00e0 l&rsquo;aide de balises de mod\u00e8le.<\/p>\n","protected":false},"author":1,"featured_media":223885,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[893,893,832,1110,801,801,832,925,925,841,841,862,862],"tags":[1167],"class_list":{"0":"post-234201","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","6":"hentry","7":"category-code-2","9":"category-guide-pour-les-debutants","10":"category-n-a","11":"category-php-3","14":"category-sujets","16":"category-tutoriels","18":"category-wordpress-3","20":"tag-affiai-fr"},"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/234201","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=234201"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/234201\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media\/223885"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media?parent=234201"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/categories?post=234201"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/tags?post=234201"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}