{"id":4143,"date":"2024-10-26T20:56:20","date_gmt":"2024-10-26T12:56:20","guid":{"rendered":"https:\/\/www.openbyt.com\/?p=4143"},"modified":"2024-10-26T20:56:22","modified_gmt":"2024-10-26T12:56:22","slug":"complete-guide-to-adding-and-customizing-product-information-in-woocommerce","status":"publish","type":"post","link":"https:\/\/www.openbyt.com\/fr\/guide-complet-pour-ajouter-et-personnaliser-les-informations-sur-les-produits-dans-woocommerce","title":{"rendered":"Guide complet pour ajouter et personnaliser les informations sur les produits dans WooCommerce"},"content":{"rendered":"<p>Dans WooCommerce, les attributs de produit offrent un moyen flexible de d\u00e9finir diverses caract\u00e9ristiques pour diff\u00e9rents types de produits. La mise en place d'attributs de produit peut am\u00e9liorer l'exp\u00e9rience utilisateur en aidant les clients \u00e0 trouver rapidement des d\u00e9tails essentiels, tels que <strong>couleur<\/strong>, <strong>taille<\/strong>ou <strong>mat\u00e9riel<\/strong>. Enrichir les pages de produits avec des informations d\u00e9taill\u00e9es augmente la profondeur du contenu, ce qui favorise l'optimisation des moteurs de recherche (SEO) et am\u00e9liore la visibilit\u00e9 des produits.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"480\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-1024x480.jpg\" alt=\"\" class=\"wp-image-4171\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-1024x480.jpg 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-600x281.jpg 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-300x141.jpg 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-768x360.jpg 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-1536x720.jpg 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-18x8.jpg 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858-150x70.jpg 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/858.jpg 1920w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><p>Cet article pr\u00e9sente plusieurs m\u00e9thodes pour ajouter des informations suppl\u00e9mentaires aux pages de produits de WooCommerce, notamment en utilisant la fonction <strong>L'interface de WooCommerce<\/strong> les fonctions int\u00e9gr\u00e9es, le <strong>Champs personnalis\u00e9s avanc\u00e9s (ACF)<\/strong> et <strong>code personnalis\u00e9<\/strong>. Choisissez la m\u00e9thode qui vous convient le mieux.<\/p><h3 class=\"wp-block-heading\">Pourquoi l'ajout d'informations suppl\u00e9mentaires am\u00e9liore-t-il l'exp\u00e9rience de l'utilisateur et le r\u00e9f\u00e9rencement ?<\/h3><p>Par exemple, si vous vendez des v\u00eatements, les clients peuvent vouloir conna\u00eetre la couleur, la taille et le tissu. En d\u00e9finissant ces attributs, WooCommerce les affiche automatiquement sous la rubrique \"<strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-red-color\">Informations compl\u00e9mentaires<\/mark><\/strong>\"Cette fonctionnalit\u00e9 permet aux utilisateurs de mieux comparer les produits et d'am\u00e9liorer les performances de la page en mati\u00e8re de r\u00e9f\u00e9rencement gr\u00e2ce \u00e0 l'ajout d'un contenu pertinent. Cette fonctionnalit\u00e9 permet aux utilisateurs de mieux comparer les produits et am\u00e9liore les performances de la page en mati\u00e8re de r\u00e9f\u00e9rencement gr\u00e2ce \u00e0 l'ajout d'un contenu pertinent.<\/p><h3 class=\"wp-block-heading\">M\u00e9thode 1 : Ajouter des informations suppl\u00e9mentaires en utilisant les fonctionnalit\u00e9s int\u00e9gr\u00e9es de WooCommerce<\/h3><p>WooCommerce offre un moyen simple d'ajouter des attributs de produit directement dans l'\u00e9cran d'\u00e9dition du produit. Voici les \u00e9tapes \u00e0 suivre :<\/p><h4 class=\"wp-block-heading\">\u00c9tape 1 : Connectez-vous au tableau de bord de WooCommerce<\/h4><p>Naviguez vers le tableau de bord de WordPress, cliquez sur \"<strong>Produits<\/strong>et s\u00e9lectionnez le produit pour lequel vous souhaitez ajouter des informations suppl\u00e9mentaires.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"391\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-1024x391.png\" alt=\"\" class=\"wp-image-4144\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-1024x391.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-600x229.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-300x115.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-768x293.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-1536x587.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-18x7.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414-150x57.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-414.png 1809w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h4 class=\"wp-block-heading\">\u00c9tape 2 : Localisez la section \"Donn\u00e9es sur les produits\".<\/h4><p>Dans l'\u00e9diteur de produit, faites d\u00e9filer la page jusqu'\u00e0 la mention \"<strong>Donn\u00e9es sur le produit<\/strong>\"et s\u00e9lectionnez l'option \"<strong>Attributs<\/strong>Onglet \".<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"553\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-1024x553.png\" alt=\"\" class=\"wp-image-4145\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-1024x553.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-600x324.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-300x162.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-768x415.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-18x10.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415-150x81.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-415.png 1398w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">\u00c9tape 3 : Ajouter des attributs<\/h4><p>Cliquez sur le bouton \"<strong>Ajouter un nouveau<\/strong>\"pour d\u00e9finir de nouveaux attributs tels que \"<strong>Couleur<\/strong>\" ou \"<strong>Taille<\/strong>.&#8221;<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"489\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-1024x489.png\" alt=\"\" class=\"wp-image-4146\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-1024x489.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-600x286.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-300x143.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-768x366.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416-150x72.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-416.png 1373w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><ul class=\"wp-block-list\"><li>Saisissez le nom de l'attribut, par exemple, \"<strong>Couleur<\/strong>.&#8221;<\/li>\n\n<li>S\u00e9parez les valeurs des attributs par une barre verticale (|), par exemple \"Rouge | Bleu | Vert\".<\/li><\/ul><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"573\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-1024x573.png\" alt=\"\" class=\"wp-image-4147\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-1024x573.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-600x336.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-300x168.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-768x429.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-18x10.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417-150x84.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-417.png 1123w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">\u00c9tape 4 : D\u00e9finir la visibilit\u00e9 de l'attribut<\/h4><p>Cochez l'option \"Visible sur la page du produit\" pour que ces attributs apparaissent sous l'onglet \"Informations compl\u00e9mentaires\" de la page du produit.<\/p><h4 class=\"wp-block-heading\">\u00c9tape 5 : Enregistrer et mettre \u00e0 jour le produit<\/h4><p>Cliquez sur le bouton \"<strong>Mise \u00e0 jour<\/strong>\"pour enregistrer vos modifications. Une fois les modifications enregistr\u00e9es, l'onglet \"Informations compl\u00e9mentaires\" de la page du produit affichera automatiquement ces attributs.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"415\" height=\"425\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-419.png\" alt=\"\" class=\"wp-image-4149\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-419.png 415w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-419-293x300.png 293w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-419-12x12.png 12w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-419-150x154.png 150w\" sizes=\"(max-width: 415px) 100vw, 415px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">Exemple<\/h4><p>Si vous vendez un T-shirt disponible en trois couleurs (rouge, bleu, vert) et en trois tailles (S, M, L), vous pouvez d\u00e9finir l'attribut \"Couleur\" sur \"Rouge | Bleu | Vert\" et l'attribut \"Taille\" sur \"S | M | L\". Lorsque l'option \"Visible sur la page du produit\" est coch\u00e9e, les clients verront ces options sous l'onglet \"Informations compl\u00e9mentaires\".<\/p><h3 class=\"wp-block-heading\">M\u00e9thode 2 : Ajout d'informations suppl\u00e9mentaires \u00e0 l'aide du plugin Secure Custom Fields (SCF)<\/h3><p>Bien que les attributs int\u00e9gr\u00e9s de WooCommerce soient utiles, il en faut plus pour r\u00e9pondre \u00e0 certains besoins. Avec les attributs <a href=\"https:\/\/wordpress.org\/plugins\/advanced-custom-fields\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Champs personnalis\u00e9s s\u00e9curis\u00e9s (SCF)<\/a> plugin, vous pouvez ajouter d'autres champs personnalis\u00e9s pour afficher des d\u00e9tails suppl\u00e9mentaires sur le produit, comme le mat\u00e9riau et les instructions d'entretien.<\/p><h4 class=\"wp-block-heading\">\u00c9tape 1 : Installer le plugin ACF<\/h4><p>Aller \u00e0 \"<strong>Plugins<\/strong>\"Dans le tableau de bord de WordPress, recherchez \"<strong>Champs personnalis\u00e9s s\u00e9curis\u00e9s<\/strong>et cliquez sur \"Installer\" et \"Activer\".<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"553\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-1024x553.png\" alt=\"\" class=\"wp-image-4150\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-1024x553.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-600x324.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-300x162.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-768x414.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-1536x829.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-18x10.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420-150x81.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-420.png 1614w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">\u00c9tape 2 : Cr\u00e9er un groupe de champs<\/h4><p>Aller \u00e0 \"<strong>SCF<\/strong>\"dans le tableau de bord de WordPress et s\u00e9lectionnez \"Ajouter un nouveau groupe de champs\". Cela vous permet de d\u00e9finir des champs personnalis\u00e9s pour vos produits.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"526\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-1024x526.png\" alt=\"\" class=\"wp-image-4151\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-1024x526.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-600x308.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-300x154.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-768x394.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-1536x788.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421-150x77.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-421.png 1590w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">\u00c9tape 3 : D\u00e9finir les champs<\/h4><p>Dans le groupe de champs, ajoutez de nouveaux champs tels que \"<strong>Mat\u00e9riau<\/strong>\" ou \"<strong>Instructions d'entretien<\/strong>.\" Choisissez des types de champs tels que texte, zone de texte ou image selon vos besoins.<\/p><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"480\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-1024x480.png\" alt=\"\" class=\"wp-image-4152\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-1024x480.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-600x281.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-300x141.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-768x360.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-1536x720.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-18x8.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422-150x70.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-422.png 1590w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h4 class=\"wp-block-heading\">Voici un aper\u00e7u des types de champs les plus courants :<\/h4><ul class=\"wp-block-list\"><li><strong>Texte<\/strong>: Ce champ est id\u00e9al pour les entr\u00e9es courtes, sur une seule ligne. Par exemple, vous pouvez l'utiliser pour un champ \"Mat\u00e9riau\" si vous n'avez besoin d'\u00e9num\u00e9rer qu'un ou deux mat\u00e9riaux, tels que \"100% Cotton\" ou \"Stainless Steel\".<\/li>\n\n<li><strong>Zone de texte<\/strong>: Cette option est utile pour les descriptions plus longues. Vous pouvez l'utiliser pour les \"Instructions d'entretien\", o\u00f9 vous pouvez fournir des informations d\u00e9taill\u00e9es sur le lavage ou la manipulation, comme \"Laver \u00e0 la main uniquement. Ne pas mettre au s\u00e8che-linge\".<\/li>\n\n<li><strong>Image<\/strong>: Cette option vous permet d'ajouter des images. Elle peut \u00eatre utilis\u00e9e pour des champs tels que \"Certification de produit\", o\u00f9 vous souhaitez afficher un logo de certification ou un label de qualit\u00e9.<\/li><\/ul><div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"622\" height=\"659\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423.png\" alt=\"\" class=\"wp-image-4153\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423.png 622w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423-600x636.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423-283x300.png 283w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423-11x12.png 11w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-423-150x159.png 150w\" sizes=\"(max-width: 622px) 100vw, 622px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">Exemple :<\/h4><p>Supposons que vous vendiez des meubles en bois et que vous souhaitiez ajouter les champs personnalis\u00e9s suivants :<\/p><ol class=\"wp-block-list\"><li><strong>Mat\u00e9riau<\/strong>-Il peut s'agir d'un champ \"texte\" permettant de saisir des types de bois sp\u00e9cifiques, tels que \"ch\u00eane\" ou \"\u00e9rable\".<\/li><\/ol><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"504\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-1024x504.png\" alt=\"\" class=\"wp-image-4155\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-1024x504.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-600x295.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-300x148.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-768x378.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-1536x756.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425-150x74.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-425.png 1610w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><ol start=\"2\" class=\"wp-block-list\"><li><strong>Instructions d'entretien<\/strong> - D\u00e9finissez cette zone comme une \"zone de texte\" o\u00f9 vous pouvez d\u00e9tailler des conseils d'entretien, tels que \"Essuyez avec un chiffon sec. \u00c9vitez la lumi\u00e8re directe du soleil.<\/li><\/ol><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"515\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-1024x515.png\" alt=\"\" class=\"wp-image-4156\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-1024x515.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-600x301.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-300x151.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-768x386.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-1536x772.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426-150x75.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-426.png 1630w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><ol start=\"3\" class=\"wp-block-list\"><li><strong>Logo de certification<\/strong> - Utilisez un champ \"Image\" pour t\u00e9l\u00e9charger un sceau de certification ou un badge \u00e9cologique.<\/li><\/ol><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"446\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-1024x446.png\" alt=\"\" class=\"wp-image-4157\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-1024x446.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-600x261.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-300x131.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-768x334.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-1536x669.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-18x8.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427-150x65.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-427.png 1810w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><p>Apr\u00e8s avoir d\u00e9fini ces champs, ils appara\u00eetront dans l'\u00e9diteur de produit, pr\u00eats \u00e0 ce que vous saisissiez les informations sp\u00e9cifiques \u00e0 chaque produit.<\/p><h4 class=\"wp-block-heading\">\u00c9tape 4 : D\u00e9finir les r\u00e8gles d'affichage<\/h4><p>Dans la section \"Param\u00e8tres\", d\u00e9finissez les conditions dans lesquelles ces champs personnalis\u00e9s doivent \u00eatre affich\u00e9s sur les pages des produits. Vous pouvez appliquer ces champs \u00e0 tous les produits ou \u00e0 des cat\u00e9gories sp\u00e9cifiques, des \u00e9tiquettes ou m\u00eame des produits individuels.<\/p><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"521\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-1024x521.png\" alt=\"\" class=\"wp-image-4158\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-1024x521.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-600x305.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-300x153.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-768x391.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428-150x76.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-428.png 1434w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h4 class=\"wp-block-heading\">\u00c9tape 5 : Saisir des informations dans l'\u00e9diteur de produit<\/h4><p>Une fois les champs d\u00e9finis et les r\u00e8gles d'affichage \u00e9tablies, acc\u00e9dez \u00e0 l'\u00e9diteur de produits WooCommerce pour tout produit r\u00e9pondant aux crit\u00e8res. Vous verrez alors les champs personnalis\u00e9s que vous avez cr\u00e9\u00e9s et pourrez saisir les informations pertinentes pour chacun d'entre eux.<\/p><figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"503\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-1024x503.png\" alt=\"\" class=\"wp-image-4159\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-1024x503.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-600x295.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-300x147.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-768x377.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-1536x755.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-18x9.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429-150x74.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-429.png 1541w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h4 class=\"wp-block-heading\">\u00c9tape 6 : Modifier le mod\u00e8le de produit (facultatif)<\/h4><p>Pour afficher ces champs personnalis\u00e9s sur le front-end de la page produit, vous devrez peut-\u00eatre modifier les fichiers de template de WooCommerce (par exemple, single-product.php). Utilisez la fonction the_field() de SCF pour afficher les valeurs des champs comme suit :<\/p><pre class=\"wp-block-code\"><code>&lt;div class=&quot;product-material&quot;&gt;\n\n&nbsp; &nbsp;&nbsp;&lt;h4&gt;Mat&eacute;riau :&lt;\/h4&gt;\n\n&nbsp; &nbsp;&nbsp;&lt;p&gt;&lt;?php the_field('material'); ?&gt;&lt;\/p&gt;\n\n&lt;\/div&gt;<\/code><\/pre><h3 class=\"wp-block-heading\">M\u00e9thode 3 : Ajouter des informations suppl\u00e9mentaires \u00e0 l'aide d'un code personnalis\u00e9<\/h3><p>En ajoutant du code au fichier functions.php de votre th\u00e8me, vous pouvez ajouter des champs directement \u00e0 l'\u00e9cran d'\u00e9dition des produits WooCommerce pour une personnalisation plus avanc\u00e9e.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"482\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-1024x482.png\" alt=\"\" class=\"wp-image-4160\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-1024x482.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-600x282.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-300x141.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-768x361.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-1536x723.png 1536w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-18x8.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430-150x71.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-430.png 1607w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">\u00c9tape 1 : Ajouter un champ personnalis\u00e9 \u00e0 l'\u00e9diteur de produit<\/h4><p>Utilisez le hook woocommerce_product_options_general_product_data pour ajouter un champ personnalis\u00e9 \u00e0 l'\u00e9cran d'\u00e9dition du produit.<\/p><pre class=\"wp-block-code\"><code>add_action('woocommerce_product_options_general_product_data', 'add_custom_general_fields' ) ;\n\nfunction add_custom_general_fields() {\n\n    woocommerce_wp_text_input( array(\n\n        'id' =&gt; '_custom_product_text_field',\n\n        'label' =&gt; __('Custom Product Field', 'woocommerce' ),\n\n        'desc_tip' =&gt; 'true',\n\n        'description' =&gt; __('Enter custom field content', 'woocommerce' )\n\n    )) ;\n\n}<\/code><\/pre><figure class=\"wp-block-image\"><img decoding=\"async\" src=\"blob:https:\/\/www.openbyt.com\/c4c888e2-6c19-43f8-869a-407bd999e2f0\" alt=\"\"\/><\/figure><h4 class=\"wp-block-heading\">\u00c9tape 2 : Enregistrer la valeur du champ personnalis\u00e9<\/h4><p>Utilisez le hook woocommerce_process_product_meta pour enregistrer la valeur du champ personnalis\u00e9.<\/p><pre class=\"wp-block-code\"><code>add_action( 'woocommerce_process_product_meta', 'save_custom_general_fields' ) ;\n\nfunction save_custom_general_fields( $post_id ) {\n\n    $custom_field_value = isset( $_POST['_custom_product_text_field'] ) ? sanitize_text_field( $_POST['_custom_product_text_field'] ) : '' ;\n\n    update_post_meta( $post_id, '_custom_product_text_field', $custom_field_value ) ;\n\n}<\/code><\/pre><h4 class=\"wp-block-heading\">\u00c9tape 3 : Afficher le champ personnalis\u00e9 sur la page du produit<\/h4><p>Pour afficher le champ personnalis\u00e9 sur le front-end, utilisez get_post_meta() dans le mod\u00e8le de produit WooCommerce.<\/p><pre class=\"wp-block-code\"><code>echo '&lt;div class=&quot;custom-field&quot;&gt;' ;\n\necho '&lt;label&gt;Champ personnalis&eacute; : &lt;\/label&gt; ' ;\n\necho get_post_meta( get_the_ID(), '_custom_product_text_field', true ) ;\n\necho '&lt;\/div&gt;';<\/code><\/pre><h3 class=\"wp-block-heading\">G\u00e9rer l'onglet \"Informations compl\u00e9mentaires\" de WooCommerce<\/h3><p>L'onglet \"Informations suppl\u00e9mentaires\" de WooCommerce est utile pour afficher les attributs d\u00e9taill\u00e9s des produits, mais vous pouvez personnaliser son contenu ou m\u00eame le masquer dans certains cas.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"390\" src=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-1024x390.png\" alt=\"\" class=\"wp-image-4163\" srcset=\"https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-1024x390.png 1024w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-600x229.png 600w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-300x114.png 300w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-768x293.png 768w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-18x7.png 18w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433-150x57.png 150w, https:\/\/www.openbyt.com\/wp-content\/uploads\/2024\/10\/image-433.png 1050w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><h4 class=\"wp-block-heading\">Ajout d'un texte personnalis\u00e9 \u00e0 l'onglet \"Informations compl\u00e9mentaires<\/h4><p>Pour ajouter un contenu personnalis\u00e9, comme un lien, \u00e0 l'onglet \"Informations compl\u00e9mentaires\", utilisez le code suivant :<\/p><pre class=\"wp-block-code\"><code>add_action('woocommerce_product_additional_information', 'print_custom_html' ) ;\n\nfunction print_custom_html() {\n\n    echo '&lt;a href=&quot;#&quot;&gt;Cliquez ici pour plus de d&eacute;tails sur le produit&lt;\/a&gt;';\n\n}<\/code><\/pre><h4 class=\"wp-block-heading\">Masquer ou supprimer l'onglet \"Informations compl\u00e9mentaires<\/h4><p>Si un produit ne n\u00e9cessite pas d'informations suppl\u00e9mentaires (par exemple, un produit num\u00e9rique), vous pouvez supprimer cet onglet \u00e0 l'aide du code suivant :<\/p><pre class=\"wp-block-code\"><code>add_filter('woocommerce_product_tabs', 'remove_additional_information_tab', 98 ) ;\n\nfunction remove_additional_information_tab( $tabs ) {\n\n    unset( $tabs['additional_information'] ) ;\n\n    return $tabs ;\n\n}<\/code><\/pre><h3 class=\"wp-block-heading\">Conclusion<\/h3><p>L'ajout d'informations suppl\u00e9mentaires aux pages produit de WooCommerce am\u00e9liore l'exp\u00e9rience de l'utilisateur et le r\u00e9f\u00e9rencement. Les fonctionnalit\u00e9s int\u00e9gr\u00e9es de WooCommerce, les plugins tels que Secure Custom Fields (SCF) et le codage personnalis\u00e9 offrent des options flexibles pour enrichir les pages produits avec des d\u00e9tails tels que la couleur, la taille, le mat\u00e9riau, les instructions d'entretien et les certifications.<\/p><ul class=\"wp-block-list\"><li><strong>Utilisation des fonctions int\u00e9gr\u00e9es<\/strong>: Ajoutez rapidement des attributs directement dans l'\u00e9diteur du produit et am\u00e9liorez l'exp\u00e9rience de l'utilisateur en affichant les d\u00e9tails essentiels dans l'onglet \"Informations compl\u00e9mentaires\".<\/li>\n\n<li><strong>Utilisation du plugin SCF<\/strong>: Allez au-del\u00e0 de l'essentiel et cr\u00e9ez des champs personnalis\u00e9s pour pr\u00e9senter des d\u00e9tails sp\u00e9cifiques sur les produits, tels que les mat\u00e9riaux ou les instructions d'entretien, ce qui permet une meilleure gestion de l'information et une personnalisation pour diff\u00e9rents types de produits.<\/li>\n\n<li><strong>Utilisation d'un code personnalis\u00e9<\/strong>: Pour une personnalisation avanc\u00e9e, l'ajout de champs personnalis\u00e9s avec du code directement dans le fichier functions.php offre un contr\u00f4le total sur la fa\u00e7on dont les informations sont pr\u00e9sent\u00e9es sur les pages de produits.<\/li><\/ul><p>La gestion de l'onglet \"Informations suppl\u00e9mentaires\" vous permet d'ajouter, de modifier ou de supprimer du contenu en fonction des besoins du produit, en veillant \u00e0 ce que vos clients puissent acc\u00e9der \u00e0 des informations pertinentes sans encombrement inutile. Dans l'ensemble, l'enrichissement des pages produit de WooCommerce aide les clients \u00e0 prendre des d\u00e9cisions d'achat \u00e9clair\u00e9es, ce qui augmente les conversions tout en am\u00e9liorant le r\u00e9f\u00e9rencement de votre site.<\/p>","protected":false},"excerpt":{"rendered":"<p>Dans WooCommerce, les attributs de produit offrent un moyen flexible de d\u00e9finir diverses caract\u00e9ristiques pour diff\u00e9rents types de produits. La mise en place d'attributs de produits peut am\u00e9liorer l'exp\u00e9rience de l'utilisateur...<\/p>","protected":false},"author":10,"featured_media":4171,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[61,57],"tags":[358,357],"class_list":["post-4143","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-plugin-usage-and-recommendation","category-plugins-theme","tag-adding-product-attributes-and-custom-fields","tag-woocommerce-product-customization",""],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/posts\/4143","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/comments?post=4143"}],"version-history":[{"count":1,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/posts\/4143\/revisions"}],"predecessor-version":[{"id":4174,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/posts\/4143\/revisions\/4174"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/media\/4171"}],"wp:attachment":[{"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/media?parent=4143"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/categories?post=4143"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.openbyt.com\/fr\/wp-json\/wp\/v2\/tags?post=4143"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}