Les tendances d'achat évoluent à un rythme rapide et les gens ont tendance à acheter en ligne plus que jamais.
C'est pourquoi ils ont besoin d'un magasin de commerce électronique qui augmente pour satisfaire les habitudes d'achat en ligne, car les gens trouvent plus pratique d'acheter en ligne plutôt que de sortir pour faire du shopping.
Vous pouvez également démarrer votre boutique de commerce électronique immédiatement, en utilisant les bons outils et la bonne configuration. Et vous remarquerez une augmentation drastique de vos ventes en un temps record.
Si vous avez prévu de démarrer une boutique de commerce électronique et que vous recherchez un expert WordPress pour faire le travail pour vous, laissez-moi vous dire que vous n'en avez pas besoin.
Oui! Vous pouvez le faire vous-même car vous n'avez pas besoin d'être un développeur WordPress ou un expert en codage et vous pouvez le faire sans avoir aucune connaissance du codage avec les bons outils et la bonne configuration.
Suivez simplement le tutoriel étape par étape de création d'une page de boutique WooCommerce à l'aide du générateur de page Elementor.
Allons plus loin pour en venir au fait!
- De quoi aurez-vous besoin pour créer une page produit à l'aide d'Elementor?
- Comment installer le générateur de pages Elementor?
- Créer une page produit Elementor WooCommerce étape par étape
- Mobile optimisez votre page produit WooCommerce
- Tarifs Elementor Pro
- Emballer
De quoi aurez-vous besoin pour créer une page produit à l'aide d'Elementor?
Installez le plugin sur votre site WordPress à partir du référentiel WordPress.org et en plus de cela, vous devrez installer le constructeur de pages Elementor . La version gratuite peut être téléchargée à partir de WordPress.org, mais la version gratuite est livrée avec des options de personnalisation limitées. Par conséquent, si vous souhaitez obtenir des options de personnalisation illimitées, optez pour le pro Elementor et téléchargez-le à partir du site officiel Elementor.org.
Comment installer le générateur de pages Elementor?
- Pour la version gratuite d'Elementor:
Allez dans Plugin > Ajouter un nouveau> entrez dans le générateur de page Elementor> cliquez sur installer et activez.
- Pour Elementor Pro:
Achetez la version Pro sur Elementor.com, puis téléchargez le fichier zip, puis cliquez sur installer et activer.
Créer une page produit Elementor WooCommerce étape par étape
La page de produit WooCommerce standard ressemble à n'importe quelle page de produit WooCommerce de base sans aucune netteté.
Cependant, si vous souhaitez ajouter la voix de votre marque, vous devez la personnaliser de manière unique.
Étape 1: Accédez à la section Modèle depuis le menu de votre tableau de bord et cliquez sur «Ajouter nouveau».
Maintenant, dans le menu déroulant, sélectionnez l'élément «Produit unique»
La meilleure partie est que l'Elementor est livré avec des modèles de pages de produits prédéfinis, donc, si vous souhaitez démarrer rapidement, sélectionnez quelqu'un parmi les options qui ressemble le plus à votre choix.
Il est beaucoup plus facile de créer une page de produit à partir du modèle prédéfini plutôt que de créer à partir de zéro. Par conséquent, modifiez tout modèle existant et économisez votre temps et vos efforts.
Nous avons sélectionné ce modèle pour notre page produit.
Une fois que vous avez sélectionné votre modèle préféré, il vous mènera à l'éditeur Elementor où vous pourrez personnaliser le modèle selon votre goût.
Ici, vous pouvez voir différents blocs dans le menu de gauche. Faites glisser et déposez le bloc avec lequel vous souhaitez travailler.
Cliquez sur le bouton "+" Ajouter et sélectionnez la taille de colonne que vous souhaitez ajouter.
Nous avons sélectionné deux tailles de colonne pour notre modèle de produit.
Maintenant, ajoutez un widget de titre de produit dans la colonne de droite et ajoutez-y le titre de votre produit.
Une fois que vous avez ajouté le titre du produit, l'étape suivante consiste à ajouter le «fil d'Ariane Woo» au-dessus.
Maintenant, ajoutez l'image du produit dans la colonne de gauche et faites glisser le widget d'image du produit par glisser-déposer depuis la colonne de gauche.
Vous pouvez ajouter le remplissage aux deux colonnes pour les garder légèrement éloignées l'une de l'autre.
Après avoir ajouté l'image et ajusté le rembourrage en fonction des dimensions requises, ajoutez le widget d'évaluation du produit sous le titre du produit.
Ajoutez une brève description du widget produit sous le bloc de révision du produit. vous pouvez également ajuster l'espace entre les deux blocs.
Une fois que vous avez terminé avec la description du produit et tous les détails, notre prochaine étape consiste à ajouter le prix du produit et pour cela, vous devrez faire glisser le widget de prix sous la description du produit.
Après avoir ajouté l'onglet de prix sous la description du produit, vous pouvez personnaliser le widget de prix en sélectionnant les options dans le menu de gauche. Vous pouvez agrandir l'icône, changer le style de police et aussi la couleur de police du noir à n'importe quelle autre couleur de votre choix.
Maintenant, ajoutez le widget "ajouter au panier" et personnalisez sa couleur, sa police ou son style dans le menu si vous le souhaitez.
Maintenant, ajoutez la méta du produit sous le widget de prix qui montrera la catégorie de produit et le numéro de série du produit.
Étape 2: ajoutez des informations supplémentaires sur le produit dans la section suivante.
Créez une nouvelle section à deux colonnes, puis ajoutez des onglets de données produit, y compris une description, des informations supplémentaires et des avis. Et sur le côté droit de la colonne, ajoutez la section relative aux produits.
Pour conserver le même format de chaque colonne, vous pouvez cliquer sur le coin gauche de chaque colonne et copier et coller le format de colonne pour chaque colonne.
Étape 3: ajoutez une autre section de l'ajout de "section de vente incitative".
Voici à quoi ressemblera la section de vente incitative après l'ajout. Ajoutez du rembourrage pour aligner la section.
Et enfin, vous avez terminé la conception de votre page produit. Maintenant, la dernière étape est où vous souhaitez publier votre produit? vous pouvez cliquer sur publier ou aller dans la section des yeux dans le coin inférieur le plus à gauche du menu et cliquer sur les paramètres pour sélectionner la catégorie du produit.
Cliquez sur le menu d'ajout de condition, puis sélectionnez la catégorie de votre produit et cliquez sur publier.
Mobile optimisez votre page produit WooCommerce
Étant donné que beaucoup de trafic va passer par le smartphone, vous devrez donc optimiser votre magasin pour le visionnement du smartphone, sinon vous risquez de perdre vos ventes.
Bien que le WooCommerce soit déjà optimisé pour les mobiles, pour rassurer si vos modèles de page de produit sont absolument bons sur l'écran mobile, suivez la procédure.
Vous trouverez une option Mode réactif dans le coin inférieur gauche de l'interface Elementor.
Lorsque vous cliquez sur l'option Mobile responsive, vous pouvez basculer entre les options d'affichage Mobile, Desktop et Tab.
Cliquez sur l'une des options que vous souhaitez afficher et modifier le design si vous trouvez une complication.
Maintenant, enregistrez et continuez à publier votre page produit.
Tarifs Elementor Pro
La version de base d'Elementor est disponible gratuitement tandis que la version pro est livrée avec trois licences. Si vous recherchez votre blog personnel ou un site unique, la licence personnelle vous convient le mieux, car vous pouvez obtenir un constructeur WooCommerce avec plus de 90 widgets professionnels.
Alors que les licences plus et expert conviennent aux entreprises ou aux agences en croissance avec un support de 3 sites et 1000 sites respectivement.
Emballer
Le seul but du constructeur de pages Elementor est de permettre aux utilisateurs de libérer leur créativité sans compter sur le codage. Elementor est livré avec une variété de widgets qui vous permettent de créer toutes sortes de pages de produits basées sur des mises en page attrayantes. Les éléments de base de WooCommerce sont plus de 10 qui permettent aux utilisateurs de personnaliser chaque pli et chaque courbe de la page de la boutique. Et si vous ne trouvez pas l'élément souhaité dans le menu Elementor, ne vous inquiétez pas ! Il existe de nombreux autres paramètres avancés qui peuvent mettre à niveau votre arsenal et ajouter plusieurs éléments à votre bibliothèque. L'un d'eux est Essential Add-ons qui contient des éléments dédiés à WooCommerce uniquement.
