{"id":229914,"date":"2022-11-16T19:07:00","date_gmt":"2022-11-16T16:07:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=229914"},"modified":"2022-11-09T19:16:11","modified_gmt":"2022-11-09T16:16:11","slug":"modeles-wordpress-pour-debutants-comment-cest","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fr\/modeles-wordpress-pour-debutants-comment-cest\/","title":{"rendered":"Mod\u00e8les WordPress pour d\u00e9butants : comment c&rsquo;est"},"content":{"rendered":"\n<p>Lorsque j&rsquo;ai commenc\u00e9 \u00e0 penser aux mod\u00e8les dans WordPress, j&rsquo;ai pens\u00e9 \u00e0 deux aspects\u00a0:<\/p>\n<ol>\n<li>contenu sp\u00e9cifiquement pour les <a href=\"https:\/\/tommcfarlin.com\/register\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">membres<\/a> ,<\/li>\n<li>contenu qui pourrait se d\u00e9composer en un seul message.<\/li>\n<\/ol>\n<p>Mais plus j&rsquo;y pensais, plus je r\u00e9alisais que cela pouvait (et devrait sans doute) \u00eatre expliqu\u00e9 au cours de quelques articles.<\/p>\n<p>Je vais donc d\u00e9composer l&rsquo;\u00e9tat actuel des mod\u00e8les WordPress et ensuite les moyens pratiques que nous pouvons prendre pour organiser, disons, nos plugins afin que nous utilisions PHP standard.<\/p>\n<p>Apr\u00e8s cela, dans une prochaine s\u00e9rie, j&rsquo;examinerai ce que cela signifie d&rsquo;utiliser d&rsquo;autres moteurs de templates (\u00e0 la fois PHP et JavaScript dans le travail que nous faisons).<\/p>\n<p>Pour commencer, cependant, je veux voir comment nous voyons souvent des mod\u00e8les \u00e9crits dans le contexte des th\u00e8mes et des plugins WordPress.<\/p>\n<h2>Mod\u00e8les WordPress pour les d\u00e9butants<\/h2>\n<p>En fonction de votre exp\u00e9rience avec WordPress et d&rsquo;autres syst\u00e8mes bas\u00e9s sur PHP, votre d\u00e9finition des mod\u00e8les sera diff\u00e9rente de celle de quelqu&rsquo;un d&rsquo;autre.<\/p>\n<p>Donc, pour essayer de cr\u00e9er une d\u00e9finition commune que j&rsquo;utiliserai tout au long de cette s\u00e9rie d&rsquo;articles, je vais utiliser <a href=\"https:\/\/codex.wordpress.org\/Templates\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">le WordPress Codex\u00a0:<\/a><\/p>\n<blockquote>\n<p>Les mod\u00e8les sont les fichiers qui contr\u00f4lent la fa\u00e7on dont votre site WordPress sera affich\u00e9 sur le Web.<\/p>\n<\/blockquote>\n<p>La page poursuit en expliquant comment cela fonctionne en conjonction avec la base de donn\u00e9es et d&rsquo;autres actifs, et je vous recommande de lire \u00e0 ce sujet si vous ne la connaissez pas.<\/p>\n<p>Cependant, la d\u00e9finition ci-dessus fonctionne bien pour la fa\u00e7on dont je pr\u00e9vois d&rsquo;aller de l&rsquo;avant en y r\u00e9fl\u00e9chissant.<\/p>\n<h3>1 Comment c&rsquo;est (en ce moment)<\/h3>\n<p>Quand il s&rsquo;agit de penser aux mod\u00e8les WordPress, je pense qu&rsquo;il est utile de consid\u00e9rer un seul mod\u00e8le avec un code qui <a href=\"https:\/\/gist.github.com\/tommcfarlin\/2c02b22272f645076f7f735bd61a4034#file-00-content-container-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ressemble \u00e0 ceci :<\/a><\/p>\n<pre><code>&lt;div id=\"content-container\"&gt;\n\n  &lt;p&gt;\n    Oh! The garbage chute was a really wonderful idea. What an incredible smell you've discovered! Let's get out of here! \n    Get away from there... No! wait! Will you forget it? I already tried it. It's magnetically sealed! Put that \n    thing away! You're going to get us all killed.\n  &lt;\/p&gt;\n\n  &lt;h2&gt;List of Post Titles For Acme Post Type&lt;\/h2&gt;\n  &lt;?php\n  $args = array(\n    'post_status'    =&gt; 'publish',\n    'post_type'      =&gt; 'acme',\n    'posts_per_page' =&gt; '10'\n  );\n  $custom_query = new WP_Query( $args );\n\n  if ($custom_query-&gt;have_posts()) {\n    echo '&lt;ul&gt;';\n    while ($custom_query-&gt;have_posts()) {\n      $custom_query-&gt;the_post();\n      echo '&lt;li&gt;'. get_the_title(). '&lt;\/li&gt;';\n    }\n    echo '&lt;\/ul&gt;';\n    wp_reset_postdata();\n  }\n  ?&gt;\n\n  &lt;p&gt;\n    Absolutely, Your Worship. Look, I had everything under control until you led us down here. You know, it's not \n    going to take them long to figure out what happened to us. It could be worst... It's worst. \n    There's something alive in here! That's your imagination. Something just moves past my leg! \n    Look! Did you see that? What? Help!\n  &lt;\/p&gt;\n\n&lt;\/div&gt;&lt;!-- #content-container --&gt;<\/code><\/pre>\n<p>Le point du code ci-dessus est que vous voyez, c&rsquo;est qu&rsquo;il m\u00e9lange PHP et HTML.<\/p>\n<p>De plus, il est important de noter que chacun de ces fichiers est stylis\u00e9 \u00e0 l&rsquo;aide de CSS et peut avoir un comportement suppl\u00e9mentaire contr\u00f4l\u00e9 via JavaScript. \u00c0 cette fin, vous pouvez le conceptualiser comme ceci\u00a0:<\/p>\n<p>Cela repr\u00e9sente un mod\u00e8le unique m\u00e9langeant \u00e0 la fois HTML et PHP dans un seul mod\u00e8le. Et ce mod\u00e8le est ensuite stylis\u00e9 avec CSS et contr\u00f4l\u00e9 avec JavaScript.<\/p>\n<p>Tous ces \u00e9l\u00e9ments fonctionnent ensemble pour fournir ce que l&rsquo;utilisateur voit.<\/p>\n<h3>2 L&rsquo;organisation de d\u00e9veloppeurs engendre-t-elle des performances\u00a0?<\/h3>\n<p>Mais la fa\u00e7on dont cela fonctionne est un peu d\u00e9sordonn\u00e9e, et bien que cela puisse sembler bon pour l&rsquo;utilisateur, cela soul\u00e8ve quelques questions\u00a0:<\/p>\n<ul>\n<li>Est-il aussi performant qu&rsquo;il pourrait l&rsquo;\u00eatre ?<\/li>\n<li>Est-ce facile \u00e0 maintenir pour un d\u00e9veloppeur\u00a0?<\/li>\n<li>Quel est le processus de construction\u00a0?<\/li>\n<li>comment les actifs sont-ils entretenus et organis\u00e9s\u00a0?<\/li>\n<\/ul>\n<p>Bien s\u00fbr, la plupart de ce que vous lisez ci-dessus est tr\u00e8s centr\u00e9 sur le d\u00e9veloppeur, mais je trouve que lorsqu&rsquo;un code est organis\u00e9 de telle mani\u00e8re qu&rsquo;il est facile pour les d\u00e9veloppeurs de travailler avec, il peut souvent \u00eatre facile encore plus rapide pour l&rsquo;utilisateur.<\/p>\n<p>Qu&rsquo;est-ce que cela signifie, cependant?<\/p>\n<ul>\n<li>Pr\u00e9sentons-nous Sass ?<\/li>\n<li>Minifions-nous JavaScript\u00a0?<\/li>\n<li>Comment combiner ces actifs et les importer ?<\/li>\n<li>Qu&rsquo;en est-il des requ\u00eates PHP personnalis\u00e9es qui se produisent dans le contexte de chaque mod\u00e8le\u00a0?<\/li>\n<\/ul>\n<p>Et bien que les premi\u00e8res choses soient importantes et en valent la peine (et que je couvrirai peut-\u00eatre une s\u00e9rie apr\u00e8s cela), s\u00e9parer la logique d&rsquo;un mod\u00e8le, m\u00eame sans moteur de mod\u00e8les, peut aider \u00e0 rendre le code plus centr\u00e9 sur le d\u00e9veloppeur.<\/p>\n<p>Est-ce que cela rend les choses plus rapides pour l&rsquo;utilisateur\u00a0? Pas n\u00e9cessairement. Mais cela nous aide \u00e0 faire le premier pas pour y parvenir.<\/p>\n<h2>R\u00e9organisons-nous<\/h2>\n<p>Dans le prochain article de cette s\u00e9rie, je d\u00e9composerai le contenu que nous avons l&rsquo;habitude de voir dans les mod\u00e8les WordPress \u00e0 travers un exemple et commencerai \u00e0 le r\u00e9organiser afin qu&rsquo;il soit mieux organis\u00e9 de mani\u00e8re \u00e0 ce que les techniques puissent \u00eatre utilis\u00e9es dans diff\u00e9rents projets.<\/p>\n<p>Cela signifie d\u00e9placer les choses dans leurs fonctions (ou m\u00eame dans leurs classes et donc leurs fonctions) et comment nous pouvons les appeler depuis le contexte de nos mod\u00e8les.<\/p>\n<p>En fin de compte, cela conduira \u00e0 un code plus facile \u00e0 lire, \u00e0 une meilleure s\u00e9paration des pr\u00e9occupations et nous am\u00e8nera vers des moyens de changer la fa\u00e7on dont les donn\u00e9es sont inject\u00e9es dans un mod\u00e8le.<\/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>Les mod\u00e8les sont la fa\u00e7on dont les donn\u00e9es sont affich\u00e9es \u00e0 l&rsquo;utilisateur, mais comment pouvons-nous utiliser les mod\u00e8les WordPress et am\u00e9liorer leur organisation pour les utilisateurs et les d\u00e9veloppeurs ?<\/p>\n","protected":false},"author":1,"featured_media":223990,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[893,925,841,862],"tags":[1167],"class_list":["post-229914","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-code-2","category-sujets","category-tutoriels","category-wordpress-3","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/229914","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=229914"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/229914\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media\/223990"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media?parent=229914"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/categories?post=229914"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/tags?post=229914"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}