Je souhaite obtenir des informations sur une formation complète concernant le thème DIVI dispensé
par un organisme de formation certifié par l’état.
Que la formation soit finançable par mon CPF (idéalement) ou autre


Même si WooCommerce est sans aucun doute meilleure plateforme pour créer une boutique en ligneil existe quelques limitations mineures pour ce logiciel. Certains éléments de commerce électronique ne sont pas aussi faciles à modifier que d’autres. La page du panier WooCommerce en fait partie. Heureusement, il existe une solution simple pour les utilisateurs de Divi sous la forme d’un plugin puissant.

Pour faciliter le travail des boutiques en ligne, WooCommerce Contient plusieurs pages, par ex. B. les pages «Panier», «Paiement» et «Compte», chacune utilisant des modèles prêts à l’emploi. C’est pourquoi WooCommerce est une telle plate-forme de commerce électronique que vous pouvez créer une boutique en quelques minutes, ajoutez simplement vos produits et liez vos processeurs de paiement, et vous êtes prêt à partir.

Alors que certains aspects du commerce électronique sont si fluides et faciles à utiliser, d’autres aspects peuvent être difficiles. Par exemple, changer la conception par défaut des pages du panier WooCommerce n’est pas une tâche facile. Cela nécessiterait soit de modifier les fichiers de code, soit d’utiliser un plugin tiers.

Heureusement, les utilisateurs de WordPress qui ont construit leurs sites Web avec le thème Divi sont gâtés. Notre plugin Créateur de boutique Divi apporte la facilité d’utilisation de Divi dans le framework WooCommerce. Dans cet article, nous vous montrerons comment modifier la page du panier WooCommerce.

Avec le Plugin Divi Shop Builder Dans votre boîte à outils de développement, vous pouvez créer des pages de panier WooCommerce uniques pour votre boutique en ligne comme suit:

Un exemple de mise en page de panier WooCommerce

Souhaitez-vous créer une page de panier d’achat accrocheuse pour votre boutique WooCommerce?

Dans cet article, nous allons vous montrer le plugin Divi Shop Builder et comment créer une page de panier personnalisé pour votre site Web. Tu vas apprendre:

  • Pourquoi devriez-vous créer une page de panier d’achat unique pour votre boutique WooCommerce?
  • Comment installer le plugin Divi Shop Builder
  • Comment utiliser chacun des modules pour créer une page de panier WooCommerce personnalisée:
  • Comment gagner du temps en utilisant les mises en page incluses dans votre boutique en ligne.

Pourquoi vous devriez personnaliser la page du panier WooCommerce

La page du panier est un élément essentiel du parcours consommateur du commerce électronique. Sur la page du panier, le client vérifie sa commande et décide de continuer. C’est l’avant-dernière étape avant d’effectuer un achat. Il est donc important que cette page soit bien conçue, facile à utiliser et contienne des tactiques de vente.

Avec la possibilité de modifier la page du panier WooCommerce, vous pouvez:

  • Ajoutez un texte personnalisé qui reflète la voix de votre marque. Par défaut, la page du panier affiche simplement « panier ». C’est assez terne et sans vie et n’ajoute pas grand-chose à l’expérience de votre marque. Avec la possibilité de modifier la page du panier WooCommerce, vous pouvez changer ce texte par défaut en un texte orienté vers l’action comme « Vérifiez votre commande » ou un texte mignon comme « Vos nouveaux vêtements ».
  • Encouragez les ventes incitatives. Afficher des produits similaires sur la page du panier est un excellent moyen d’augmenter vos ventes. Vous pouvez ajouter un texte qui dit quelque chose comme ceci, « Nous pensons que ceux-ci auraient fière allure dans votre garde-manger / armoire / bureau. » Vos clients ne s’attendent pas vraiment à ce que les produits associés apparaissent sur la page du panier, ils ne sont donc pas préparés et, espérons-le, les incitent à continuer à naviguer.

La page de panier standard de WooCommerce ne peut être modifiée qu’avec du code ou un plugin tiers. Jouer avec les hooks WooCommerce et les modèles PHP n’est pas amusant pour tout le monde, et d’ailleurs, tous les plugins ne sont pas faits pour Divi.

Notre plugin Créateur de boutique Divi apporte la facilité d’utilisation de Divi Builder à WooCommerce et permet aux utilisateurs de Divi de créer une page de panier WooCommerce personnalisée comme n’importe quelle autre page. Apprenez-en plus sur Divi Shop Builder pour WooCommerce et voyez comment cela fonctionne pour que vous puissiez concevoir un site Web de commerce électronique sans aucun code dans notre aperçu des produits:

Voyons Divi Shop Builder en action et créons une page de panier WooCommerce.

Comment créer une conception de page de panier WooCommerce personnalisée

Étape 1: définir la page du panier

Vous devez d’abord définir la page du panier dans les paramètres du plugin WooCommerce. Pour ce faire, allez dans WooCommerce> Paramètres et cliquez sur l’onglet Avancé. Là où il est dit « Page du panier », sélectionnez « Panier » dans le menu déroulant. Lorsque vous avez terminé, faites défiler vers le bas de la page et cliquez sur Enregistrer les modifications.

Étape 2: Installez et activez le plugin Divi Shop Builder

Ensuite, visitez le site Web de Divi Space et acheter le plugin Divi Shop Builder. Vous pouvez accéder au fichier de téléchargement du plugin et à la clé de licence à partir de la page de votre compte. Une fois le plugin téléchargé, installez-le et activez-le comme n’importe quel autre plugin. Lorsque vous avez terminé, le plugin apparaîtra dans le menu Divi.

Retrouvez le plugin Divi Shop Builder dans le menu Divi

Lorsque vous cliquez sur le menu du plugin, il vous sera demandé d’authentifier votre achat de plugin. Saisissez votre clé de licence sur la page Mon compte du site Internet de Divi Space. Une fois que vous avez autorisé le plugin, vous êtes prêt à l’utiliser.

Il n’y a pas d’étapes de configuration ou de configuration pour le plugin Divi Shop Builder. Une fois installé, il fonctionne directement dans le Divi Builder. Le tableau de bord du plugin résume simplement les fonctions du plugin et propose un lien vers sa documentation.

Un aperçu du tableau de bord du plugin Divi Shop Builder

Étape 3: créer une page de panier WooCommerce personnalisée

Pour utiliser le plugin Divi Shop Builder, ouvrez la page du panier et activez le Divi Builder. Vous verrez quatre nouveaux modules:

  • Liste de panier
  • Panier d’achat / notes de paiement
  • Totaux du panier

Regardons-les en détail

Veuillez noter que nous avons pré-conçu nos paramètres de module dans le personnalisateur de thème. Par conséquent, ils sont importés avec un style de conception spécifique tel que la police, la couleur de police et la conception de bouton qui est déjà terminée. Si tu ne l’as pas CSS ajouté à votre sujet enfant Si vous n’avez pas changé les valeurs dans le personnalisateur de thème, vos modules afficheront le style Divi standard.

Module de liste de panier d’achat

Ce module ajoute la liste du panier que votre client peut consulter. Chacun des éléments du module Liste de panier peut être activé ou désactivé en fonction de l’apparence souhaitée. De plus, chaque élément de texte peut être édité et peut être exécuté via le Divi Builder lui-même.

Le module «Liste de panier» vous permet également de configurer la page «Vider le panier» en proposant une notification personnalisée et un bouton de redirection avec une URL.

Module d’avis de panier / paiement

Ensuite, vous pouvez ajouter des notifications à votre page de panier à l’aide du module Alertes.

Module de panier complet

Enfin, ajoutez le module «Sommes du panier» pour fermer la page et amener vos clients à passer à la caisse.

Style des modules de chariot

Les modules de chariot peuvent être conçus individuellement avec le Divi Builder. Accédez à l’onglet Conception pour jouer avec les éléments et affiner votre identité de marque ou votre design.

Comme déjà mentionné, nous avons prédéfini les styles de conception de nos modules dans le personnalisateur de thème. Pour cette raison, les paramètres par défaut du thème Divi ne sont pas affichés.

Personnalisation étendue des modules de chariot

Si vous souhaitez ajouter plus de personnalisations aux modules du panier, vous pouvez le faire à partir de l’onglet Avancé.

Exemples de pages de panier

Avec le module Divi Shop, il est incroyablement facile de créer une nouvelle page de panier pour votre boutique en ligne. Voici un exemple d’une superbe page de panier d’achat réalisée avec le plugin.

Utilisez cette mise en page et plus encore lorsque vous achetez le plugin Divi Shop Builder! Ignorez les étapes de conception et utilisez ce magnifique modèle de page de panier WooCommerce dans votre boutique en ligne. Acheter le plugin Divi Shop Module et vous obtenez une collection de mises en page gratuites!

Créez des pages de panier WooCommerce personnalisées à l’aide de nos mises en page JSON

Si vous souhaitez gagner du temps sur le développement, vous pouvez contourner le processus de création d’une page de panier en utilisant notre site Web. modèles de page de panier préfabriqués. Notre équipe de conception a créé un certain nombre de superbes mises en page de panier WooCommerce qui peuvent être utilisées dans la bibliothèque Divi.

Ces mises en page de fichiers JSON sont gratuites lorsque vous achetez le plugin Divi Builder dans notre boutique. Voici un exemple de mise en page de panier d’achat fourni avec le plugin:

Un exemple de mise en page de panier WooCommerce

Cette mise en page ainsi que d’innombrables autres, peut être à toi si tu acheter le plugin Divi Shop Builder.

Téléchargez les mises en page de Divi Shop Builder

Dès que vous avez acheté le plugin Divi Shop Builder, visitez notre Page de démonstration et téléchargez la mise en page de votre choix. Un téléchargement commencera. Une fois le processus terminé, un fichier ZIP sera enregistré sur votre ordinateur. Décompressez le fichier et vous y trouverez la mise en page JSON.

Installer les mises en page Divi Shop Builder

Allez maintenant à la bibliothèque Divi.

Accédez à la bibliothèque Divi depuis le menu Divi

Ici, cliquez sur le bouton Importer et exporter. Une fenêtre contextuelle apparaîtra. Cliquez sur l’onglet Importer et sélectionnez la mise en page de votre choix sur votre ordinateur. Une fois l’installation terminée, vous verrez les mises en page qui ont été ajoutées à votre bibliothèque Divi.

Les deux mises en page présentées dans ce didacticiel sont:

  • Emusic Cart (montré au début de cet article)
  • Chariot de fleuriste (illustré au début de cette section)

Nous vous recommandons d’attribuer des catégories aux mises en page. Cela facilite l’organisation et la recherche des mises en page plus tard.

De nouvelles mises en page ont été ajoutées à votre bibliothèque Divi

Utilisez les mises en page Divi Shop Builder

Une fois la mise en page prédéfinie ajoutée, créez une nouvelle page et activez le Divi Builder. Utilisez le Divi Builder pour ajouter la mise en page enregistrée et en quelques secondes, vous auriez créé une page de panier d’achat accrocheuse pour votre boutique en ligne.

Personnalisez la mise en page avec du texte et des couleurs de marque pour un effet om-brand.

Fin des pensées

L’utilisation du plugin Divi Shop Builder vous permet de créer des designs incroyables pour votre boutique. Ce plugin vous permet de créer un modèle de page de panier WooCommerce vraiment unique qui reflète votre marque et se connecte avec vos clients. En plus de modifier la page du panier WooCommerce, le plugin vous aide également à créer une expérience de paiement personnalisée pour votre boutique en ligne ainsi que de nombreuses autres fonctionnalités.

Acheter le plugin Divi Shop Builder de Divi Space et commencez à créer de superbes magasins WooCommerce et Divi qui se démarqueront de la foule.

Si vous avez acheté le plugin et que vous l’utilisez déjà, envoyez-nous un lien vers la page de votre panier. Nous serions ravis de voir vos créations! Merci pour la lecture!



Source link

Recent Posts