Comment modifier le modèle de page produit dans Divi Builder
Publié: 2022-10-25Si vous utilisez le thème Divi pour WordPress et que vous souhaitez modifier vos pages produits , il y a quelques petites choses que vous devez savoir. Tout d'abord, vous devez créer un thème enfant. Cela vous permettra d'apporter des modifications au code sans affecter les fichiers de thème d'origine. Une fois que vous avez configuré un thème enfant, vous pouvez modifier le modèle de page produit dans Divi Builder. Pour modifier le modèle de page produit, rendez-vous d'abord dans l'onglet Divi Builder du panneau d'administration de WordPress. Ensuite, cliquez sur l'onglet "Modèles" et sélectionnez "Page produit" dans le menu déroulant. Une fois que vous êtes dans le Divi Builder, vous verrez une liste de tous les éléments qui composent le modèle de page produit. Vous pouvez modifier n'importe lequel de ces éléments en cliquant dessus, puis en effectuant vos modifications dans la barre latérale à droite. Par exemple, si vous souhaitez modifier l'image du produit, cliquez sur l'élément « Image » puis sélectionnez une nouvelle image dans la médiathèque de WordPress. Lorsque vous avez terminé vos modifications, cliquez sur le bouton "Enregistrer" dans la barre latérale de Divi Builder. Vos modifications seront désormais appliquées à tous les produits de votre site Web.
Divi Builder est un outil fantastique qui vous permet de personnaliser visuellement les sites Web WooCommerce sans avoir à coder quoi que ce soit. Sur la page produit de votre boutique, vous pourrez montrer comment vos produits sont affichés. C'est une bonne idée de colorer la page du produit et d'ajouter les éléments pertinents, mais il y a beaucoup plus que cela. Le thème Divi inclut un constructeur de pages Divi Builder, qui peut être utilisé pour créer des pages personnalisées . Vous pourrez personnaliser rapidement et facilement la page du produit WooCommerce et toute autre partie de votre site sans aucune expérience de codage préalable. La plateforme WooCommerce prend en charge une large gamme de modules qui peuvent être facilement modifiés pour répondre à vos besoins spécifiques. Avec Divi Builder, vous pouvez rapidement désactiver le nombre d'avis clients et afficher le nombre d'étoiles, ou vous pouvez masquer la fonctionnalité.
Vous pouvez augmenter les taux de conversion en ajoutant une galerie de produits à vos pages de produits. Nous vous recommandons d'inclure au moins 3-4 photos de chacun de vos articles dans votre commande. Si vous vendez des cours en ligne, il est possible que vous souhaitiez désactiver l'option de quantité afin de garder la page du produit claire. Les bascules facilitent la visualisation des informations tout en gardant votre page produit propre. Nous vous montrerons comment installer un module à bascule sous la description du produit, à partir de la page du produit ci-dessous. Dans notre section Produit/Archive, le titre sera le titre du Produit/Archive, mais vous pouvez sélectionner le matériel qui correspond le mieux à vos besoins en tant qu'auteur. En sélectionnant Description du produit dans le menu, vous pouvez accéder à votre base de données. Une fois les modifications terminées, vous recevrez des mises à jour automatiques dès qu'elles seront terminées. Ce module vous permet de créer des rubriques et de personnaliser vos pages et articles de manière simple.
Divi Woocommerce Personnaliser la page produit

Il existe de nombreuses façons de personnaliser une page produit Divi WooCommerce . Vous pouvez modifier la mise en page, les couleurs, la police et bien plus encore. Vous pouvez également ajouter du CSS et du HTML personnalisés pour personnaliser davantage l'apparence de votre page produit.
Modèle de page produit Divi Woocommerce

Un modèle de page de produit divi woocommerce est un excellent moyen de présenter vos produits sur votre site Web. Ce type de modèle vous permet d'afficher vos produits de manière propre et organisée, ce qui permet aux visiteurs de parcourir et de trouver facilement ce qu'ils recherchent. De plus, un modèle de page de produit divi woocommerce peut aider à stimuler l'optimisation des moteurs de recherche (SEO) de votre site Web en facilitant la recherche et l'indexation de vos produits par les moteurs de recherche.
Vous pouvez utiliser WooCommerce pour créer une boutique de commerce électronique sur votre site Web car il comprend toutes les cloches et sifflets nécessaires. La mise en page par défaut de WooCommerce, en particulier les pages de produits, est extrêmement simpliste et manque de créativité. Dans ce tutoriel, nous allons apprendre à créer un modèle de page produit WooCommerce en utilisant Divi à partir de zéro. Cette vidéo étape par étape vous montre comment créer un modèle de page produit WooCommerce à l'aide de Divi. Vous pouvez ensuite concevoir et mettre en page vos produits en fonction des critères définis à ce stade. Des pages de produits individuelles ou des pages d'archives de produits peuvent être créées en tant que modèles distincts. Dans les deux colonnes, il y aura beaucoup de modules.
Nous avons créé une section dédiée à chaque module pour vous aider à les ajouter et à les modifier. Pour commencer, nous devons d'abord définir le module d'image du produit pour le modèle. Dans l'étape suivante, nous ajouterons une notification de panier à la page du produit. Le nom et la note du produit doivent être affichés sur la page du produit. En ayant une explication détaillée de l'origine du produit, les utilisateurs pourront déterminer où ils se trouvent sur la page. Vous pouvez ajouter des fils d'Ariane en sélectionnant le bouton Ajouter un nouveau module, puis Woo Breadcrumbs. L'avis de panier et le diviseur sont également requis.

Nous voulons inclure les prix des produits afin de montrer à nos utilisateurs combien coûte le produit après avoir ajouté les évaluations des produits. Ensuite, dans la section Texte du prix, incluez le module Woo Price. L'étape suivante consiste à sélectionner Utiliser un style personnalisé pour le bouton dans l'onglet Conception. Pour conserver la cohérence du design, sélectionnez le violet comme Couleur du texte du bouton. Il est maintenant temps d'ajouter la description du produit. Si vous appuyez sur l'URL de l'espace réservé, le texte de l'espace réservé de la page du produit s'affichera, mais il sera mis à jour dynamiquement pour refléter le contenu de la page. À l'étape 3, vous devrez ajouter le module Woo Related Product.
Cette étape consiste à réaliser la troisième rangée du panneau, qui est destinée à recevoir un plateau de produits. Vérifiez que tout fonctionne correctement en testant votre modèle de page produit. Pour commencer, nous devons d'abord enregistrer notre modèle. Si tout se passe bien, vous pourrez créer votre modèle de page produit WooCommerce personnalisé avec Divi. Les modules puissants et l'interface utilisateur intuitive de Divi facilitent la création d'un design d'aspect professionnel en un rien de temps. Pour le rendre aussi court que possible, nous n'avons regardé qu'un seul paramètre dans notre tutoriel. Étant donné que chaque module possède son propre ensemble de paramètres et d'options de conception, les possibilités sont infinies.
Mise en page de la page produit Divi
Une mise en page de produit Divi est une mise en page conçue pour présenter les produits dans une boutique en ligne. Ce type de mise en page comprend généralement de grandes images des produits, ainsi que des descriptions et des prix. La plupart des mises en page de produits Divi incluent également un moyen pour les clients d'ajouter les produits à leurs paniers.
Vous pouvez créer une boutique en ligne avec WooCommerce Layouts for Divi. La boutique Divi est livrée avec une pléthore de modèles qui vous permettent de personnaliser chaque aspect de votre site de commerce électronique, pas seulement la mise en page de la boutique Divi. Les pages de produits, les pages de boutique, les pages de panier et les pages de paiement sont toutes disponibles. Ces mises en page aideront les clients en créant des pages de panier Divi conviviales, leur permettant de laisser un achat au milieu si leur panier actuel est obsolète. Lorsque vous utilisez ces modèles de page de paiement Divi, vous aurez un contrôle total sur l'ensemble du site Web, de la page du magasin à la page de paiement. Vous pouvez vous connecter à n'importe quelle page sur n'importe quel appareil avec une résolution d'écran de n'importe quelle taille en utilisant les boutons de cette page.
Disposition de la boutique de thèmes Divi
Si vous souhaitez créer une boutique en ligne avec WordPress, vous devrez choisir un thème incluant des fonctionnalités de commerce électronique. Le thème Divi est une option populaire pour de nombreuses boutiques en ligne, car il comprend une mise en page prédéfinie spécifiquement pour les sites de commerce électronique. Cette mise en page comprend une grille de produits, des pages de produits, un panier d'achat, etc. Vous pouvez facilement personnaliser le thème Divi pour qu'il corresponde à l'image de marque et au style de votre boutique.
Les pages suivantes contiennent une liste complète des mises en page de commerce électronique disponibles pour Divi. Les mises en page de Divi sont les plus pratiques de toutes les plateformes du marché, avec des conceptions de designers et de développeurs du monde entier. Divi Builder vous permet d'importer des mises en page de commerce électronique directement dans votre bibliothèque Divi, ce qui vous permet de commencer immédiatement à travailler sur votre prochain projet Divi. Étant donné que le thème Divi est compatible avec WordPress, vous pouvez utiliser les mises en page de commerce électronique présentées ci-dessus sur votre site Web. Une fonction de recherche peut être utilisée dans la barre latérale pour trouver et parcourir ce répertoire de mise en page. Nous vous encourageons à soumettre votre mise en page DivieCommerce au répertoire Divilayouts.com.
Pourquoi Divi est le thème parfait pour votre site de commerce électronique
Divi est un bon thème de commerce électronique . Divi est une excellente plateforme pour un site Web de commerce électronique. Avec lui, vous pouvez créer un site Web fonctionnel et polyvalent qui s'intègre à WooCommerce. Divi est un excellent choix si vous souhaitez prendre un nouveau départ ou rafraîchir votre site Web existant.