Guide du formulaire de contact Ultimate Elementor

Chaque propriétaire de site Web souhaite établir de bonnes relations à long terme avec ses clients et prospects. C'est là qu'intervient le formulaire de contact. L'ajout de formulaires de contact à votre site est fortement recommandé car il aide vos prospects à vous contacter et vous aide à collecter des données sur les visiteurs de votre site.

Sans aucun doute, les utilisateurs de WordPress ont accès à des tonnes de plugins de formulaires de contact et à de nombreuses fonctionnalités. Cela rend la création de formulaires facile et transparente pour les utilisateurs. Et si vous pouviez également créer des formulaires à l'aide du widget Formulaire de contact Elementor ?

Comment créer des formulaires de contact avec Elementor

Le widget Elementor Contact Form vous permet de personnaliser et d'ajouter n'importe quel type de formulaire de contact à votre site en quelques minutes. Il est livré avec toutes les fonctionnalités et tous les champs nécessaires pour permettre une interaction transparente avec votre site. Il convient de noter que les formulaires de contact sont une fonctionnalité de la version Pro d'Elementor.

Cela signifie que vous devez passer à Elementor Pro pour créer des formulaires. Maintenant que nous avons établi ce fait, examinons les étapes simples pour créer votre formulaire de contact à l'aide d'Elementor.

Guide étape par étape pour utiliser Elementor pour créer un formulaire de contact

Vous pouvez ajouter des formulaires de contact à votre site de deux manières. Il existe la méthode payante, qui nécessite l'installation des widgets Elementor et Elementor Pro. Il existe également la méthode gratuite, qui nécessite l'installation d'un plugin tiers. Nous nous concentrerons sur Elementor Pro dans ce guide.

Première étape: Trouvez le widget de formulaire de contact Elementor parmi la pléthore de widgets disponibles sur votre page Elementor. Cliquez pour ouvrir la page sur laquelle vous souhaitez inclure le formulaire de contact.

Avec l'option glisser-déposer, vous pouvez facilement ajouter des widgets sur une page dans Elementor, mais cet article examine le processus complet de création d'un formulaire de contact avec le widget de formulaire de contact dans Elementor Pro.

Deuxième étape: Le formulaire de contact Elementor est livré avec des champs pré-remplis pour les zones de base, telles que le nom, l'e-mail et le message. L'étape suivante consiste à personnaliser le formulaire par défaut pour l'adapter à ce que vous voulez. Pour ce faire, accédez à la section Contenu dans les paramètres du formulaire et ajoutez « Champ de formulaire.

Pour le nom du formulaire, donnez-lui un titre. Ensuite, cliquez sur les champs de formulaire. Ici, vous pouvez ajouter autant de champs que vous le souhaitez. Vous pouvez dupliquer et supprimer au fur et à mesure que vous créez les champs.

Vous trouverez un tas d'options de champ que vous pouvez utiliser, y compris Texte, Email, URL, Case à cocher, Textarea, Tel, Select, Radio, Acceptance, Number, HTML, Hidden, Password, Honeypot, reCAPTCHA et reCAPTCHA V3, entre autres .

Vous pouvez jouer avec les fonctionnalités pour voir ce qui fonctionne et ce que vous pouvez ajouter à votre formulaire de contact. L'onglet Avancé vous permet d'explorer plus d'options pour personnaliser votre formulaire. Découvrez-le également pour voir si vous aimerez les fonctionnalités qui y sont inhérentes.

Troisième étape : personnalisez et concevez votre bouton de soumission en fonction de ce que vous voulez. Il comporte différents champs que vous pouvez ajuster et personnaliser selon vos besoins, notamment la taille, la largeur de colonne, le texte du bouton, l'ID du bouton, l'icône et l'alignement. Explorez ces fonctionnalités pour ajouter du style et du style à votre formulaire de contact.

Quatrième étape : configurer le menu « Actions après soumission » Habituellement, lorsqu'un utilisateur soumet un formulaire sur votre site, vous souhaitez que les visiteurs de votre site aient une forme de rétroaction ou de réponse pour montrer que le formulaire a été soumis. Ce n'est pas automatique. Vous devez configurer la section "Actions après soumission" pour obtenir ce dont vous avez besoin.

Cliquez sur la section "Actions après soumission" de votre formulaire et cliquez sur le champ "Ajouter une action". Vous verrez différentes options, telles que Email Webhook, Discord, Popup, ActiveCampaign, GetResponse et Slack, entre autres. Sélectionnez l'une des options pour ajouter des actions après la soumission.

Par exemple, si vous choisissez l'action E-mail, le formulaire de contact ajoutera un onglet pour E-mail. Vous pouvez configurer un e-mail à envoyer à un utilisateur qui vous a envoyé un e-mail via votre formulaire de contact. Remplissez les options et définissez les conditions pour personnaliser l'action du formulaire.

Il convient de noter qu'Elementor propose de nombreuses options d'actions que vous pouvez explorer. Là encore, vous pouvez envisager d'autres services tiers pour le rendre plus transparent. Certains des services tiers que vous pouvez explorer incluent Hubspot, Mailchimp, Drip, Convertkit et Slack, entre autres. Toutes ces intégrations sont intégrées à Elementor, ce qui les rend faciles d'accès et d'utilisation.

Cinquième étape : cette étape vous permet de personnaliser votre message aux utilisateurs lorsqu'il se passe quelque chose lorsqu'ils remplissent un formulaire. Par exemple, lorsqu'ils soumettent un formulaire avec succès ou qu'il y a une erreur, ils doivent recevoir un message.

Pour configurer cela, cliquez sur "Options supplémentaires" et choisissez Oui ou Non pour "Messages personnalisés". Modifiez les quatre messages par défaut en fonction de ce que vous souhaitez que vos utilisateurs voient. Ces messages sont Message de réussite, Message d'erreur, Message requis et Message non valide.

Sixième étape: stylisez et personnalisez votre formulaire de contact Elementor pour le rendre unique et non ennuyeux. Elementor propose des options de style personnalisées que vous pouvez utiliser. Pour ce faire, cliquez sur l'onglet "Style" et passez en revue les options et les paramètres disponibles. Vous pouvez utiliser n'importe lequel d'entre eux pour modifier le style complet du formulaire de contact.

Étape 7 : Vous avez configuré avec succès votre formulaire de contact Elementor et la prochaine et dernière étape consiste à le publier. Pour cela, cliquez sur le bouton « Mettre à jour » situé en bas du formulaire.

Cela publiera votre formulaire et rendra la page en ligne et accessible aux visiteurs de votre site. Vous pouvez commencer à collecter des données et des prospects auprès des abonnés de votre site Web.

Conclusion

Le type de formulaire de contact que vous souhaitez concevoir déterminera les fonctionnalités que vous utiliserez dans Elementor. Cependant, cet article a fourni les bases de la création d'un formulaire à l'aide de cet outil. Comme mentionné, vous ne pouvez accéder à la fonction Formulaire de contact que dans la version Pro d'Elementor. Il en coûte environ 49 $ pour acheter une version pro de l'outil. Les fonctionnalités disponibles valent chaque centime que vous payez pour cela.