L'utilisation de l'ACF (Champs personnalisés avancés) permet d'ajouter des champs personnalisés aux catégories de produits et aux produits WooCommerce, tels que des champs vidéo, des champs d'assurance qualité, etc. Combiné avec la fonction de modèle d'Elementor Pro, des pages de liste de produits avancées et des pages de détails de produits peuvent être créées. Vous trouverez ci-dessous des tutoriels détaillés, étape par étape, ainsi que des exemples :
Ajouter des champs personnalisés aux pages de détail des produits
Étape 1 : Installer le plug-in ACF
- Connectez-vous à votre tableau de bord Wordpress et naviguez versplug-in (composant logiciel)Dans la boîte de recherche, tapez "Champs personnalisés avancés".
- Installez et activez le plug-in ACF (Advanced Custom Fields).
Étape 2 : Ajouter des champs
- Aller à "champ"menu, cliquez sur "nouvellement construit".
- Ajouter un nom de groupe de champs tel que "offres".
- Réglez l'emplacement sur "Le type de contenu est égal au produit"afin que le champ soit ajouté à toutes les pages de produits.
- Cliquez "Ajout de champs".
Étape 3 : Mise en place des champs
- Saisissez l'intitulé du champ, par exemple "QA". Le nom du champ sera généré automatiquement sur la base de l'étiquette du champ, et l'anglais est recommandé.
- Sélectionnez le type de champ comme "Éditeur visuel"et sauvegarder.
Exemple : Comment ajouter des champs personnalisés aux fiches produits et aux listes de produits avec ACF ?
Allez dans la liste des produits, modifiez n'importe quel produit et un nouveau champ d'assurance qualité sera ajouté au bas de la page. Pour alimenter le contenu, vous pouvez utiliser la même méthode pour ajouter d'autres champs tels que BROCHURE, POURQUOI NOUS CHOISIR, etc.
Étape 4 : Créer un modèle de page détaillée avec Elementor Pro
- Modèle de produit unique fini (modèle de page détaillée de produit).
- Modifiez le modèle de la page de détail du produit avec Elementor.
- Ajoutez un élément d'édition de texte sous l'en-tête.
- Cliquez sur la balise dynamique et sélectionnez "ACF Field".
- Dans la clé, sélectionnez le champ "QA" que vous venez d'ajouter.
mise en garde Si le produit auquel le champ AQ vient d'être ajouté n'est pas le produit prévisualisé actuel, vous devez définir le produit prévisualisé en cliquant sur la roue dentée dans le coin inférieur gauche et en cliquant sur "Postuler et prévisualiser"pour voir le contenu du champ AQ.
Ajouter des champs personnalisés aux pages de listes de produits
Étape 1 : Ajouter des champs vidéo aux catégories de produits avec ACF
- Ajouter comme ci-dessusChamps vidéo ACF.
- Lorsque vous ajoutez une catégorie de produits, vous verrez apparaître le champ vidéo.
Étape 2 : Créer un modèle de page d'archives de produits avec Elementor Pro
- Ajoute un élément vidéo au modèle.
- Fixer le lien de l'élément vidéo à "Champ ACF"et sélectionnez le champ vidéo ACF que vous venez d'ajouter.
mise en garde
Saisissez un lien vidéo lors de l'édition des informations relatives à la catégorie de produits, et la vidéo correspondante s'affichera lors de la consultation de la page de la catégorie de produits.
Avec les étapes ci-dessus, vous pouvez utiliser ACF et Elementor Pro pour ajouter de manière flexible des champs personnalisés aux produits WooCommerce afin de créer des pages de détail et des pages de liste de produits personnalisées.