Vous cherchez un moyen simple de créer un formulaire de contact Divi pour votre site WordPress ?
Divi est l'un des thèmes WordPress les plus populaires du marché. Il est livré avec un constructeur convivial qui vous permet de personnaliser votre site web depuis le front-end. Vous pouvez ajouter des modules de page comme le bouton d'appel à l'action, le formulaire de contact, et plus encore.
Avec le module de formulaire de contact Divi, vous pouvez créer et insérer un formulaire de contact sans aucun service tiers. C'est idéal si vous souhaitez un moyen simple d'ajouter un formulaire de contact basique sur votre site.
Cependant, vous aurez besoin d'un puissant plugin de création de formulaires comme WPForms pour des fonctionnalités avancées telles que les soumissions d'utilisateurs, le marketing par e-mail, et plus encore.
C'est pourquoi Divi Builder est également livré avec un module WPForms afin que vous puissiez facilement ajouter des formulaires de contact professionnels en quelques clics.
Dans cet article, nous allons vous montrer ces deux méthodes pour créer un formulaire de contact Divi dans WordPress :
Créer un formulaire de contact avec Divi Builder
Si vous n’avez pas encore Divi, vous devrez d’abord créer un compte Divi. Ensuite, vous pourrez accéder au tableau de bord et télécharger votre fichier de thème.
Après avoir installé et activé le thème Divi sur votre tableau de bord WordPress, ouvrez n’importe quelle page ou publication où vous souhaitez ajouter votre formulaire de contact Divi.
Dans l'éditeur de publication, vous verrez le bouton Utiliser Divi Builder. Cliquez sur le bouton pour lancer le constructeur dans le front-end de votre site.
Sur l'écran suivant, vous verrez les options pour construire une page à partir de zéro, choisir une mise en page prédéfinie ou cloner une page existante.
Pour ce tutoriel, nous allons commencer avec une page vierge et ajouter le formulaire de contact.
Ensuite, vous verrez l'éditeur Divi où vous pourrez choisir un modèle de ligne qui correspond à vos besoins.
Après avoir ajouté la ligne, vous verrez le panneau Insérer un module qui vous permet d'ajouter différents types de modules de contenu.
Si vous faites défiler vers le bas, vous trouverez le module Formulaire de contact. Cliquez simplement dessus pour insérer le formulaire de contact Divi sur votre site.
Par défaut, le formulaire de contact se compose de trois champs : Nom, E-mail et Message. Vous pouvez cliquer sur le bouton Ajouter un nouveau champ pour ajouter d'autres champs de formulaire selon vos besoins.
De plus, vous trouverez des options pour modifier le titre, le message de soumission réussie et le texte du bouton de soumission dans les paramètres Texte.
Divi vous permet également d'envoyer des messages par e-mail afin que vous puissiez être informé des nouvelles soumissions de formulaires.
De plus, vous trouverez d'autres options utiles telles que les liens de redirection, la protection anti-spam, les paramètres d'arrière-plan, et plus encore.
Avec le module de formulaire de contact Divi, vous pouvez facilement ajouter un formulaire de contact simple à votre site WordPress. Il existe de nombreuses options de personnalisation pour que vous puissiez correspondre au style de votre marque.
Si vous souhaitez ajouter des fonctionnalités plus avancées à votre formulaire de contact Divi, vous devrez utiliser un bon plugin de création de formulaires.
Et c’est exactement ce que nous allons faire dans la méthode suivante. Nous allons vous montrer comment créer un formulaire de contact Divi en utilisant le constructeur de formulaires WordPress le plus puissant, WPForms.
Créer un formulaire de contact Divi avec WPForms
WPForms est le meilleur plugin de création de formulaires par glisser-déposer pour WordPress. Il vous permet de créer tous les types de formulaires comme des formulaires de contact, des formulaires d’inscription, des formulaires de téléchargement, et plus encore en quelques clics.
WPForms est livré avec plus de 1 200 modèles de formulaires préconçus, vous n'avez donc pas besoin de créer un formulaire de contact à partir de zéro. Vous pouvez ajouter ou supprimer des champs de formulaire et les personnaliser à votre guise. Et vous n'avez même pas besoin de connaissances en codage pour cela.
Tous les formulaires de contact que vous créez avec WPForms seront 100 % réactifs, ils s'afficheront donc magnifiquement sur toutes les tailles d'écran. Il existe même une option intégrée de protection contre le spam pour que vous puissiez empêcher les soumissions de spam et de fraude sur votre site.
Avec plus de 6 millions d'installations actives, WPForms est apprécié par tous les types d'entreprises dans le monde. Si vous êtes un utilisateur de Divi et que vous souhaitez ajouter des formulaires de contact incroyables à votre site, vous pouvez également opter pour WPForms.
Voici quelques raisons pour lesquelles vous devriez créer votre formulaire de contact Divi avec WPForms :
- Facile à utiliser et à configurer
- Notifications et confirmations de formulaire avancées
- Fonctionnalité de téléchargement de fichiers et de soumission de contenu
- Système de gestion des soumissions de formulaire intégré
- Intégration du marketing par e-mail pour développer votre liste d'e-mails
- Option d'abandon de formulaire pour capturer les entrées partielles du formulaire
- Champs de formulaire pour l'e-commerce et les options de paiement
Et la bonne nouvelle, c'est qu'il existe un module WPForms dans le Divi Builder. Vous pouvez donc facilement ajouter le formulaire de contact que vous créez avec WPForms sur votre site.
De plus, vous pouvez utiliser WPForms sur n'importe quel site WordPress, avec ou sans Divi. Si vous décidez un jour d'arrêter de payer pour Divi, les formulaires que vous créez avec WPForms resteront intacts sur votre site.
Cela dit, apprenons à créer un formulaire de contact avec WPForms + Divi.
Étape 1 : Installer et activer le plugin WPForms
Tout d’abord, vous devrez créer un compte WPForms.
WPForms propose des plans tarifaires flexibles conçus pour répondre aux exigences de tous les types d'entreprises. Vous pouvez choisir un plan adapté à votre entreprise. Et il existe une version lite disponible gratuitement.
Après votre inscription, vous pourrez accéder à votre tableau de bord WPForms. Vous y trouverez le fichier du plugin ainsi que votre clé de licence dans l'onglet Téléchargements.
Vous devez installer ce fichier de plugin sur votre site WordPress. Pour plus de détails à ce sujet, vous pouvez consulter notre guide sur comment installer un plugin WordPress.
Une fois que vous avez installé et activé WPForms sur votre site, accédez à l'onglet WPForms » Paramètres sur votre tableau de bord d'administration.
Ici, vous devrez entrer la clé de licence et cliquer sur le bouton Vérifier la clé.
Ensuite, vous verrez le message de vérification réussie. Vous pouvez maintenant commencer à créer votre formulaire de contact en utilisant WPForms.
Étape 2 : Créer un formulaire de contact
Pour créer un nouveau formulaire, accédez à l'onglet Ajouter un nouveau sur votre tableau de bord WordPress. Cela lancera la bibliothèque de modèles où vous pourrez rechercher un modèle de formulaire de contact adapté à votre site.
Pour ce tutoriel, nous allons commencer avec le modèle Formulaire de contact simple. Ce modèle comprend tous les champs de formulaire de base requis pour un formulaire de contact, tels que le nom, l'e-mail et le message. Vous pouvez également prévisualiser tout autre modèle pour voir lequel vous convient le mieux.
Entrez un nom pour votre formulaire de contact et cliquez sur le bouton Utiliser le modèle sur le modèle de formulaire de votre choix.
Sur l'écran suivant, vous verrez le constructeur de formulaires par glisser-déposer de WPForms. Tous les champs du formulaire se trouvent sur le côté gauche et l'aperçu du formulaire sur le côté droit de la page.
Vous y trouverez une large gamme de champs de formulaire utiles tels que des nombres, des listes déroulantes, des choix multiples, des téléchargements de fichiers, des évaluations, du texte enrichi et bien plus encore.
Pour insérer un champ de formulaire, il vous suffit de le faire glisser depuis le côté gauche et de le placer dans l'aperçu du formulaire.
Si vous souhaitez personnaliser l'un de ces champs de formulaire, vous pouvez cliquer dessus et vous verrez les options du champ. Il existe des options pour modifier l'étiquette du formulaire, la description, le caractère obligatoire et d'autres options supplémentaires en fonction du champ du formulaire.
Une fois que vous avez ajouté tous les champs requis à votre formulaire de contact Divi, cliquez sur le bouton Enregistrer en haut du constructeur de formulaire.
Ensuite, vous devrez configurer les paramètres du formulaire, les notifications et les confirmations.
Étape 3 : Configurer les paramètres du formulaire
Pour modifier les paramètres du formulaire, ouvrez l'onglet Paramètres » Général dans le panneau de menu de gauche du constructeur de formulaires. Ici, vous pouvez modifier le nom du formulaire, la description du formulaire, le texte du bouton de soumission, et plus encore.
Dans l’onglet suivant appelé Protection contre le spam et sécurité, il y a l’option d’activer la protection anti-spam sur votre site. Cela vous aidera également à configurer Google reCAPTCHA pour votre formulaire de contact.
Ensuite, pour créer des notifications par e-mail automatisées, rendez-vous dans l'onglet Paramètres » Notifications pour configurer les notifications par e-mail pour votre formulaire de contact Divi. Vous verrez qu'il existe une notification par défaut qui est envoyée à l'adresse e-mail de l'administrateur.
Vous pouvez ajouter plusieurs adresses e-mail ou cliquer sur le bouton Ajouter une nouvelle notification pour envoyer plus d'une notification de formulaire.
Avec cela, vous pouvez vous notifier, ainsi que les membres de votre équipe, des nouvelles soumissions de formulaires, envoyer aux clients les détails de leur soumission, et plus encore.
Si vous souhaitez plus d’informations à ce sujet, vous pouvez consulter notre guide sur Comment configurer les bonnes notifications et confirmations de formulaire.
De même, WPForms vous permet de décider de ce qui se passe après qu'un utilisateur a soumis ses informations de contact sur votre site. Allez dans l'onglet Paramètres » Confirmations et vous verrez l'option de choisir l'action de confirmation.
Ainsi, vous pouvez afficher un message personnalisé de « merci » sur le frontend après que l'utilisateur a cliqué sur le bouton de soumission. Ou, choisissez les options de redirection pour envoyer les utilisateurs vers une autre page de votre site ou une URL externe.
Une fois que vous avez terminé avec les paramètres du formulaire, assurez-vous de cliquer sur le bouton Enregistrer.
Maintenant que votre formulaire de contact est prêt, vous pouvez l'insérer sur votre site Web en utilisant Divi Builder.
Étape 4 : Ajouter le module WPForms dans Divi
Pour ajouter ce formulaire de contact sur n'importe quelle page ou publication, ouvrez le Divi Builder et choisissez une disposition de ligne comme nous l'avons fait pour le module de formulaire de contact Divi.
La seule différence ici est que vous devrez rechercher le module WPForms.
Après avoir inséré le bloc WPForms, vous verrez les paramètres pour choisir le formulaire de contact que vous venez de créer. Il existe également des options pour afficher le titre et la description de votre formulaire de contact.
Vous pouvez même modifier la conception et le style de votre formulaire de contact avec le Divi Builder. Lorsque vous êtes satisfait de l'apparence de votre formulaire de contact Divi, cliquez sur le bouton de coche à droite.
Étape 5 : Publier votre formulaire de contact Divi
La dernière étape consiste à publier votre formulaire de contact. Pour ce faire, cliquez sur le bouton des 3 points en bas du Divi Builder.
Ensuite, vous verrez différentes options telles que le zoom, l'aperçu réactif, et plus encore. Sur le côté droit, il y a deux boutons : Enregistrer le brouillon et Publier.
Cliquez sur le bouton Publier pour publier votre page et votre formulaire de contact sur votre site WordPress.
Vous avez créé avec succès un formulaire de contact en utilisant Divi et WPForms. Bien que Divi propose un module de formulaire de contact, il manque certaines fonctionnalités comme le téléchargement de fichiers, la gestion des entrées et l’intégration de listes d’e-mails.
Avec WPForms, vous pouvez facilement résoudre ces problèmes. Il est doté de fonctionnalités et de capacités qui vous aident à créer tous types de formulaires de contact, du plus basique au plus professionnel.
WPForms vous permet également de créer des formulaires WordPress pour n'importe quel usage, en fonction de vos besoins. Vous pouvez créer des formulaires de commande, des formulaires d'inscription à des événements, des formulaires d'inscription, et bien plus encore.
Et c'est tout pour aujourd'hui ! Nous espérons que ce tutoriel vous a aidé à apprendre comment créer facilement un formulaire de contact Divi dans WordPress.
Si vous souhaitez plus d'aide avec les formulaires WordPress, vous pouvez consulter ces ressources :
- Comment créer un formulaire d'inscription à un événement dans WordPress
- 8 meilleurs outils de capture d'e-mails et constructeurs de formulaires pour WordPress
- Comment réduire facilement l'abandon de formulaires
Ces articles vous aideront à enregistrer des utilisateurs sur vos formulaires WordPress et à développer vos listes d'e-mails. Le dernier vous aidera à réduire les taux d'abandon de vos formulaires et à améliorer vos conversions.
Commentaires Laisser une réponse