Comment personnaliser entièrement les pages de paiement de WooCommerce avec Elementor

Si la page de paiement n'est pas assez attrayante ou si la procédure est trop lourde, cela peut influencer la décision d'achat du client. Utilisez la Elementor (utilisé comme expression nominale) Sortie de caisse WidgetLe système peut être entièrement personnalisé. WooCommerce L'aspect de la page de paiement pour qu'elle corresponde au style de la marque, mais aussi pour optimiser le processus de vente.

Cet article vous montrera comment vous pouvez utiliser la fonction Widget de caisseLes pages de paiement de WooCommerce sont conçues pour être à la fois belles et efficaces.

Introduction à Elementor Checkout Widget

Elementor Checkout Widget est un outil puissant qui permet aux utilisateurs de personnaliser entièrement le design de la page de paiement de WooCommerce. Que vous souhaitiez modifier la mise en page, changer le style des champs ou ajouter une personnalisation aux boutons et aux résumés de commande, Elementor vous offre une multitude d'options de personnalisation. Grâce à ce widget, vous pouvez concevoir la page de paiement en fonction des besoins de votre marque et garantir un processus de paiement fluide et efficace.

Procédure pour le widget Checkout d'Elementor

Étape 1 : Mise en place de la structure de base

1. le choix de la mise en page

Dans l'éditeur Elementor, vous pouvez choisir de concevoir la page d'encaissement comme un mise en page à une seule colonne peut-être disposition en deux colonnes. Des options flexibles sont disponibles en fonction du style et du contenu de la page.

• mise en page à une seule colonne: Convient aux pages qui requièrent un design épuré et un contenu clair et ciblé.
• disposition en deux colonnes: Idéal pour les pages où vous souhaitez afficher plus d'informations, telles qu'un résumé de la commande ou des offres spéciales sur le côté droit.

Il peut également être défini comme Positionnement fixepour s'assurer que le processus de paiement n'est pas faussé par le défilement de la page. Pour ce faire, il suffit de définir la propriété compensationvous pouvez éviter le chevauchement avec l'en-tête de la page.

2) Mise en place du formulaire de paiement

existent Paramètres de WooCommerce dans lequel vous pouvez configurer le Informations sur la facturation répondre en chantant Informations sur la livraison.

Si l'adresse de livraison et l'adresse de facturation du client sont identiques, le système fusionnera automatiquement les deux formulaires pour simplifier le processus de remplissage.

• Libellés des champs personnalisésLes étiquettes et le texte des champs de formulaire peuvent être ajustés pour mieux correspondre à la tonalité de la marque.

• alignementLes champs doivent être alignés de manière à ce que la page soit plus claire.

Étape 2 : Personnaliser les informations complémentaires et les informations relatives à la commande

1) Section des informations complémentaires

sélectionnable Afficher ou masquer Section d'informations supplémentaires, telles que les demandes spéciales des clients ou d'autres notes. Le titre, l'alignement et d'autres détails de cette section peuvent être personnalisés à l'aide d'Elementor.

2. les informations sur les commandes et les coupons

Dans la section des informations relatives à la commande, vous pouvez définir légende répondre en chantant alignementet pour coupon Fournir des textes personnalisés pour que les clients se sentent plus attentifs.

Étape 3 : Mise en place des méthodes de paiement

Les méthodes de paiement constituent un élément central de la page de paiement. L'apparence de la zone de paiement peut être personnalisée pour s'assurer qu'elle est cohérente avec l'ensemble de la conception.

1. affichage des conditions générales

Pour que les utilisateurs acceptent les conditions générales lors du paiement, assurez-vous que la page des conditions générales est correctement sélectionnée dans les paramètres de WooCommerce. Un lien vers le texte des conditions générales est affiché au bas de la page de paiement, afin que les clients puissent facilement les consulter et les accepter.

2. personnaliser le bouton d'achat

Réglable bouton d'achat L'alignement permet de s'assurer qu'il est bien positionné pour que les clients cliquent dessus pour effectuer le paiement.

Étape 4 : Paramètres de style

Après avoir terminé la configuration de la disposition et des fonctions, allez à l'adresse suivante Réglages du styleEn commençant parpage de paiementAjoutez un style personnalisé.

1) Arrière-plans et bordures

En ajustant couleur de fond répondre en chantant Styles de borduresGrâce à l'effet d'arrière-plan, vous pouvez faire ressortir davantage les différentes parties de la page de paiement. Différents effets d'arrière-plan et d'ombre peuvent être définis pour le formulaire de paiement, le récapitulatif de la commande, la zone des coupons et d'autres sections.

2. polices de caractères et typographie

existent Paramètres de mise en page Vous pouvez personnaliser les styles de police des titres, des champs et des boutons, et ajuster les couleurs, les tailles et l'espacement pour que vos pages aient un aspect professionnel et soient faciles à lire.

3. les styles de formulaires et de boutons

Définir des bordures pour les champs de formulaire, les boutons et d'autres éléments etcouleur de fondVous pouvez également ajouter des effets de survol aux champs de saisie et aux boutons pour les rendre plus interactifs. Vous pouvez également ajouter des effets de survol aux champs de saisie et aux boutons pour améliorer l'interactivité.

Étape 5 : Sauvegarde et prévisualisation

Une fois tous les paramètres de conception et de style définis, cliquez sur Enregistrer et publier pour appliquer les modifications à la page.

frappe (sur le clavier) avant-premièrespour voir comment se présente la page de paiement sur ordinateur et sur mobile.

résumés

Le Widget de caisseAvec WooCommerce, vous pouvez facilement personnaliser chaque aspect de votre page de paiement WooCommerce pour vous assurer qu'elle répond aux besoins de votre marque et améliore l'expérience de l'utilisateur. Des paramètres de mise en page aux ajustements de style, chaque détail peut être personnalisé selon les besoins. Cela permettra d'augmenter les conversions des utilisateurs et d'optimiser l'expérience d'achat.

Pour plus de tutoriels et d'informations sur WordPress, veuillez suivre les liens suivantsRéseau de fluctuation des photonsavec les tutoriels WordPress les plus complets et les plus actifs.Communauté d'échange WordPress.

Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !	Service clientèle WeChat
① Tel : 020-2206-9892
② QQ咨询：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.