Le bloc Panier EDD vous permet de créer une page de panier personnalisée pour votre boutique Easy Digital Downloads. Ce bloc affiche le contenu du panier avec un contrôle total sur le style, la mise en page et la présentation visuelle, vous aidant à créer une expérience de panier professionnelle qui correspond à votre marque.
Une page de panier bien conçue est cruciale pour finaliser les ventes et réduire l'abandon de panier. Avec ce bloc, vous pouvez personnaliser chaque aspect de l'apparence de votre panier, de la typographie de l'en-tête et des styles de boutons aux listes de produits et aux affichages de prix. Créez une page de panier qui inspire confiance et guide les clients en douceur vers le paiement.
Ajouter le bloc Panier EDD à vos pages
Suivez ces étapes pour ajouter un bloc Panier EDD à votre page SeedProd :
Étape 1 : Ajouter le bloc
Sous Design > Blocs > Easy Digital Downloads, faites glisser et déposez le bloc Panier dans la section souhaitée de votre page.
Le bloc Panier EDD se trouve sous Easy Digital Downloads et peut être ajouté pour créer une page de panier personnalisée.
Étape 2 : Personnaliser le design
Une fois ajouté, cliquez sur le bloc Panier EDD pour ouvrir ses paramètres. Dans l'onglet Styles, vous pouvez personnaliser l'apparence visuelle de votre panier.
En-têtes :
- Typographie : Contrôlez les propriétés de la police pour les en-têtes du panier comme « Votre panier » ou les titres de section, y compris la famille de polices, la taille, le poids et le style.
- Couleur de l'en-tête : Définissez la couleur du texte de l'en-tête pour qu'elle corresponde à votre marque.
Boutons :
- Style de bouton : Choisissez le traitement visuel des boutons du panier comme « Mettre à jour le panier » ou « Passer à la caisse ». Les options incluent Plat (design plat moderne), 2D (profondeur subtile), Vintage (look classique), Fantôme (transparent avec bordure) ou Lien (simple lien texte).
- Couleur du bouton : Définissez la couleur d'arrière-plan des boutons d'action du panier.
- Rayon de la bordure : Ajustez l’arrondi des coins du bouton. Des valeurs plus élevées créent des boutons plus arrondis, tandis que zéro crée des coins nets.
Panier :
- Couleur de la bordure du panier : Définissez la couleur des bordures autour du tableau du panier et des éléments.
- Largeur de la bordure du panier : Ajustez l'épaisseur des bordures (Haut, Droite, Bas, Gauche) autour des éléments du panier.
- Couleur de l'arrière-plan : Définissez la couleur d'arrière-plan du tableau ou du conteneur du panier.
- Couleur du texte du produit : Choisissez la couleur des noms et descriptions des produits dans le panier.
- Typographie du produit : Contrôlez les propriétés de la police pour les noms et descriptions des produits.
- Couleur du texte du prix : Définissez la couleur des affichages de prix dans le panier.
- Typographie du prix : Personnalisez les propriétés de la police pour les prix.
- Couleur du texte du total : Choisissez la couleur des montants totaux du panier.
- Typographie du total : Contrôlez les propriétés de la police pour les montants totaux, y compris les sous-totaux et les totaux généraux.
- Couleur des liens : Définissez la couleur des liens cliquables dans le panier (comme « Supprimer » ou les liens de produits).
- Typographie des liens : Personnalisez les propriétés de la police pour les liens du panier
L'onglet Styles fournit des options complètes pour personnaliser les en-têtes, les boutons et tous les éléments d'affichage du panier.
Étape 3 : Configurer les options avancées
Dans l'onglet Avancé, vous pouvez personnaliser davantage votre bloc de panier EDD :
Espacement :
- Marge : Contrôlez l'espacement extérieur autour de votre bloc de panier (Haut, Droite, Bas, Gauche). Cela détermine l'espace qui apparaît entre le panier et les éléments environnants.
- Rembourrage : Ajustez l'espacement intérieur de votre bloc de panier (Haut, Droite, Bas, Gauche). Cela crée un espace entre le contenu du panier et ses bords.
Attributs :
- ID CSS : Affiche l'identifiant unique généré automatiquement pour votre bloc de panier. Cet ID est créé automatiquement par SeedProd pour un style personnalisé ou un ciblage JavaScript.
- Classe personnalisée : Ajoutez des classes CSS personnalisées pour appliquer des styles spécifiques de votre thème ou de votre CSS personnalisé
- Attributs personnalisés : Ajoutez tous les attributs HTML à l'élément conteneur du panier. Entrez chaque attribut sur une nouvelle ligne en utilisant le format : nom-attribut|valeur (par exemple, data-cart|edd-cart)
Visibilité de l'appareil :
- Masquer sur ordinateur : Masquez le bloc de panier sur les écrans d'ordinateur.
- Masquer sur tablette : Masquez le bloc de panier sur les appareils tablettes.
- Masquer sur mobile : Masquez le bloc de panier sur les appareils mobiles.
Effets d'animation :
- Animation d'entrée : Choisissez parmi divers effets d'animation qui se jouent lorsque le panier défile dans la vue. Les options incluent Bounce, Fade In, Zoom In, Rotate In, et bien d'autres.
L'onglet Avancé fournit des options pour l'espacement, les attributs personnalisés, la visibilité des appareils et les effets d'animation.
Étape 4 : Enregistrez vos modifications
Une fois que vous avez terminé de configurer le bloc de panier EDD et de personnaliser son apparence, assurez-vous de sauvegarder votre travail.
Vous avez ajouté avec succès un bloc de panier EDD à votre page ! Cet affichage de panier personnalisable vous aide à créer une expérience d'achat professionnelle qui correspond à votre marque et guide les clients en douceur vers le paiement. Expérimentez avec différentes couleurs, typographies et styles de boutons pour créer une page de panier qui renforce la confiance et réduit l'abandon de panier.