{"id":230487,"date":"2022-12-01T11:02:00","date_gmt":"2022-12-01T08:02:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=230487"},"modified":"2022-11-09T22:36:28","modified_gmt":"2022-11-09T19:36:28","slug":"ajout-dune-classe-de-corps-basee-sur-un-modele","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fr\/ajout-dune-classe-de-corps-basee-sur-un-modele\/","title":{"rendered":"Ajout d&rsquo;une classe de corps bas\u00e9e sur un mod\u00e8le"},"content":{"rendered":"\n<p>Travailler avec des mod\u00e8les dans WordPress n&rsquo;est pas rare. Tout est une sorte de mod\u00e8le &#8211; du mod\u00e8le de page principale, du mod\u00e8le de page unique, du mod\u00e8le 404 &#8211; jusqu&rsquo;aux mod\u00e8les personnalis\u00e9s.<\/p>\n<p>Parfois, cependant, vous souhaiterez peut-\u00eatre appliquer une classe \u00e0 l&rsquo; <code>body<\/code>\u00e9l\u00e9ment en fonction du mod\u00e8le utilis\u00e9 afin de pouvoir styliser ce mod\u00e8le particulier un peu diff\u00e9remment du reste du site.<\/p>\n<p>Bien que vous puissiez le faire de diff\u00e9rentes mani\u00e8res, pour le faire, nous avons tous nos m\u00e9thodes, alors j&rsquo;ai pens\u00e9 partager la mienne.<\/p>\n<h2>Classe de corps bas\u00e9e sur un mod\u00e8le<\/h2>\n<p>Avant de sauter dans le code pour ajouter une classe de corps bas\u00e9e sur un mod\u00e8le, il est important de noter que je suppose que le mod\u00e8le est nomm\u00e9 au format suivant: <code>template-{name-of-template}.php<\/code>.<\/p>\n<p>Disons que vous travaillez sur un mod\u00e8le pour afficher des informations sur le poids que vous avez perdu en un mois et que vous souhaitez le faire en utilisant un mod\u00e8le pour cela. Le mod\u00e8le peut \u00eatre nomm\u00e9 <code>template-weight-loss.php<\/code>.<\/p>\n<p>Voici le truc: appliquer le nom de la classe \u00e0 une seule page qui utilise ce mod\u00e8le n&rsquo;est pas un gros probl\u00e8me. Mais si vous avez plusieurs pages qui utilisent ce mod\u00e8le (ce qui, si vous ex\u00e9cutez un site dans lequel de nombreuses personnes peuvent utiliser ce mod\u00e8le, cela a du sens, n&rsquo;est-ce pas\u00a0?), alors vous voudrez vous assurer d&rsquo;appliquer le nom de la classe \u00e0 chaque page que ce mod\u00e8le.<\/p>\n<p>Mais comment?<\/p>\n<p>Il existe plusieurs fa\u00e7ons de proc\u00e9der, mais cela n\u00e9cessite au moins les \u00e9l\u00e9ments suivants\u00a0:<\/p>\n<ol>\n<li>Accrocher au crochet <strong><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/body_class\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">body_class fourni par WordPress,<\/a><\/strong><\/li>\n<li>Lecture du nom du mod\u00e8le,<\/li>\n<li>L&rsquo;appliquer au nom de classe du corps (si la page utilise le mod\u00e8le)<\/li>\n<\/ol>\n<p>Heureusement, c&rsquo;est facile \u00e0 faire car le hook passe un tableau de classes dans une fonction hook\u00e9e et les m\u00e9tadonn\u00e9es d&rsquo;un article donn\u00e9 indiquent s&rsquo;il utilise ou non un mod\u00e8le.<\/p>\n<p>Cela dit, <strong><a href=\"https:\/\/gist.github.com\/tommcfarlin\/e053ff5fdc82af9854bf7031d57a759d#file-00-add-body-class-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">voici comment cela peut \u00eatre r\u00e9alis\u00e9 :<\/a><\/strong><\/p>\n<pre><code>&lt;?php\n\nadd_filter('body_class', 'acme_add_body_class');\n\/**\n * If the current page has a template, apply it's name to the list of classes. This is\n * necessary if there are multiple pages with the same template and you want to apply the\n * name of the template to the class of the body.\n *\n * @param array $classes The current array of attributes to be applied to the \n *\/\nfunction acme_add_body_class($classes)\n{\n  if (!empty(get_post_meta(get_the_ID(), '_wp_page_template', true))) {\n      \/\/ Remove the `template-` prefix and get the name of the template without the file extension.\n      $templateName = basename(get_page_template_slug(get_the_ID()));\n      $templateName = str_ireplace('template-', '', basename(get_page_template_slug(get_the_ID()), '.php'));\n\n      $classes[] = $templateName;\n  }\n\n  return array_filter($classes);\n}\n<\/code><\/pre>\n<p>Notez que vous pouvez utiliser une fermeture pour cela plut\u00f4t qu&rsquo;un nom de fonction accroch\u00e9 et une fonction ind\u00e9pendante, mais \u00e9tant donn\u00e9 que diff\u00e9rentes personnes lisant ceci utilisent diff\u00e9rentes versions de PHP, le moyen le plus simple de le d\u00e9montrer est de l&rsquo;utiliser ci-dessus.<\/p>\n<h2>Pourquoi faire ceci?<\/h2>\n<p>De mani\u00e8re g\u00e9n\u00e9rale, si votre page porte le m\u00eame nom que le mod\u00e8le appliqu\u00e9, elle aura un nom de classe qui correspond au nom de la page.<\/p>\n<p>Autrement dit, disons que vous avez une page et son nom est la perte de poids. L&rsquo; <code>body<\/code>\u00e9l\u00e9ment aura une <code>weight loss<\/code>classe. Mais si vous utilisez un deuxi\u00e8me, un troisi\u00e8me, un quatri\u00e8me ou plus sur une page qui a un titre diff\u00e9rent, elle n&rsquo;aura pas cette classe.<\/p>\n<p>Si vous voulez vous assurer que le <code>body<\/code>nom de la classe est bas\u00e9 sur le mod\u00e8le, le code ci-dessus garantira que cela fonctionne.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Source d&rsquo;enregistrement:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un moyen simple d&rsquo;appliquer une classe de corps bas\u00e9e sur un nom de mod\u00e8le \u00e0 l&rsquo;aide des API WordPress et des fonctions PHP.<\/p>\n","protected":false},"author":1,"featured_media":163533,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[915,893,717,801,841,862],"tags":[1167],"class_list":["post-230487","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-autre","category-code-2","category-developpeur","category-php-3","category-tutoriels","category-wordpress-3","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/230487","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=230487"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/230487\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media\/163533"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media?parent=230487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/categories?post=230487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/tags?post=230487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}