Le formulaire de contact du thème Divi est un outil puissant et flexible pour interagir avec vos visiteurs. Cependant, pour maximiser son efficacité et offrir une expérience utilisateur personnalisée, il est utile d’apporter quelques ajustements. Cet article vous guide à travers deux améliorations spécifiques au formulaire de contact Divi : personnaliser la couleur du message de confirmation et configurer une redirection après la soumission.
1. Changer la couleur du message de confirmation dans Divi
Par défaut, le formulaire de contact de Divi affiche un message de confirmation une fois le formulaire soumis avec succès. Cependant, ce message peut manquer de personnalisation ou ne pas correspondre à votre identité visuelle. Heureusement, Divi permet de modifier facilement cet aspect à l’aide d’un peu de CSS.
Voici un exemple de code CSS pour changer la couleur du message de confirmation :
Copier le code.et-pb-contact-message {
color: white !important;
}
Étapes pour appliquer ce code :
- Connectez-vous à votre tableau de bord WordPress.
- Rendez-vous dans Divi > Options du thème > CSS personnalisé ou dans Apparence > Personnaliser > CSS additionnel.
- Collez le code ci-dessus et enregistrez.
Explication du code :
.et-pb-contact-message
est la classe CSS utilisée par Divi pour cibler le message de confirmation du formulaire.color: white;
modifie la couleur du texte en blanc. Vous pouvez remplacerwhite
par n’importe quelle couleur commered
,blue
ou un code hexadécimal tel que#0073e6
.- Le
!important
garantit que ce style prime sur tous les autres définis dans les fichiers de style Divi ou ailleurs.
Exemple d’utilisation :
Si votre site utilise un fond sombre, passer le texte en blanc rend le message de confirmation plus lisible. Vous pouvez aussi ajuster les autres styles comme la taille ou le style de police pour un rendu plus esthétique.
2. Rediriger les utilisateurs vers une page spécifique après soumission
Divi offre une fonctionnalité native pour rediriger les utilisateurs vers une page de votre choix une fois qu’ils ont soumis un formulaire. Cela peut être utile pour les remercier, leur fournir des informations supplémentaires ou les guider vers une étape suivante.
Configurer la redirection dans le formulaire Divi :
- Éditez votre page avec le Visual Builder :
- Accédez à la page contenant votre formulaire de contact et ouvrez l’éditeur Divi.
- Accédez aux paramètres du module Formulaire de contact :
- Cliquez sur le module du formulaire pour ouvrir ses paramètres.
- Activez la redirection :
- Dans l’onglet Contenu, faites défiler jusqu’à la section Options de réussite.
- Activez l’option Rediriger vers une URL.
- Saisissez l’URL de redirection :
- Entrez l’adresse de la page où vous souhaitez rediriger les utilisateurs. Par exemple, une page de remerciement comme
https://votresite.com/merci
.
- Entrez l’adresse de la page où vous souhaitez rediriger les utilisateurs. Par exemple, une page de remerciement comme
- Enregistrez les modifications :
- Sauvegardez les paramètres du formulaire, puis mettez à jour votre page.
Allier personnalisation et redirection pour une expérience optimale
En combinant ces deux ajustements, vous offrez une expérience fluide et professionnelle à vos utilisateurs :
- Le message de confirmation personnalisé fournit un retour immédiat et visuel.
- La redirection permet d’engager davantage vos visiteurs en les guidant vers des pages stratégiques, qu’il s’agisse d’un remerciement, d’une offre spéciale ou d’un contenu pertinent.
Bonnes pratiques pour les formulaires Divi :
- Testez vos modifications : Après avoir personnalisé le message ou configuré une redirection, soumettez le formulaire pour vérifier que tout fonctionne comme prévu.
- Utilisez un suivi des conversions : Si vous redirigez vers une page, configurez des outils comme Google Analytics pour mesurer l’efficacité de vos formulaires.
- Adaptez la couleur à votre charte graphique : Assurez-vous que vos modifications s’intègrent harmonieusement avec le design global de votre site.
Conclusion
Le formulaire de contact de Divi est déjà un excellent outil, mais avec un peu de personnalisation, vous pouvez transformer une interaction standard en une expérience utilisateur mémorable. En changeant la couleur du message de confirmation et en configurant une redirection après la soumission, vous renforcez non seulement votre image de marque, mais aussi l’engagement des visiteurs. Mettez ces astuces en pratique pour maximiser l’impact de vos formulaires Divi !