En utilisant les paramètres de site d’Elementor, vous pouvez rapidement personnaliser de nombreux aspects de votre site liés à WooCommerce. Cela vous aide à travailler plus efficacement et à maintenir la cohérence sur l’ensemble de votre site.
Il existe deux façons d’accéder à ces paramètres :
- Via l’éditeur Elementor
- Via la section Hello Commerce de l’administration WordPress
Pour accéder aux paramètres du site via l’éditeur Elementor :
- Ouvrez n’importe quelle page de votre site dans Elementor.
Dans cet exemple, nous ouvrirons la page d’accueil depuis l’administration WordPress.
- Dans la barre d’outils supérieure, cliquez sur l’icône Paramètres du site.
- Dans le panneau de gauche, cliquez sur Hello Commerce.
Cela ouvre le panneau des paramètres. Le panneau des paramètres est divisé en trois parties :
- Boutons Woo : Boutons liés à WooCommerce tels que le bouton « Ajouter au panier ».
- Prix Woo: Prix que vous contrôlez via WooCommerce. Ce sont les prix que vous saisissez lors de la création ou de la modification des produits.
- Flash de vente: Également connu sous le nom de badge de vente, il s’agit d’un indicateur visuel qui apparaît sur les images ou les listes de produits pour montrer qu’un produit est en promotion. Vous créez un flash de vente en modifiant un produit.
Voir Paramètres ci-dessous pour une explication complète de toutes les options disponibles.
Pour accéder aux paramètres du site via l’éditeur Elementor :
- Allez dans l’administration WordPress.
- Naviguez jusqu’à la section Hello Commerce de l’administration WordPress.
- Dans le volet de droite, dans la section Style de boutique, choisissez l’un des trois paramètres du site :
- Boutons Woo : Boutons liés à WooCommerce tels que le bouton « Ajouter au panier ».
- Prix Woo: Prix que vous contrôlez via WooCommerce. Ce sont les prix que vous saisissez lors de la création ou de la modification des produits.
- Flash de vente: Également connu sous le nom de badge de vente, il s’agit d’un indicateur visuel qui apparaît sur les images ou les listes de produits pour montrer qu’un produit est en promotion. Vous créez un flash de vente en modifiant un produit.
Modifier un paramètre – étape par étape
- Ouvrez une page dans l’éditeur Elementor
- Cliquez sur l’icône Paramètres du site.
- Cliquez sur Hello Commerce.
Les paramètres s’ouvrent avec la section Boutons Woo ouverte.
- Cliquez sur l’icône du crayon
à côté de Typographie.
- Changez la famille en quintessential. Pour plus de détails sur les polices, voir Typographie.
- Cliquez sur enregistrer les modifications.
Maintenant, si vous allez sur les pages de produits ou le panier d’achat, les boutons Woo utiliseront la police Quintessential.
Voir toutes les options disponibles avec les paramètres du site.
Regardez une vidéo démontrant le widget en action.
Les paramètres du site
Vous pouvez personnaliser vos widgets en utilisant le contenu, le style et d’autres paramètres avancés, vous offrant une grande flexibilité pour les adapter à vos besoins. Cliquez sur les onglets ci-dessous pour voir tous les paramètres disponibles pour ce widget.
Typographie
Définissez le type et la taille de la police. Pour plus de détails, voir Typographie.
Normal/survol
- Normal : Déterminez l’apparence par défaut des boutons.
- Survol : Déterminez l’apparence des boutons lorsqu’on passe la souris dessus.
Couleur du texte
Définissez la couleur des mots sur le bouton. Pour plus de détails, voir Choisir une couleur ou Utiliser des polices et des couleurs globales.
Type d'arrière-plan
Utilisez pour basculer entre un arrière-plan uni (Classique) ou un arrière-plan dégradé (Gradient). Pour plus de détails, voir Créer un arrière-plan.
Couleur
Définissez la couleur du bouton. Pour plus de détails, voir Choisir une couleur ou Utiliser des polices et des couleurs globales.
Bordure
Vous avez la possibilité d’ajouter une bordure aux boutons. Basculez sur Oui pour ajouter une bordure.
Si vous ajoutez une bordure, vous devrez déterminer :
- Largeur de la bordure : Utilisez le curseur pour déterminer l’épaisseur de la bordure.
- Couleur : Ajoutez une couleur à la bordure. Pour plus de détails, voir Choisir une couleur ou Utiliser des polices et des couleurs globales.
- Rond : Les boutons apparaissent avec des coins lisses.
- Arrondi : Les boutons apparaissent avec des bords uniformément courbés.
- Net : Boutons rectangulaires.
- Personnalisé : Ajustez le rayon en utilisant les quatre compteurs pour ajuster chaque coin individuellement. En savoir plus sur ces méthodes de mesure.
- Forme : Lors de l’utilisation d’un bouton, utilisez le menu déroulant pour sélectionner :
- Ombre portée : Ajoutez de la profondeur à vos boutons avec des ombres. Pour plus de détails, voir Qu’est-ce que l’ombre, l’ombre du texte et l’ombre encadrée ?
Rembourrage
Créez un espacement à l’intérieur des boutons.
Pour plus de détails, voir Rembourrage et marges.
Typographie
Définissez le type et la taille de police des prix. Pour plus de détails, voir Typographie.
Couleur du texte
Définissez une couleur pour les prix des produits. Pour plus de détails, voir Choisir une couleur ou Utiliser des polices et des couleurs globales.
Typographie
Définissez le type et la taille de police des prix de vente. Pour plus de détails, voir Typographie.
Couleur du texte
Définissez une couleur pour les prix de vente. Pour plus de détails, voir Choisir une couleur ou Utiliser des polices et des couleurs globales.
Couleur d'arrière-plan
Aidez à faire ressortir les prix de vente en ajoutant un arrière-plan. Pour plus de détails, voir Créer un arrière-plan.
