Comment ajouter un formulaire de contact dans WordPress (Tutoriel 2023)

Publié: 2023-08-30

Un formulaire de contact est un excellent moyen de recueillir des informations auprès des visiteurs de votre site WordPress. Que vous souhaitiez capturer des commandes, des réponses à des enquêtes ou des candidatures à un emploi, l'ajout d'un formulaire de contact WordPress est un moyen efficace pour les visiteurs du site Web de vous contacter et d'interagir avec vous et votre marque en ligne.

Table des matières
  • 1 avantages de l'utilisation d'un formulaire de contact WordPress
  • 2 Comment ajouter un formulaire de contact à votre site WordPress (étape par étape)
    • 2.1 Installer WPForms
    • 2.2 Création de votre premier formulaire
    • 2.3 Personnalisation de votre formulaire et de ses champs
    • 2.4 Personnalisation des paramètres de votre formulaire
    • 2.5 Ajouter votre formulaire de contact à une page WordPress
    • 2.6 Styliser votre formulaire
  • 3 Comment tirer le meilleur parti de votre formulaire de contact
  • 4 autres plugins et plates-formes de formulaire de contact
  • 5Conclusion _

Avantages de l'utilisation d'un formulaire de contact WordPress

Il existe de nombreuses plateformes et outils en ligne qui vous permettent de créer des formulaires. De nombreuses plates-formes modernes offrent, entre autres fonctionnalités, une interface, des rapports et des analyses faciles à utiliser. Cependant, en utilisant un formulaire de contact WordPress, vous pouvez disposer de toutes ces fonctionnalités et bien plus encore au sein de votre interface WordPress. Voici quelques autres avantages que vous pouvez bénéficier en utilisant un formulaire de contact WordPress :

  • Génération de leads – Lorsque vous utilisez un formulaire de contact WordPress, vous pouvez profiter de ces entrées pour développer votre audience via votre site Web. Un bon plugin de formulaire aura de nombreuses fonctionnalités intégrées, vous n'aurez donc pas besoin de plugins distincts pour la génération de leads, les entonnoirs de contenu, les inscriptions par courrier électronique, l'intégration CRM, etc. Il est difficile de le faire si les visiteurs vous envoient un e-mail directement depuis votre site Web ou leur plateforme de messagerie.
  • Meilleure sécurité et validation – Avec un formulaire construit nativement sur votre site Web WordPress, vous pouvez garantir la délivrabilité des résultats de votre formulaire et utiliser des services de protection anti-spam tels que Recaptcha, Akismet, etc., protégeant votre adresse e-mail et les données de votre utilisateur.
  • Gérer les entrées et les contacts en un seul endroit – Un formulaire de contact WordPress peut vous permettre d'avoir un emplacement central pour vos entrées de formulaire et de pouvoir les utiliser sur tout votre site. De nombreux plugins de formulaires vous permettent de trier, d'organiser et d'exporter le contenu de formulaires que vous pouvez stocker et de créer facilement des bases de données exhaustives. Ce n'est pas possible lorsque les gens vous envoient directement un e-mail.
  • Créez différents types de formulaires avec des fonctionnalités avancées – Des enquêtes, des sondages, des formulaires de candidature et bien plus encore peuvent tous être créés facilement avec un formulaire de contact WordPress. La limite est votre imagination, et avec les créateurs de formulaires qui autorisent des fonctionnalités telles que des calculs avancés, des champs conditionnels, etc., avoir un formulaire de contact sur votre site Web contribue à faire de votre site une expérience interactive pour vos visiteurs qui les incitera à rester – et à revenir. – sur votre site Web.

Comment ajouter un formulaire de contact à votre site WordPress (étape par étape)

Nous utiliserons le plugin WPForms Contact Form populaire et riche en fonctionnalités pour ajouter un formulaire de contact à notre site Web WordPress. Nous commençons par installer le plugin sur notre site Web.

Installer WPForms

Tout d’abord, connectez-vous à votre tableau de bord WordPress et survolez Plugins . Ensuite, cliquez sur Ajouter nouveau et dans la zone de recherche, saisissez WPForms . Cliquez sur le bouton Installer pour commencer le processus d'installation du plugin.

Installer WPForms

Enfin, cliquez sur le bouton bleu Activer pour terminer l'installation du plugin WPForms.

Activer WPForms

Maintenant que le plugin est installé et activé, vous pouvez voir qu'un nouvel élément de menu a été ajouté à votre menu WordPress.

Créez votre premier formulaire

Créer votre premier formulaire

WPForms vous offre plusieurs endroits pour ajouter un nouveau formulaire une fois que vous accédez au tableau de bord. Nous allons commencer par cliquer sur le bouton orange Ajouter un nouveau en haut du tableau de bord.

Crée un nouveau formulaire à partir du tableau de bord WPForms

Le processus de création de formulaire dans WPForms commence par nommer votre formulaire et choisir l'un des nombreux modèles disponibles. Pour nommer votre formulaire, saisissez un titre dans la zone de texte Titre . Sélectionnez ensuite votre modèle de formulaire . Nous allons créer un formulaire personnalisé pour notre didacticiel, sélectionnons donc le modèle de formulaire vierge .

Nommez le formulaire et choisissez votre modèle

Après avoir choisi le modèle de formulaire vierge, le magnifique générateur glisser-déposer de WPForms vous est présenté. Sur le côté gauche, vous trouverez vos types de champs.

Types de champs WPForms

Même avec la version gratuite, vous disposez de plusieurs types de champs de formulaire qui peuvent vous permettre de créer des formulaires époustouflants. Nous allons créer un formulaire de contact simple et utiliser les champs de texte de nom, d'adresse e-mail, de liste déroulante et de paragraphe pour notre formulaire.

Ajouter des champs de formulaire

Maintenant que nos champs de formulaire sont sélectionnés, examinons certaines des personnalisations que nous pouvons effectuer avec WPForms.

Personnalisation de votre formulaire et de ses champs

Tout d’abord, cliquons sur le champ du formulaire Nom . Ensuite, nous sélectionnerons l'onglet Général dans les options de champ pour ce champ de formulaire. Nous allons maintenant modifier le format de ce champ et sélectionner First Middle Last . Enfin, nous allons basculer le champ Formulaire requis . Cela signifie que nous avons rendu obligatoire le remplissage de ce champ du formulaire.

Modifications générales du champ Nom

Ensuite, cliquons sur l'onglet Avancé . Ajoutons des espaces réservés à nos champs de nom en remplissant le champ d'espace réservé avec le texte de notre choix.

Modifications avancées des champs de formulaire

Pour ajuster notre champ e-mail, cliquez d'abord sur le champ e-mail . Ensuite, cliquez sur l'onglet Général . Pour ce champ, ajoutons une option de confirmation par e-mail (ce qui signifie que les utilisateurs doivent confirmer leur e-mail en le saisissant deux fois). Nous faisons cela en basculant le champ de confirmation par e-mail .

Modifier votre champ email

Pour notre champ déroulant, cliquons sur le champ pour commencer . Ensuite, cliquez sur l'onglet Général . Maintenant, nous ajoutons une étiquette au champ du formulaire afin que nos utilisateurs connaissent le but de cette liste déroulante. Enfin, nous ajouterons nos options à ce champ .

Ajoutez des options et modifiez votre champ déroulant

Enfin, nous passerons à notre dernier champ de formulaire, le champ paragraphe. Cliquez sur le champ du formulaire , puis cliquez sur l'onglet Général . Attribuez au champ une étiquette . Maintenant que nous avons modifié les champs du formulaire de contact, ajustons les paramètres du formulaire en fonction de nos besoins.

Personnalisation des paramètres de votre formulaire

Pour ajuster les paramètres de notre formulaire, cliquez sur l'icône Paramètres sur le côté gauche du générateur de formulaire. Ensuite, cliquez sur l'onglet Général . Cet onglet vous permet de modifier les paramètres généraux du formulaire, tels que son nom, sa description, ses balises, etc. Nous allons continuer et modifier le texte de notre bouton de soumission. Faites défiler jusqu'à la zone de texte Texte du bouton Soumettre . Ensuite, entrez Envoyer un message .

De plus, nous allons modifier le texte de traitement de notre formulaire. Ajoutez le texte de votre choix dans la zone de texte . Dans notre cas, nous l'avons modifié en Envoi de message.

Onglet général des paramètres du formulaire

WPForms a une sécurité intégrée ; cependant, si vous souhaitez utiliser un autre fournisseur, vous utiliserez l'onglet Protection et sécurité contre le spam pour intégrer le fournisseur de spam et de sécurité de votre choix à votre formulaire. Nous allons maintenant utiliser les dispositions natives mises en place par WPForm pour notre formulaire.

Options de spam et de protection avec WPForms

Maintenant, ajoutons quelques notifications à notre formulaire. Cela signifie que nous recevrons un e-mail lorsqu'un visiteur accède à notre site Web et nous envoie un message via notre formulaire. Pour l'activer, cliquez d'abord sur l'onglet Notifications . Ensuite, modifions la ligne Objet de l'e-mail en Message du formulaire de nouveau site Web. Ajustons également le nom de l'expéditeur en un nom que nous reconnaîtrons dans notre boîte de réception e-mail. Avec la version professionnelle de WPForms, plusieurs notifications peuvent être ajoutées à l'avenir.

Ajouter une nouvelle notification de formulaire

Enfin, envoyons aux visiteurs de notre site Web une confirmation que nous avons bien reçu leur saisie dans le formulaire. Pour ce faire, cliquez sur l'option du menu Confirmation . Ensuite, ajustez votre message de confirmation dans la zone de texte . Vous pouvez également rediriger les utilisateurs vers une autre page de votre site Web ou afficher une autre page en plus d'afficher un message à l'écran.

Ajouter un message de confirmation à votre formulaire

Après avoir apporté toutes ces modifications à votre formulaire, cliquez sur le bouton orange Enregistrer dans le coin supérieur droit de l'écran. Une fois notre formulaire créé, ajoutons-le à notre page !

Ajouter votre formulaire de contact à une page WordPress

Pour ajouter votre formulaire à votre page, créez une nouvelle page sur votre site Web ou modifiez une page existante. Créons une nouvelle page pour notre formulaire de contact. Tout d’abord, survolez l’option de menu Pages , puis cliquez sur Ajouter nouveau .

Ajoutez une nouvelle page à votre site WordPress

Une fois que nous sommes dirigés vers l’éditeur de page WordPress par défaut, donnez un titre à votre page . Cliquez ensuite sur l'icône plus noire pour ouvrir la bibliothèque des blocs disponibles . Recherchez WPForms et sélectionnez le bloc WPForms .

Créez votre nouvelle page

Sélectionnez votre formulaire dans la liste déroulante des formulaires disponibles.

Sélectionnez votre formulaire

Une fois votre formulaire sélectionné, nous pouvons commencer à le styliser à partir de l'éditeur de blocs.

Styliser votre formulaire

WPForms facilite grandement le style de votre formulaire de contact. Bien que vous puissiez utiliser CSS, vous pouvez également utiliser les outils simples de l'éditeur de blocs pour modifier et styliser votre formulaire.

Styliser votre formulaire

Dans l'éditeur, vous pouvez modifier la couleur des champs de formulaire, la taille des champs de formulaire et bien plus encore en quelques clics simples. Voici à quoi ressemblait notre formulaire avant d'ajouter nos modifications de style :

Former avant de coiffer

Après le style, voici à quoi ressemble notre formulaire. Notez que le bouton Soumettre a changé de couleur et que des modifications ont été apportées à la bordure des champs du formulaire. N'oubliez pas que nous pouvons également attribuer des classes CSS à chaque aspect de notre formulaire et utiliser CSS pour personnaliser davantage notre formulaire.

Après le style du formulaire

Avec notre formulaire personnalisé et nos champs en place, nous avons réussi à créer notre premier formulaire WordPress ! Voici quelques trucs et astuces dont vous devez vous souvenir lors de la création de votre formulaire de contact.

Comment tirer le meilleur parti de votre formulaire de contact

Les formulaires de contact vous permettent d'ajouter une connexion dynamique avec les visiteurs de votre site. Cependant, vous devez retenir quelques conseils lorsque vous envisagez de créer votre site.

Sortez des sentiers battus

Bien que nous ayons créé un formulaire simple dans ce didacticiel, WPForms et d'autres plugins de formulaires de contact proposent des centaines de modèles que vous pouvez utiliser pour créer un large éventail de formulaires. Les formulaires ne sont pas seulement utilisés pour collecter des informations de contact, mais peuvent être essentiels au succès de votre entreprise. Vous pouvez créer des enquêtes, répondre à des sondages et générer des devis pour les clients avec de nombreux créateurs de formulaires WordPress. Utiliser un formulaire de contact pour collecter les demandes de personnalisation de produits est même possible. N'ayez pas non plus peur de faire preuve de créativité dans la manière dont vous utilisez les formulaires sur votre site Web.

Gardez votre formulaire en sécurité

Les spammeurs utiliseront tous les moyens pour accomplir leurs tâches ; une méthode consiste à utiliser les formulaires de contact en ligne. Cependant, une fonctionnalité de sécurité comme Akismet ou Recaptcha peut vous aider à sécuriser le contenu de votre formulaire et votre adresse e-mail. N'oubliez pas de garantir la sécurité de votre formulaire lorsque vous ajoutez des formulaires à votre site Web.

La puissance des intégrations

Les intégrations sont l’endroit où brille l’utilisation d’un formulaire de contact WordPress natif. Vous pouvez créer des formulaires d'abonnement par e-mail personnalisés qui remplissent automatiquement votre solution de marketing par e-mail (comme Mailchimp). Votre formulaire peut être connecté à votre CRM, vous permettant de nourrir efficacement les prospects. Les formulaires de contact WordPress inspirent confiance à vos clients car ils ressemblent à votre site Web. Votre formulaire devient une centrale électrique qui alimente différents aspects de votre entreprise tout en gardant vos processus transparents et rationalisés.

Personnalisez vos notifications de formulaire et vos e-mails

N'oubliez pas de personnaliser vos notifications et e-mails si vous envoyez des notifications à vous-même ou à vos visiteurs. L'ajout des couleurs de votre marque, la modification du texte passe-partout, etc., donnent aux visiteurs de votre site Web un sentiment de confiance en votre marque. De plus, si vous redirigez les personnes vers différentes pages après l'envoi du formulaire, assurez-vous que ces pages fournissent à vos clients toutes les informations dont ils ont besoin pour passer aux prochaines étapes avec votre site Web.

Pensez à l'expérience utilisateur

La création d'un formulaire optimisé pour la conversion garantit que vos visiteurs remplissent et soumettent votre formulaire avec succès. La création de formulaires simples et faciles à comprendre aide les visiteurs à soumettre leur formulaire avec succès. Pensez à ajouter des info-bulles, des descriptions, des instructions et des espaces réservés qui informent vos clients sur les différents champs et sections de votre formulaire, leur offrant ainsi un processus transparent et fluide pour remplir votre formulaire.

Pensez à l’accessibilité

Même si on n’en parle pas souvent, l’accessibilité se rapproche de l’avant-garde de la conception Web. Réfléchissez à la manière dont les autres utilisateurs peuvent interagir avec vos formulaires par d'autres moyens. S'assurer que les étiquettes, ARIA, séquences d'onglets, etc. sont en place aide ceux qui peuvent utiliser Internet différemment également à utiliser votre site Web et, en fin de compte, à découvrir l'élément interactif de votre site Web de la manière qui répond le mieux à leurs besoins.

Plus de plugins et de plateformes de formulaire de contact

Voici quelques plugins et plateformes de formulaire de contact alternatifs à tester.

  • Formidable Forms : un générateur de formulaires populaire doté d'une interface glisser-déposer claire, de plus de 15 modules complémentaires premium, qui crée des calculatrices avancées, et bien plus encore.
  • Gravity Forms : un autre plugin de formulaire WordPress doté d'une bibliothèque de plus de 30 types de champs de formulaire, d'intégrations de processeurs de paiement et de modèles de formulaires complexes tels que des quiz, des enquêtes, etc.
  • Ninja Forms : intégré à des plates-formes telles que AWeber et CampaignMonitor, ce plugin de formulaire propose plus de 40 modules complémentaires premium, ce qui en fait un excellent générateur de formulaires pour ceux qui apprécient l'intégration.
  • Contact Form 7 : un plugin de formulaire WordPress puissant et gratuit avec une multitude d'intégrations de Mailchimp à Stripe
  • Divi : le thème WordPress le plus puissant dispose d'un excellent module de formulaire de contact qui facilite la création de formulaires de marque adaptés aux mobiles sur votre site Web.
  • Google Forms : un autre générateur de formulaires gratuit, Google Forms est fourni avec chaque compte Google et est un puissant générateur avec d'excellentes analyses, permet des formulaires de plusieurs pages, et plus encore.
  • Typeform : Ce générateur de formulaires est devenu populaire au fil des ans en raison de sa superbe conception d'interface utilisateur, de ses animations de formulaires et de ses intégrations. Il offre aux utilisateurs un moyen unique d'interagir avec le formulaire de manière conversationnelle.
  • JotForm : l'un des premiers créateurs de formulaires en ligne, JotForm a subi de nombreux changements et reste l'une des plateformes de création de formulaires en ligne gratuites les plus populaires.

Conclusion

Un formulaire de contact est un outil puissant dont tout site Web devrait disposer. C'est non seulement un moyen pour vos clients de vous contacter, mais c'est aussi un moyen d'ajouter un élément interactif à votre site Web. Avec un plugin comme WPForms, fourni avec un générateur par glisser-déposer, créer des formulaires esthétiques et hautement fonctionnels est simple. Les intégrations, les notifications et la sécurité sont des fonctionnalités qui font de la création d'un formulaire de contact WordPress natif un pilier du processus de création de sites Web. Pour approfondir vos recherches, consultez notre liste des meilleurs plugins de formulaire de contact que vous pouvez ajouter à votre site Web suivant. Comment ajouter des formulaires de contact à votre site Web ? Y a-t-il un plugin que vous aimez et sur lequel vous souhaiteriez que nous en apprenions plus ? Faites-le-nous savoir dans la section commentaires ci-dessous !

Image en vedette via Viktoria Kurpas / Shutterstock.com