Chaque site Web doit inclure un formulaire de contact! Les formulaires de contact sont utiles à diverses fins, quel que soit le type de site Web que vous avez. Ils peuvent générer des prospects, établir des connexions et des relations, permettre aux utilisateurs de signaler des problèmes avec votre site, et tout le reste.
Il n'est pas nécessaire d'être un expert technique pour créer des formulaires de contact dans WordPress. Le constructeur de pages Elementor facilite plus que jamais la création de beaux sites Web.
Pour montrer comment créer des formulaires de contact avec Elementor, nous passerons en revue les différentes options et tout ce qu'il y a à savoir sur les formulaires de contact dans Elementor.
Elementor a inclus un widget de formulaire depuis un certain temps maintenant, ce qui signifie que vous n'avez plus besoin d'aller ailleurs pour créer des formulaires pour votre site WordPress, ce qui est une bénédiction !
Dans le passé, vous avez peut-être rencontré des difficultés lors de la création de formulaires avec certains des plugin disponibles. Le processus de conception et de configuration des formulaires peut être long et frustrant. Heureusement pour nous tous, le widget Elementor Form est simple à utiliser.
- Quelle est la meilleure façon de créer un formulaire dans Elementor ?
- Comment créer un formulaire Elementor
- Former des éléments Elementor de manière structurée
- Types de champs dans un formulaire
- Types de champs dans un formulaire Elementor
- Largeur d'une colonne de formulaire
- Formulaires dans Elementor pour le style
- Actions sur un formulaire
- Création d'un modèle de messagerie de formulaire de contact dans Elementor
- Conclusion
Avant de commencer avec le générateur de formulaire Elementor, jetons un coup d'œil à certaines de ses fonctionnalités les plus essentielles.
L'une des caractéristiques les plus distinctives, pour commencer, est qu'il est entièrement intégré à l'interface Elementor, ce qui signifie que vous avez accès à de nombreuses options de conception/style/disposition disponibles dans Elementor. Je ne crois pas que vous trouverez un plugin formulaire autonome avec un système de conception aussi robuste que celui-ci.
À partir de là, vous pouvez créer jusqu'à 18 types de champs différents :
- Texte E-mail Zone de texte Zone de texte
- L'URL et le numéro de téléphone sont les suivants :
- Les boutons radio sont un type de bouton radio.
- Choisissez dans une liste (liste déroulante)
- Les cases à cocher sont utilisées dans les listes de contrôle.
- Il n'y a qu'une seule case à cocher (acceptation)
- reCAPTCHA
- Les pots de miel sont un type de conteneur qui contient du miel (empêche le spam)
Vous pouvez également diviser vos formulaires en plusieurs pages pour créer des formulaires en plusieurs étapes, ce qui est avantageux pour les applications longues.
Elementor Pro propose plus de 12 intégrations avec des services de marketing par e-mail et des systèmes de gestion de la relation client populaires pour vous aider à tirer le meilleur parti de vos formulaires. Il existe également une intégration fourre-tout Zapier qui vous permet de vous connecter à l'un des milliers d'outils disponibles sur la plate-forme Zapier si votre outil n'est pas répertorié.
Il existe également quelques autres alternatives intéressantes. Ex amp le, quand quelqu'un remplit votre formulaire, vous pouvez recevoir des notifications via Slack ou Discorde.
En parlant de notifications, vous pouvez également personnaliser les notifications par e-mail que vous recevez et les notifications par e-mail que les expéditeurs de formulaire reçoivent. Après avoir soumis le formulaire, vous pouvez les rediriger vers une page de remerciement personnalisée que vous créez.
Quelle est la meilleure façon de créer un formulaire dans Elementor ?
Nous commencerons par ouvrir l'éditeur Elementor, puis par glisser-déposer le widget Formulaire à l'emplacement où nous voulons créer notre formulaire.
Comment créer un formulaire Elementor
Comme tout le reste dans Elementor, le processus de création de formulaires est réalisé visuellement. Il n'est pas nécessaire d'utiliser un plugin supplémentaire, ni essentiel d'agir en tant que backend de votre site Web.
Former des éléments Elementor de manière structurée
Une fois votre formulaire en place, la première étape consiste à organiser les informations qu'il contient. De quels champs avez-vous besoin et quels types de champs devraient-ils être ? Qu'est-ce que tu cherches?
Lorsque vous travaillez dans l'éditeur Elementor, les champs de formulaire sont ajoutés et modifiés à partir de l'onglet Contenu. Comme vous pouvez le voir dans l'ex amp le ci - dessous, les formulaires comprennent quelques champs par défaut. En sélectionnant Ajouter un élément dans le menu déroulant, vous pouvez créer de nouveaux champs.
Dupliquer un Champ est également possible en sélectionnant l'icône qui ressemble à deux documents, l'un devant l'autre, et en cliquant dessus.
Types de champs dans un formulaire
De nombreux types de champs de formulaire sont disponibles, allant des champs de texte simples aux mots de passe, ReCaptcha et champs de miel.
Pour modifier le comportement d'un champ de formulaire, sélectionnez d'abord le champ, puis aimez le menu déroulant Type pour voir les différents types de champs disponibles.
Types de champs dans un formulaire Elementor
Largeur d'une colonne de formulaire
Cette fonctionnalité vous permet d'utiliser deux champs de formulaire sur la même ligne en ajustant le paramètre Largeur de colonne. Modifiez la largeur de la fenêtre en la sélectionnant dans le sélecteur déroulant et en sélectionnant 50 pour cent. Il est à noter que si vous faites cela avec deux champs de formulaire consécutifs, vous remarquerez qu'ils apparaissent ensemble sur la même ligne.
Formulaires dans Elementor pour le style
Stylisez vos formulaires dans Elementor de la même manière que vous stylisez d'autres widgets en accédant au panneau Style situé dans l'interface d'édition d'Elementor.
Le formulaire lui-même, les champs, les boutons, les étapes, les messages d'erreur et les messages de confirmation peuvent tous être personnalisés.
Pour ceux qui connaissent déjà Elementor, il n'y a pas grand-chose de plus à apprendre pour styliser les formulaires Elementor.
Actions sur un formulaire
Suite à notre discussion sur la création d'un formulaire dans Elementor, voyons comment configurer ce qui se passe après la soumission de votre formulaire ; ceci est accompli via des actions de formulaire, ou comme elles sont appelées dans Elementor, Actions après la soumission.
Lorsqu'un formulaire est soumis, il est courant que le système envoie un e-mail et redirige l'utilisateur vers une autre page Web. Vous pouvez bien sûr inclure autant d'actions que vous le souhaitez sur vos formulaires et les combiner comme vous le souhaitez. Comme vous pouvez vous y attendre, il existe un champ de sélection spécifique sans codage impliqué.
Chacune des actions que vous ajoutez apparaîtra comme une option d'onglet distincte dans le menu principal. Nous avons actuellement une option de tabulation pour E - mail, mais si je devais inclure une redirection dans la Ajouter action sur le terrain, je verrions aussi Redirect dans mes options de l' onglet, comme le montre l'ex amp le ci - dessous.
Pour conclure, je vais montrer comment configurer le formulaire pour accepter les soumissions par e-mail, la question la plus fréquemment posée sur les formulaires.
Lorsque vous sélectionnez E-mail dans l'onglet Contenu de l'éditeur, l'écran ci-dessous s'affiche ; c'est là que vous pouvez personnaliser l'e-mail de départ et l'e-mail de réponse, et vous pouvez également ajouter un CC ou un BCC à toute personne qui devrait recevoir une copie des soumissions du formulaire.
Création d'un modèle de messagerie de formulaire de contact dans Elementor
Beaucoup de gens sont surpris d'apprendre que l'éditeur de formulaires d'Elementor est plus puissant qu'il n'y paraît à première vue, et l'une des fonctionnalités les plus avancées est la possibilité de personnaliser la messagerie pour chaque formulaire.
Il est possible de personnaliser les messages du formulaire afin de fournir un processus de rétroaction plus personnalisé à l'utilisateur final qui a rempli votre formulaire, plutôt que de ressembler à un robot ennuyeux. Mais, plus précisément, quels messages pouvez-vous personnaliser pour votre formulaire de contact Elementor sont les suivants :
Pour commencer, vous devez d'abord activer la messagerie personnalisée en sélectionnant "Options supplémentaires" dans le menu déroulant, puis en basculant le commutateur à bascule pour "Messagerie personnalisée" sur "Oui".
Personnalisation du widget du formulaire de contact Elementor en ajoutant des messages personnalisés
Comme vous pouvez le constater, vous pouvez personnaliser quatre messages différents, dont ceux répertoriés ci-dessous :
Un message de réussite s'affiche pour un utilisateur final après avoir soumis le formulaire et vérifié que le formulaire a été correctement rempli (par exemple, aucun champ obligatoire manquant, etc.).
Message d'erreur — un message qui s'affiche à l'utilisateur final lorsqu'une erreur inconnue se produit lors de la soumission du formulaire.
Message requis — apparaît lorsqu'un champ de formulaire requis n'est pas rempli, que le formulaire est soumis et que le formulaire n'est pas rempli.
Lorsque quelque chose dans la soumission du formulaire est incorrect et ne peut pas être envoyé, le message Message invalide s'affiche pour l'utilisateur final.
La possibilité de modifier les messages vous permet d'être créatif et original, ou plus formel et professionnel si vous gérez un site d'entreprise. La meilleure partie est qu'ils sont entièrement modifiables, vous pouvez donc faire ce que vous voulez !
Conclusion
Widget de formulaire Elementor, il est facile de créer un formulaire de contact. Il est livré avec un générateur de formulaire de contact intuitif par glisser-déposer et une pléthore d'options de personnalisation qui le distinguent des autres plugin formulaire de contact disponibles sur le marché. Vous pouvez facilement personnaliser son style et sa palette de couleurs pour qu'ils correspondent à l'apparence de votre entreprise. Sont également inclus divers autres widgets attrayants, plus de 300 modèles professionnels et un générateur de fenêtres contextuelles dans un package pratique. Ce constructeur de pages WordPress complet comprend tous les widgets et fonctionnalités nécessaires, vous n'aurez donc pas à acheter des constructeurs de pages supplémentaires pour personnaliser davantage votre site Web. De plus, il permet l'intégration de plus de 30 services marketing, c'est pourquoi il est l'un des plugin les plus achetés sur le marché aujourd'hui.
