en cours d'utilisation WordPress Lors de la création d'un site web de commerce électronique, le degré de flexibilité de la mise en page aura une incidence directe sur l'effet visuel du site web et sur l'expérience de navigation et d'achat du visiteur.Woodmart En tant que thème WooCommerce premium compatible avec Elementor, il offre une mise en page flexible et de riches options de conception. Avec le constructeur de pages Elementor, vous pouvez librement personnaliser la page d'accueil, les pages de produits, les pages de catégories et d'autres pages sans avoir besoin de connaissances de base en programmation.
Cet article présente le processus et les techniques de personnalisation des mises en page de Woodmart avec Elementor pour vous aider à créer des pages de commerce électronique qui correspondent au positionnement de votre marque.
![Image [1]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724101759986-image.png)
I. Activation d'Elementor et de l'héritage des modèles
Installer et activer le plugin Elementor
- Aller sur la page du plugin WordPress
- Cliquez sur le menu "Plugins" et sélectionnez "Ajouter un plugin".
- Recherchez et installez "Elementor".
- Une fois l'installation terminée, sélectionnez "Activer".
![Image [2]-Elementor avec Woodmart pour créer un guide de mise en page flexible pour le commerce électronique](http://gqxi.cn/wp-content/uploads/2025/07/20250724094757683-image.png)
Créez une nouvelle page et activez Elementor.
- Allez dans "Pages" → "Nouvelle page".
- Saisissez le titre de la page, par exemple "Ma maison".
- Cliquez sur le bouton "Edit with Elementor" pour accéder à l'éditeur visuel.
Maintenant que vous êtes dans l'interface d'édition de page d'Elementor, vous pouvez commencer à personnaliser votre mise en page.
![Image [3]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724095744410-image.png)
Comprendre la structure de base d'Elementor
La zone d'édition d'Elementor se compose de trois parties :
- Barre supérieureElle est située en haut de la page et permet d'effectuer des opérations telles que l'enregistrement, la prévisualisation et le passage d'une vue à une autre ;
- PanelLa page d'accueil : située sur le c?té gauche, elle contient tous les widgets disponibles et les options de paramétrage ;
- ToileLa zone centrale, où l'on construit la page et où l'on fait glisser les composants.
Vous êtes libre de combiner ces éléments pour créer la structure de page que vous souhaitez.
![Image [4]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724164257969-image.png)
IV. introduction et utilisation des composants les plus courants
Voici quelques composants courants et leur utilisation :
- légendeAjouter un titre principal ou un sous-titre
- éditeur de texteTexte : saisie du contenu du texte, police, taille et couleur réglables.
- photographieInsérer des images de produits, des bannières, des logos, etc.
- boutons: pour sauter des liens, soumettre des formulaires, etc.
- vidéoSupport pour l'intégration de vidéos YouTube et Vimeo
- Bo?te à ic?nes/bloc de serviceLes avantages et la démonstration des fonctions : Convient à la présentation des avantages et à la démonstration des fonctions
- Rotation de l'image/diaporamaAffichage de plusieurs contenus d'images
- Google MapsAdresse du magasin ou du bureau : Embedded
- formulaire (document): recueillir des informations sur l'utilisateur pour les utiliser avec des plugins (par exemple WPForms)
Il suffit de faire glisser et de déposer le composant de gauche dans la zone de page de droite pour prévisualiser et ajuster le style en temps réel.
![Image [5]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724100734850-image.png)
V. Adapter la typographie et le style
Elementor offre un très grand nombre d'options de personnalisation :
- Définition de la largeur, des marges intérieures, de l'image d'arrière-plan ou de la couleur d'arrière-plan d'un paragraphe/d'une colonne
![Image [6] - Guide Elementor pour créer des mises en page flexibles pour l'e-commerce avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724173917197-image.png)
![Image [7]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724174018362-image.png)
- Définition de la police, de la couleur, de la bordure, de l'ombre, de l'espacement, etc. pour chaque composant
![Image [8]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724174119659-image.png)
- Des pages réactives qui peuvent être stylisées pour différents appareils (téléphones mobiles/tablettes/ordinateurs)
![Image [9]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724174214831-image.png)
En outre, vous pouvez enregistrer un bloc entier en tant que modèle pour le réutiliser facilement sur d'autres pages.
VI. enregistrer et publier
Pas prêt à être publié :.
Vous pouvez cliquer sur "Enregistrer le brouillon" pour l'enregistrer en vue d'une révision ultérieure.
Une fois la conception de la page terminée :
- Cliquez sur le bouton "Publier" dans le coin supérieur droit.
![Image [10]-Guide de l'éditeur pour créer des mises en page flexibles pour le commerce électronique avec Woodmart](http://gqxi.cn/wp-content/uploads/2025/07/20250724101327811-image.png)
court
Avec Elementor en conjonction avec Woodmart, le contenu de la page et lestypographiqueDes paramètres flexibles vous permettent de glisser et de déposer des modules, d'ajuster la typographie et de contr?ler le contenu de l'affichage pour créer un style visuel qui correspond au ton de votre marque, qu'il s'agisse d'une page d'accueil, d'une page de catégorie ou d'une page de détail de produit. Grace à cette combinaison, vous pouvez rapidement créer des pages de boutique WooCommerce de qualité professionnelle sans faire appel à des développeurs.
Lien vers cet article :http://gqxi.cn/fr/69815L'article est protégé par le droit d'auteur et doit être reproduit avec mention.
Pas de commentaires