Comment créer un formulaire de contact avec WPForms

Comment créer un formulaire de contact avec WPForms

Si vous avez un site web, vous souhaitez probablement offrir à vos visiteurs la possibilité de vous contacter directement depuis votre site. Vous pouvez le faire facilement en ajoutant un formulaire de contact pour que les visiteurs, les clients ou même les partenaires potentiels puissent vous contacter lorsqu’ils ont besoin d’aide ou qu’ils ont quelque chose à partager avec vous.

En seulement quatre étapes simples, je vais vous montrer comment créer un formulaire de contact comme celui ci-dessous, où n’importe qui peut remplir son nom, son e-mail et son message, puis chaque fois qu’il clique sur Envoyer, vous recevrez une notification instantanée dans votre boîte de réception.

Comment créer un formulaire de contact WordPress avec WPForms / Vidéo

Si vous préférez regarder une vidéo plutôt que de lire cet article sur la façon d’accélérer WordPress, vous pouvez regarder cet article complet sous forme de vidéo :

Vous aimez regarder plus de vidéos comme celle-ci ?
Consultez notre Chaîne YouTube.

Quatre bonnes raisons de créer un formulaire de contact

Pour augmenter votre motivation à créer un bon formulaire de contact, je voudrais vous montrer quatre raisons pour lesquelles vous devriez avoir un formulaire de contact sur votre site web pour vos visiteurs.

1. Cela a l’air professionnel :
Avoir un formulaire de contact propre et clair rend votre site web plus professionnel. Une adresse e-mail affichée n’a pas tout à fait le même effet. Le formulaire de contact montre que vous êtes organisé et que vous avez investi du temps dans votre site web.

2. Cela réduit le spam :
Publier une adresse e-mail sur Internet, c’est inviter le spam. Cacher votre adresse e-mail en utilisant un formulaire de contact rend plus difficile pour les spammeurs de vous trouver.

3. C’est plus facile pour l’utilisateur et le maintient sur votre site web :
Un formulaire de contact permet aux visiteurs de rester sur votre site. Publier seulement une adresse e-mail oblige le visiteur à ouvrir son client de messagerie, à copier et coller votre adresse e-mail, puis à écrire le message là-bas.

4. Cela vous apporte plus de leads :
Lorsque vous gérez une entreprise, vous voulez obtenir plus de leads. Les leads sont une raison majeure pour laquelle vous avez besoin d’un formulaire de contact. En plus de l’effort accru de la rédaction manuelle d’un e-mail, comme mentionné ci-dessus, il y a aussi le fait que si les visiteurs utilisent un ordinateur public ou partagé, ils peuvent ne pas pouvoir créer un e-mail. Les formulaires de contact et leur apparence professionnelle peuvent vous aider à obtenir plus de leads. Ils sont plus confortables et plus rapides ; votre visiteur peut les utiliser depuis n’importe quel appareil.

Obtenez plus de leads en utilisant un formulaire de contact
Get more leads by using a contact form.

Installer WPForms

Nous allons utiliser un plug-in nommé « Contact Form by WPForms ». Il est très simple à configurer. Pour ce faire, allez dans l’onglet du menu « Plugins » du tableau de bord WordPress et cliquez sur « Ajouter ».

Ajouter un nouveau plugin

Entrez « WP Forms » dans la zone de recherche. Le premier est « Contact Form by WPForms – Drag & Drop Form Builder for WordPress ». Cliquez sur « Installation », attendez quelques secondes et activez directement le plug-in en cliquant sur « Activer ».

Installer le plugin WPForms

Créer le premier formulaire de contact

Ajuster le formulaire de contact

Une fois activé, vous verrez le tableau de bord où il est écrit « Bienvenue sur WP Forms ». L’étape suivante consiste à créer un nouveau formulaire ; vous pouvez aller en bas vers « Créer votre premier formulaire », vous pouvez également passer au menu à gauche chaque fois que vous avez besoin de créer un nouveau formulaire de contact ; allez sur WP Forms et cliquez sur « Ajouter ».

Tout d’abord, donnez-lui un nom. Ensuite, vous pouvez sélectionner un modèle, mais vous pouvez également commencer à partir d’un formulaire vierge, ce qui signifie qu’il n’y a pas de champs.

Choisissez le formulaire de contact simple
Choose the simple contact form.

Nous allons faire le « Formulaire de contact simple ». Les principaux champs dont vous pourriez avoir besoin pour un formulaire de contact simple sont déjà ici.

Vous pouvez cliquer sur n’importe lequel de ces champs pour apporter des modifications. Après cela, vous voyez que vous pouvez rendre tous ces champs obligatoires en cliquant sur « Obligatoire ». Vous pouvez même changer ce qui est écrit dans les champs en cliquant sur « Étiquette » puis en le modifiant.

Vous pouvez modifier les champs en cliquant dessus
You can edit the fields by clicking on them.

Si vous avez un autre champ que vous voulez ajouter, allez dans « Ajouter des champs », et vous pouvez cliquer dessus, puis cela se déroulera. Vous pouvez ensuite cliquer avec le bouton gauche et le faire glisser où vous voulez.

Vous pouvez ajouter de nouveaux champs via « Ajouter des champs »
You can add new fields via « Add Fields. »

Enfin, vous pouvez modifier un peu le bouton d’envoi en cliquant dessus, et vous arriverez à cette zone où nous pouvons modifier le texte du bouton. Je vais continuer et cliquer sur « Enregistrer ».

Ajuster les notifications

En cliquant sur le champ « Envoyer », nous avons atterri dans la zone « Général » du menu « Paramètres ». Nous pouvons aller dans « Notifications » car la prochaine chose que nous voulons faire est de configurer les notifications. Cela signifie où va l’e-mail et ce que contient l’e-mail. Par défaut, la notification est envoyée à l’e-mail de l’admin, ce qui signifie l’e-mail que vous avez utilisé pour vous inscrire à WordPress.

Editing the « Send to Email Address »

Vous pouvez supprimer cela et ajouter votre e-mail préféré ici, et cela peut être n’importe quel e-mail, qu’il s’agisse de votre adresse Gmail ou Yahoo. Si vous voulez l’envoyer à plusieurs e-mails parce que plus d’un membre de l’équipe doit être notifié, vous pouvez également le faire. Mettez simplement une virgule et ajoutez ensuite les autres adresses e-mail.

Nous avons configuré les notifications ; cliquez sur « Enregistrer ».

Ajuster le message de confirmation

La troisième et dernière partie de la configuration est la configuration du « Message de confirmation ».

Le message de confirmation est ce que votre visiteur voit lorsqu’il vous envoie le formulaire de contact. Par défaut, il est écrit : « Merci de nous avoir contactés ! Nous vous répondrons sous peu. »

Vous pouvez modifier cela pour gérer leurs attentes ; si vous savez qu’il vous faut, à vous ou à votre support, 48 heures pour répondre, vous pouvez le mentionner. Ou vous pourriez ajouter votre nom pour personnaliser le message. Par exemple, « Lennard Équipe WP STAGING ».

WPForms confirmation message

Vous pouvez afficher le message, montrer une page spécifique sur votre site web ou rediriger le visiteur vers une autre URL.

Mais je vais simplement laisser le type de confirmation comme « message ». Cliquez sur « enregistrer » puis cliquez sur le « X ». Vous pouvez voir le formulaire de contact nouvellement créé.

Ajouter le formulaire de contact à votre site web

Tout d’abord, nous devons créer une page de contact, alors allons en haut vers « pages » dans la barre latérale WordPress puis allons à « ajouter ». Maintenant, je vais simplement nommer cela « Contact ».

Pour ajouter le formulaire de contact, allez en haut vers le petit bouton plus, puis si nous descendons aux widgets et ouvrons cela, vous verrez « WP Forms ». Cliquez dessus, et nous pouvons ensuite sélectionner le formulaire dans la liste déroulante.

Ajouter des widgets WP Forms
Adding the contact form

Maintenant, cliquez sur Publier, puis cliquez à nouveau sur Publier. Le formulaire de contact a été ajouté avec succès.

Envoyer un e-mail de test

Ouvrez la page « Contact » avec le nouveau formulaire de contact. Envoyez un e-mail de test, entrez vos détails dans le formulaire de contact et cliquez sur « envoyer ».

Le formulaire de contact rempli
The populated contact form

Maintenant, nous devons vérifier nos boîtes de réception. Si vous êtes comme moi, l’e-mail n’est pas apparu dans votre boîte de réception. Ce qui se passe, c’est que l’e-mail se retrouve dans votre dossier spam, nous devons donc nous assurer de le marquer comme non spam.

Boîte de réception vide
Empty email inbox

Pour ce faire, allons dans le dossier spam. Cliquez sur spam, et maintenant vous verrez l’e-mail ici. Cliquez sur l’e-mail et sur « signaler, pas spam ». Maintenant, il est dit que la conversation a été démarquée du spam et déplacée vers la boîte de réception. Retournons à notre boîte de réception, et maintenant l’e-mail apparaît ; tout e-mail qui arrive par ce formulaire de contact ne sera plus marqué comme spam.

Signaler l'e-mail comme « pas un spam »
Report the email as « not spam. »

Si vous voulez répondre à cet e-mail, cliquez sur l’e-mail, puis vous pouvez écrire une réponse.

Bonus : Utiliser un serveur SMTP

Si votre e-mail de test n’a pas réussi et que vous ne pouvez pas le trouver dans votre boîte de réception ou votre dossier spam, je vais vous montrer dans cette partie bonus comment activer l’envoi d’e-mails dans WordPress en utilisant un serveur SMTP.

Que signifie SMTP ?

SMTP, ou Simple Mail Transfer Protocol, est la norme de l’industrie pour l’envoi d’e-mails, et comme il utilise une authentification appropriée, il augmente la délivrabilité de vos e-mails. L’utilisation d’un serveur SMTP empêche vos e-mails d’aller dans le spam.

Installer un plugin SMTP

Pour mettre les choses en place sur votre site web, nous allons installer un plugin appelé « WP Mail SMTP by WPForms », comme son nom l’indique ; il provient du même développeur que les plugins de formulaire de contact « WP Forms » que nous utilisons.

Allez dans « Plugins » et « Ajouter » dans la barre latérale WordPress. Dans la zone de recherche, tapez « SMTP ». Une fois que vous l’avez installé, vous devrez également vous assurer de l’activer. Une fois activé, vous pouvez aller dans « WP MAIL SMTP » dans votre menu de la barre latérale.

Le plugin « WP Mail SMTP by WPForms »
The plugin « WP Mail SMTP by WPForms.”

Configurer le plugin SMTP

Entrez l’« E-mail de l’expéditeur ». Votre adresse e-mail wp-admin, que vous avez attribuée lors de la configuration de WordPress, est affichée ici par défaut.
C’est l’adresse e-mail que WordPress utilise pour envoyer des e-mails.

Modifier l'« E-mail de l'expéditeur »
Change the « From Email »

Assurez-vous d’entrer l’adresse e-mail que vous utiliserez pour envoyer des e-mails SMTP, qui serait par exemple l’adresse e-mail associée à votre compte Yahoo ou Gmail.

Ensuite, entrez le champ « Nom de l’expéditeur ». Ce champ sera affiché à vos visiteurs comme l’expéditeur lorsque l’e-mail est reçu. J’aime utiliser « Lennard @ WP STAGING » pour lui donner une touche personnelle.

Modifier le « Nom de l'expéditeur »
Change the « From Name »

Vous pouvez sélectionner « Forcer » pour l’adresse e-mail et le nom. Cette case appliquera le paramètre à l’ensemble du site WordPress, y compris les autres plugins.

Activez la case « Return-Path », et vous serez informé s’il y a des problèmes avec l’e-mail du destinataire.

La sélection du « mailer » est la décision la plus importante sur cette page. Vous pouvez configurer le serveur SMTP à partir de l’un des services de messagerie recommandés, ou vous pouvez utiliser votre fournisseur de messagerie standard.

Choisissez votre « mailer »
Choose your « mailer. »

Pour configurer SMTP en utilisant votre fournisseur de messagerie standard, cliquez sur la case « Other SMTP ». Vous obtenez toutes les données requises auprès de votre hébergeur ou service de messagerie. Sinon, vous pouvez cliquer sur « Documentation SMTP ». Il vous montrera plus de détails sur les fournisseurs les plus populaires.

Détails SMTP des fournisseurs les plus populaires
SMTP details of the most popular providers

Entrez « smtp.example.com » comme hôte SMTP. Sélectionnez la méthode de chiffrement de votre fournisseur et vérifiez le port. Pour une connexion chiffrée SSL, utilisez 465.

Hôte SMTP et chiffrement
SMTP host

Maintenant, ajoutez votre nom d’utilisateur et mot de passe SMTP. Pour la plupart des fournisseurs, le nom d’utilisateur SMTP est votre adresse e-mail, et le mot de passe SMTP est celui que vous avez utilisé pour enregistrer l’e-mail.

Nom d'utilisateur et mot de passe SMTP
SMTP username and SMTP password

Maintenant cliquez sur « Enregistrer les paramètres » et allez dans l’onglet « Test d’e-mail » pour vérifier si toutes les entrées étaient correctes et qu’aucun problème ne s’est produit.

E-mail de test WPMail
WPMail test email

Tout est configuré ! Félicitations ! Testez votre formulaire de contact WPForms pour vous assurer qu’il fonctionne. Si nécessaire, vérifiez vos paramètres ou consultez la documentation de WPForms.

Conclusion

Configurer un formulaire de contact avec WPForms est simple et ne prend pas beaucoup de temps. Maintenant que votre formulaire est prêt, les visiteurs peuvent facilement vous contacter. Assurez-vous simplement de le tester pour confirmer que tout fonctionne. Si nécessaire, vous pouvez ajuster les paramètres à tout moment. Votre site web est maintenant prêt à recevoir des messages en douceur !

Articles connexes

Rene Hermenau

Auteur : Rene Hermenau

À propos de l'auteur : René Hermenau est le fondateur de WP STAGING. Il travaille sur les sauvegardes WordPress, les environnements de staging, les migrations, la gestion des bases de données et les workflows de déploiement sécurisés.