
Pourquoi personnaliser la page de produit WooCommerce?
La page du produit est l’endroit où vous affichez les articles que vous vendez Changer les couleurs et les éléments de la page du produit est un bon début, mais vous pouvez faire beaucoup plus. Une option consiste à créer un nouveau modèle de page de produit avec une conception personnalisée. Avec un peu de PHP, et CSS, vous pouvez repenser complètement votre page de produit. Cependant, si vous utilisez Divi, il y a une bien meilleure option. Le thème Divi est livré avec son propre constructeur de pages personnalisé appelé Divi. Il vous permet de personnaliser facilement la page de produit WooCommerce et chaque centimètre de votre site sans écrire une seule ligne de code. Voyons de plus près comment le faire. Pour cette démonstration, nous utiliserons le Divi Plugin pour apporter toutes les modifications à notre page de produit. Avant de commencer, assurez-vous d’avoir Divi avec le constructeur Div installé sur votre site. 
Activer l’ éditeur visuel
Pour commencer à personnaliser votre page de produit WooCommerce
Maintenant que vous avez activé l’éditeur visuel de Divi, vous pourrez sélectionner n’importe quel module sur cette page et le modifier. Pour personnaliser votre modèle actuel, vous pouvez simplement modifier les modules existants ou en ajouter de nouveaux.
- Ajouter au panier
- Informations supplémentaires
- Chapelure
- Avisde charrette
- Description
- Galerie
- Images
- Méta
- Prix
- Notation
- Produit connexe
- Critiques
- Action
- Onglets
- Titre
- Cochette
Vous pouvez ajouter l’un de ces modules à votre page et le rendre plus convivial en cliquant simplement dessus. En plus de cela, la dernière version du Divi Builder fonctionne extrêmement bien avec WooCommerce afin que vous puissiez personnaliser facilement tous les modules. Jetons un coup d’œil à certaines des choses que vous pouvez modifier.
1. Afficher ou masquer les avis
Commençons Pour créer la confiance parmi vos clients en ligne, nous vous recommandons d’afficher à la fois la note Star et les avis sur la page du produit.
2. Modification de la galerie
Ce n’est pas un secret qu’une image vaut mille mots. C’est pourquoi pour augmenter vos taux de conversion, c’est une bonne idée d’ajouter une galerie de produits à vos pages de produits. WooCommerce inclut cette fonctionnalité
Une fois que vous avez mis à jour la page du produit avec vos images, cela ressemblera à ceci:
Si, pour une raison quelconque, vous ne souhaitez afficher qu’une seule image de chaque produit, avec le constructeur Divi, vous pouvez masquer la galerie de n’importe quel produit. Cliquez simplement sur la galerie, appuyez sur le Icône des paramètresaller à Éléments Et vous aurez la possibilité de désactiver la galerie.
De plus, vous pouvez masquer l’image en vedette et l’insigne de vente. Compte tenu de l’importance des images lors de la vente, nous vous recommandons d’ajouter au moins 3 à 4 photos de chacun de vos produits.
3. Modification d’image en vedette
Une autre façon intéressante de Personnaliser la page de produit WooCommerce Lorsque vous ouvrez les options d’image en vedette à l’aide du Divi Builder, vous pourrez modifier l’image en vedette et l’insigne de vente.
Comme nous l’avons mentionné précédemment, nous vous recommandons d’afficher des images en vedette attrayantes car elles peuvent avoir un grand impact sur votre taux de conversion.
4. Ajouter la modification du bouton de panier
Pour ajouter des produits au panier, les utilisateurs doivent cliquer sur le bouton Ajouter au panier. WooCommerceest livré avec un champ de quantité avec le bouton Ajouter au panier Sous Éléments Section, vous verrez deux options principales.
- Champ de quantité
- Action
Si vous souhaitez donner à l’utilisateur le choix de sélectionner la quantité de produit, laissez le champ de quantité tel quel. Cependant, si vous vendez des cours en ligne,
Comme vous pouvez le voir, une fois que nous avons désactivé le champ de quantité, le champ disparaîtra. Sur cette page de produit, nous n’avons pas d’option pour voir l’option d’actions, mais si vous affichez l’action sur votre site, vous pouvez l’_activer ou le désactiver de la même manière.
5. Appliquer des modifications aux produits connexes
Afficher les produits liés aux acheteurs est un excellent moyen d’augmenter vos ventes. Habituellement, WooCommerce affiche des produits connexes en fonction de la catégorie principale de l’élément Tout d’abord, ajoute une nouvelle ligne à la page. Pour ce tutoriel, nous ajouterons une seule ligne, mais vous pouvez choisir le style qui convient mieux à votre magasin.
Après cela, ajoutez le module de produit lié à WooCommerce à la ligne comme indiqué ci-dessous.
Vous verrez qu’une section de produit connexe sera ajoutée à la page. Ensuite, vous pouvez personnaliser la disposition et la couleur. Si vous n’affichez pas de produits connexes, nous vous recommandons de l’essayer. Ils sont faciles à installer et peuvent vous aider à augmenter vos ventes.
6. Ajouter une bascule
Les bascules sont un excellent moyen d’afficher des informations sur votre page de produit tout en les gardant propres. En divi, vous pouvez ajouter une bascule en utilisant le MODULE DE TOGGLE. Commençons
Pour ajouter la bascule, vous avez besoin de deux choses principales.
- Titre
- Corps
Pour cette démonstration, nous utiliserons le nom du produit comme titre de bascule et la description du produit comme corps à bascule. Pour ce faire, cliquez simplement sur l’icône de la base de données à droite et vous verrez différents types de contenu
Maintenant, faisons de même pour le corps. Appuyez sur l’icône de la base de données et choisissez le Description du produit Option du menu.
Une fois que vous avez enregistré cela, vous verrez un module à bascule simple sur votre page de produit queles utilisateurs peuvent appuyer pour voir plus d’informations sur le produit.
Divi vous permet également d’ajouter d’autres éléments personnalisés tels que des titres et des descriptions ainsi que des polices, des couleurs, etc. Nous vous recommandons de jouer et de personnaliser votre page de produit avec les bascules.
Page de produit WooCommerce Pro-tip
Avant de conclure ce guide, nous avons une astuce rapide pour vous.
Mettez à jour le thème et le plugin régulièrement
Pour vous assurer que vous avez toujours accès aux dernières fonctionnalités que Divi a à offrir, nous vous recommandons fortement de garder votre thème Divi, le plugin Divi Builder et WordPress Core mis à jour vers la dernière version stable disponible. La façon la plus simple de le faire est d’allumer les mises à jour automatiques du panneau de thème Divi.
Tout ce dont vous avez besoin pour entrer est votre nom d’utilisateur élégant et la clé API que vous pouvez trouver
Utilisation à l’échelle du site
Avec les nouveaux modules Divi Builder, vous pourrez ajouter des sections et personnaliser l’une de vos pages ou messages. Tout ce que vous avez à faire est d’activer l’éditeur visuel, d’ajouter les éléments que vous souhaitez et de sélectionner les modules que vous souhaitez utiliser.
Bonus : Autres méthodes pour modifier la page du produit WooCommerce
Si vous cherchez d’autres moyens de personnaliser votre page de produit, consultez ce guide où vous apprendrez à utiliser les plugins, les constructeurs de pages et les extraits de code pour modifier votre page de produit.
Conclusion
En résumé, Personnalisation de la page WooCommerce avec Divi Peut vous aider à augmenter vos ventes et à augmenter votre taux de conversion. La bonne nouvelle est que vous pouvez le faire sans écrire une seule ligne de code. Avec Divi Builder, vous pouvez facilement modifier la page du produit de votre magasin sans aucun plugin de générateur de page supplémentaire. L’expérience de construction de page Drag and Drop vous aidera facilement à personnaliser chaque centimètre de votre magasin même si vous n’avez pas de compétences de codage. Quelles modifications avez-vous suggérées à votre magasin à l’aide de Divi ? Avez-vous eu des problèmes après notre tutoriel ? Faites-nous savoir
Vous aimeriez aussi lire...
2 réponses
Laisser un commentaire
Vous devez vous connecter pour publier un commentaire.
Merci pour cet article très instructif ! J’ai toujours eu du mal à personnaliser mes pages de produit, mais avec vos conseils, je vais enfin pouvoir améliorer ma boutique WooCommerce.
Merci pour cet article très instructif ! J’ai toujours eu du mal à personnaliser mes pages de produits, mais vos conseils vont m’être très utiles.