{"id":25394,"date":"2021-06-05T13:04:00","date_gmt":"2021-06-05T10:04:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=25394"},"modified":"2021-10-18T02:08:52","modified_gmt":"2021-10-17T23:08:52","slug":"comment-ajouter-un-champ-d-image-a-la-taxonomie-dans-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/comment-ajouter-un-champ-d-image-a-la-taxonomie-dans-wordpress\/","title":{"rendered":"Comment ajouter un champ d&rsquo;image \u00e0 la taxonomie dans WordPress"},"content":{"rendered":"<p>La taxonomie est utile pour regrouper les choses. Habituellement, lorsque nous ajoutons un article dans WordPress, nous lui attribuons une taxonomie. Ce faisant, nous aurons un groupe de messages qui rel\u00e8ve d&rsquo;une certaine taxonomie. Les cat\u00e9gories, les balises sont les taxonomies par d\u00e9faut dans WordPress. Un utilisateur peut \u00e9galement cr\u00e9er sa propre taxonomie \u00e0 l&rsquo;aide de la fonction <code>register_taxonomy()<\/code>.<\/p>\n<p>Par d\u00e9faut, Taxonomy est livr\u00e9 avec quelques champs &#8211; Nom, Slug et Description. WordPress ne fournit pas de champ d&rsquo;image pour la taxonomie. Mais dans certains sc\u00e9narios, vous voudrez peut-\u00eatre avoir une image pour votre taxonomie. Dans cet article, nous \u00e9tudions comment ajouter le champ d&rsquo;image \u00e0 la taxonomie dans WordPress et l&rsquo;afficher sur le front-end.<\/p>\n<h3>Ajouter un champ d&rsquo;image \u00e0 la taxonomie<\/h3>\n<p>Pour commencer, vous devez installer et activer le plugin <a href=\"https:\/\/wordpress.org\/plugins\/advanced-custom-fields\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Advanced Custom Fields<\/a>.<\/p>\n<p>Le champ personnalis\u00e9 avanc\u00e9 est un g\u00e9n\u00e9rateur de champs qui vous permet d&rsquo;ajouter facilement des champs aux types de publication, taxonomies dans WordPress en quelques clics seulement. Pour notre tutoriel, je vais ajouter le champ image aux cat\u00e9gories et les afficher sur le front-end.<\/p>\n<p>Lors de l&rsquo;activation du plugin, allez dans le menu Champs personnalis\u00e9s et cliquez sur le bouton Ajouter un nouveau.<\/p>\n<p>Sur la page suivante, vous devez ajouter un titre, des champs, des conditions pour le groupe de champs.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e12f5e9ab.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e12f5e9ab.png\" alt=\"Comment ajouter un champ d&#039;image \u00e0 la taxonomie dans WordPress\" ><\/a><\/p>\n<p>Comme le montre la capture d&rsquo;\u00e9cran ci-dessus, j&rsquo;ai donn\u00e9 un titre, une \u00e9tiquette de champ. Le nom du champ est g\u00e9n\u00e9r\u00e9 automatiquement \u00e0 partir de l&rsquo;\u00e9tiquette du champ. Sous le type de champ, j&rsquo;ai s\u00e9lectionn\u00e9 l&rsquo;option Image. Cette option agit comme un t\u00e9l\u00e9chargement de fichier qui permet d&rsquo;utiliser le t\u00e9l\u00e9chargeur de m\u00e9dias.<\/p>\n<p>Faites d\u00e9filer vers le bas sur la m\u00eame page, s\u00e9lectionnez Return Format as Image Array.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e1301fa83.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e1301fa83.png\" alt=\"Comment ajouter un champ d&#039;image \u00e0 la taxonomie dans WordPress\" ><\/a><\/p>\n<p>Sous l&#8217;emplacement, pour les r\u00e8gles, l&rsquo;utilisateur doit ajouter une condition qui s&rsquo;appliquera au groupe de champs actuel. Dans notre cas, je choisis Taxonomie comme \u00e9gal \u00e0 Cat\u00e9gorie.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e130b96fd.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e130b96fd.png\" alt=\"Comment ajouter un champ d&#039;image \u00e0 la taxonomie dans WordPress\" ><\/a><\/p>\n<p>Une fois que vous avez termin\u00e9 avec les param\u00e8tres ci-dessus, enregistrez les modifications.<\/p>\n<p>Maintenant, si nous allons \u00e0 la page d&rsquo;\u00e9dition de cat\u00e9gorie, nous verrons le champ pour le t\u00e9l\u00e9chargement d&rsquo;images.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e1316ec34.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20335-6081e1316ec34.png\" alt=\"Comment ajouter un champ d&#039;image \u00e0 la taxonomie dans WordPress\" ><\/a><\/p>\n<p>Ici, un utilisateur peut t\u00e9l\u00e9charger l&rsquo;image pour une cat\u00e9gorie. Voyons ensuite comment afficher cette image sur le front-end.<\/p>\n<h3>Afficher l&rsquo;image de la cat\u00e9gorie sur le front-end<\/h3>\n<p>Le plugin de champs personnalis\u00e9s avanc\u00e9s fournit une m\u00e9thode <code>get_field()<\/code>qui est utilis\u00e9e pour afficher la valeur du champ. Pour afficher la valeur du champ de cat\u00e9gorie, vous devez transmettre le nom du champ et &lsquo;category_TERM_ID&rsquo;. Si vous affichez une valeur de champ de taxonomie personnalis\u00e9e, le deuxi\u00e8me param\u00e8tre serait &lsquo;term_TERM_ID&rsquo;. Veuillez vous r\u00e9f\u00e9rer \u00e0 la documentation du plugin <a href=\"https:\/\/www.advancedcustomfields.com\/resources\/adding-fields-taxonomy-term\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ici<\/a>.<\/p>\n<p>Disons que nous avons t\u00e9l\u00e9charg\u00e9 une image pour la cat\u00e9gorie qui a un ID 7. Notre code sera le suivant pour afficher l&rsquo;image.<\/p>\n<pre><code>&lt;?php\n$term_id = 7;\n$image = get_field('category_image', 'category_'. $term_id); \/\/'category_image' is our field name\n?&gt;\n&lt;img src=\"&lt;?php echo $image['url']; ?&gt;\"&gt;<\/code><\/pre>\n<p>La variable <code>$image<\/code>a un chemin d&rsquo;image avec les tailles d&rsquo;une miniature, moyenne et grande. Vous pouvez choisir n&rsquo;importe quelle taille de l&rsquo;image selon vos besoins. Imprimez la <code>$image<\/code>variable et vous obtiendrez tous les m\u00e9ta-d\u00e9tails sur l&rsquo;image.<\/p>\n<p>J&rsquo;esp\u00e8re que vous comprenez comment ajouter le champ d&rsquo;image \u00e0 la taxonomie dans WordPress. S&rsquo;il vous pla\u00eet partager vos pens\u00e9es et suggestions dans la section commentaires ci-dessous.<\/p>\n<h4>Articles Li\u00e9s<\/h4>\n<ul>\n<li><a href=\"https:\/\/themewp.inform.click\/fr\/comment-creer-un-widget-elementor-personnalise\/\" title=\"Comment cr\u00e9er un widget Elementor personnalis\u00e9\">Comment cr\u00e9er un widget Elementor personnalis\u00e9<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/fr\/comment-ajouter-du-code-apres-la-balise-body-dans-wordpress\/\" title=\"Comment ajouter du code apr\u00e8s la balise Body dans WordPress\">Comment ajouter du code apr\u00e8s la balise Body dans WordPress<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/fr\/ajout-d-un-bouton-d-image-personnalise-avec-media-uploader-dans-wordpress\/\" title=\"Ajout d&#039;un bouton d&#039;image personnalis\u00e9 avec Media Uploader dans WordPress\">Ajout d&rsquo;un bouton d&rsquo;image personnalis\u00e9 avec Media Uploader dans WordPress<\/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=\"\/\/artisansweb.net\" class=\"external external_icon\">artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Vous cherchez \u00e0 ajouter le champ d&rsquo;image \u00e0 la taxonomie dans WordPress ? Dans cet article, je vous montre comment ajouter le champ image \u00e0 la taxonomie et<\/p>\n","protected":false},"author":1,"featured_media":21655,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[312,412,608],"tags":[844],"class_list":["post-25394","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-base-de-donnees","category-divers","category-uncategorized-4","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/25394","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/comments?post=25394"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/25394\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media\/21655"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media?parent=25394"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/categories?post=25394"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/tags?post=25394"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}