Comment ajouter un widget de formulaire de contact à votre site web (2025)
clicksocial

Programmer des publications sur les médias sociaux directement depuis WordPress avec ClickSocial

Démarrer l'essai gratuit angle droit
Accueil Blog Comment ajouter un widget de formulaire de contact à votre site web (2025)

Comment ajouter un widget de formulaire de contact à votre site web (2025)

Comment ajouter un widget de formulaire de contact à WordPress

Vous souhaitez ajouter un widget de formulaire "Contactez-nous" sur votre site web ?

Outre l'interaction avec vos clients via les médias sociaux, l'ajout d'un formulaire de contact sur votre site est un autre moyen facile d'entrer en contact avec votre public cible. Il vous permet de recueillir des commentaires, de fournir une assistance, de collecter des informations, de répondre à des questions, et bien plus encore.

Aujourd'hui, nous allons vous montrer la manière la plus simple d'ajouter un widget de formulaire de contact à votre site web.

Avant de commencer, voyons comment l'utilisation de formulaires de contact peut aider votre entreprise.

Pourquoi utiliser un widget de formulaire de contact ?

Un widget de formulaire de contact offre aux visiteurs de votre site web un moyen simple de vous contacter. Vous pourrez ainsi facilement recueillir des commentaires utiles de la part de vos visiteurs.

En facilitant la communication, vous pouvez établir une relation avec vos visiteurs et les convertir en clients fidèles.

Et ce n'est qu'un début ! Voici d'autres façons étonnantes d'utiliser les widgets de formulaire de contact :

  • En recueillant les adresses électroniques de vos visiteurs, vous pouvez même utiliser des formulaires de contact pour augmenter votre liste d'adresses électroniques.
  • Vos formulaires peuvent organiser automatiquement toutes les informations que vous recevez de vos clients, ce qui vous permet d'économiser beaucoup de temps et d'efforts.
  • Vous pouvez également utiliser des formulaires de contact pour répondre rapidement aux questions et fournir une assistance à la clientèle plus rapide.
  • Contrairement aux courriers électroniques, vous pouvez spécifier le type d'informations dont vous avez besoin afin de ne recevoir que les détails pertinents.
  • Vos widgets de formulaire de contact peuvent également bloquer les robots spammeurs et les fausses entrées afin de protéger votre site web.

Comme vous pouvez le constater, un formulaire de contact peut être un outil fantastique si vous souhaitez établir une relation avec vos clients, augmenter les conversions, collecter des informations utiles et développer votre entreprise.

Voyons maintenant la manière la plus simple d'ajouter des widgets de formulaire de contact à votre site web.

La façon la plus simple d'intégrer des widgets de formulaire de contact

Pour intégrer facilement des formulaires de contact sur votre site web, il vous suffit d'utiliser un plugin WordPress - pas besoin de créer un formulaire à partir de zéro.

Bien qu'il existe de nombreux plugins de formulaire de contact pour WordPress, la meilleure option que vous puissiez utiliser est WPForms.

wpforms page d'accueil

WPForms est un constructeur de formulaires simple qui peut vous aider à ajouter des formulaires de contact attrayants à votre site WordPress en quelques clics.

Pour vous aider à créer des formulaires à fort taux de conversion, ce plugin est doté de fonctionnalités utiles telles que

  • Constructeur par glisser-déposer : Vous pouvez utiliser le constructeur visuel pour créer vos formulaires en quelques clics - aucun codage n'est nécessaire.
  • Formulaires à plusieurs pages : Pour encourager les gens à remplir vos formulaires, vous pouvez les diviser en plusieurs petites pages plus faciles à remplir.
  • Modèles préconstruits : Il vous suffit de choisir parmi plus de 400 modèles préconstruits disponibles, et votre magnifique formulaire de contact sera instantanément prêt.
modèles pour wpforms
  • Options de paiement : Vous pouvez également recevoir des paiements à partir de vos formulaires de contact afin que les visiteurs puissent facilement commander des articles ou s'abonner à vos services.
  • Logique conditionnelle intelligente : Pour créer des formulaires courts et attrayants, vous pouvez masquer ou afficher des options en fonction des réponses précédentes de la personne.

Avec toutes ces fonctionnalités étonnantes, WPForms est devenu le meilleur plugin de formulaire de contact pour WordPress. En fait, plus de 5 millions de sites web utilisent WPForms pour convertir les visiteurs et promouvoir leurs marques.

Si vous voulez en savoir plus, nous avons une revue complète de WPForms que vous pouvez consulter.

Maintenant, voyons comment vous pouvez utiliser WPForms pour intégrer un widget de formulaire de contact.

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

Sur ce, commençons par découvrir la manière la plus simple d'intégrer des widgets de formulaire de contact. Il suffit de suivre les étapes ci-dessous :

Étape 1 : Télécharger et installer le plugin WordPress WPForms

Pour commencer, allez chercher votre copie de WPForms ici. Vous pouvez ensuite installer et activer le plugin sur votre site web.

Si vous souhaitez apprendre à le faire, vous pouvez simplement consulter notre tutoriel sur l'installation des plugins WordPress.

Étape 2 : Créer un formulaire de contact

Vous pouvez maintenant utiliser votre nouveau plugin pour créer un formulaire de contact pour votre site web.

Pour cela, il faut d'abord se rendre dans le menu WPForms " Add New (Ajouter un nouveau) de votre tableau de bord WordPress.

ajouter un nouveau formulaire de contact wpforms

Ensuite, vous pouvez choisir un modèle préétabli pour créer rapidement un formulaire engageant de votre choix.

Puisque nous créons un widget de formulaire de contact, passez votre souris sur Simple Contact Form et cliquez sur Use Template.

utiliser un modèle de formulaire de contact simple wpforms

Vous disposez maintenant d'un formulaire de contact simple sur votre site web. Par défaut, vous disposez de 3 champs différents pour collecter des informations :

  • Nom : Demander le nom et le prénom des personnes
  • Courriel : Collectez les adresses électroniques de vos visiteurs
  • Commentaire ou message : Permet aux visiteurs de vous laisser un message

Après avoir saisi leurs coordonnées, vos visiteurs peuvent cliquer sur Soumettre pour vous envoyer les informations.

exemple de formulaire de contact simple wordpress

Étape 3 : Ajouter de nouveaux champs à votre formulaire

Avec WPForms, vous pouvez ajouter plus de champs et collecter plus d'informations auprès de vos visiteurs.

Pour faciliter l'ajout de nouveaux champs, vous pouvez utiliser le générateur de formulaires par glisser-déposer de WPForm.

Sur le côté gauche de l'éditeur, vous trouverez tous les champs personnalisés que vous pouvez ajouter. Vers la droite, vous pouvez voir votre nouveau formulaire de contact et suivre les changements en temps réel.

Constructeur de formulaire de contact par glisser-déposer

Pour ajouter un champ à votre formulaire de contact, faites glisser le champ depuis la gauche et déposez-le à droite.

Dans notre exemple, nous ajoutons le champ Numbers qui permet de collecter les numéros de téléphone.

drag and drop item wpforms

Une fois que vous avez fait cela, vous pouvez voir toutes les options pour ce champ sur le panneau de gauche. Si vous souhaitez commencer à modifier un champ existant, il vous suffit de cliquer dessus, et vous trouverez les options du champ sur la gauche.

Pour notre exemple, nous pouvons modifier les paramètres de notre nouveau champ Numéros ici.

Pour modifier le nom du champ, vous pouvez modifier l'option Étiquette .

Si vous souhaitez donner plus d'informations sur le champ, vous pouvez utiliser l'option Description . Cela permettra à vos visiteurs de se faire une idée précise de la nature de ce champ.

Vous souhaitez que ce champ soit obligatoire pour toute personne remplissant le formulaire ? Dans ce cas, vous pouvez activer l'option " Obligatoire" .

paramètres généraux pour les champs wpforms

Vous pouvez également trouver plus d'options ici en fonction du type de champ que vous éditez.

Lorsque vous êtes satisfait des paramètres du champ, cliquez sur l'onglet Avancé en haut de la page pour continuer à modifier ce champ.

options de champs avancés widget de formulaire de contact

Dans les options avancées, vous trouverez d'autres moyens de personnaliser votre champ :

  • Taille du champ : Définir l'espace occupé par ce champ à l'écran
  • Placeholder Text : Afficher un texte dans le champ lorsqu'il est vide
  • Valeur par défaut : Choisissez ce que le champ affichera si la personne ne le remplit pas avant de l'envoyer.
  • Classes CSS : Ajoutez des feuilles de style CSS personnalisées pour modifier la conception de ce champ.
  • Masquer l'étiquette : Afficher ou masquer l'étiquette au-dessus du champ

Une fois que vous avez terminé les paramètres avancés, cliquez sur l'onglet Smart Logic en haut de la page pour continuer.

logique intelligente wpforms

À partir de là, vous pouvez activer la logique conditionnelle pour ce champ.

Cette option vous permet d'afficher ou de masquer ce champ en fonction de la réponse des visiteurs à une question précédente.

Par exemple, vous pouvez demander à vos visiteurs s'ils vivent aux États-Unis. S'ils répondent par l'affirmative, vous pouvez utiliser une logique conditionnelle pour afficher un champ dans lequel ils peuvent choisir leur État.

Vous souhaitez ajouter des champs supplémentaires à votre formulaire de contact ? Dans ce cas, vous pouvez cliquer sur le bouton Ajouter des champs en haut de la page.

ajouter de nouveaux champs nous contacter widget de formulaire

Vous pouvez ainsi ajouter des champs pour collecter des courriels, des emplacements, des mots de passe, des dates, des fichiers et bien plus encore. Vous pouvez également ajouter des séparateurs de section ou des sauts de page à votre formulaire.

Une fois que vous êtes satisfait de votre formulaire de contact, cliquez sur le bouton Enregistrer dans le coin supérieur droit.

Étape 4 : Modifier les paramètres du formulaire

Pour modifier les paramètres de votre formulaire de contact, cliquez sur l'option Paramètres à gauche.

open contact us form settings wpforms

Cela ouvrira les Paramètres généraux, où vous pourrez modifier ces options :

  • Nom du formulaire : Choisissez un nom pour votre formulaire de contact
  • Description du formulaire : Rédigez une brève description de votre nouveau formulaire
  • Texte du bouton de soumission : Choisissez ce que le bouton situé à la fin du formulaire indique à la place de "soumettre"
  • Texte de traitement du bouton de soumission : Ajoutez un petit texte qui s'affiche sur le bouton de soumission lorsque quelqu'un clique dessus.
  • Activer la protection anti-spam : Protégez votre widget de formulaire de contact contre les robots spammeurs.
général nous contacter formulaire paramètres

Une fois que vous êtes satisfait des paramètres, cliquez sur le bouton Enregistrer.

Ensuite, cliquez sur l'option Notifications dans le panneau de gauche pour continuer.

ouvrir la section de notification wpforms

Par défaut, WPForms vous enverra une notification par email lorsque quelqu'un remplit le formulaire. En utilisant l'option Activer les notifications , vous pouvez choisir d'activer ou de désactiver ces notifications.

Vous pouvez ensuite utiliser les options restantes pour configurer vos notifications par courrier électronique :

  • Envoyer à l'adresse électronique : Choisissez une adresse électronique pour recevoir les notifications par courriel
  • Objet de l'e-mail : Choisissez l'objet de ces courriels
  • Nom de l'expéditeur : Choisissez le nom de l'expéditeur
  • De l'email : Choisissez une adresse électronique qui envoie ces courriels
options de notification pour les wpforms

Si vous faites défiler la page, vous trouverez les autres paramètres du formulaire de contact de WordPress :

  • Adresse électronique de réponse: Choisissez l'adresse électronique qui recevra les réponses à ces courriels de notification.
  • Email Message: Définissez le message des courriels de notification. Si vous voulez seulement voir les informations collectées par le formulaire de contact, vous pouvez le laisser tel quel.
  • Activer la logique conditionnelle : Ne recevez des notifications par courrier électronique que lorsque le visiteur ajoute une réponse spécifique à certains champs.
options de notification wpforms

Une fois les paramètres de notification définis, cliquez à nouveau sur le bouton Enregistrer.

Ensuite, cliquez sur l'option Confirmations pour continuer.

ouvrir l'option de confirmation

Dans les paramètres de confirmation, vous pouvez créer un message pour les visiteurs qui ont rempli le formulaire.

Dans le champ Message de confirmation , écrivez votre message et cliquez sur le bouton Enregistrer.

ajoutez votre message de confirmation

Étape 5 : Intégrer le widget du formulaire de contact

Enfin, il est temps d'ajouter le widget du formulaire de contact à votre site web WordPress. En fait, vous avez deux façons de le faire :

  • Intégrer un widget de formulaire de contact sur une page WordPress
  • Intégrer un widget de formulaire de contact dans la barre latérale ou le pied de page de WordPress

Nous allons examiner les deux méthodes ci-dessous :

Intégrer un widget de formulaire de contact sur une page WordPress

En utilisant WPForms, vous pouvez intégrer un widget de formulaire de contact sans aucune difficulté, directement depuis l'éditeur.

Il suffit de cliquer sur le bouton " Embed" en haut de la page pour commencer.

cliquez sur le bouton "embed" formulaire de contact

Ensuite, vous verrez une fenêtre contextuelle qui vous demandera de choisir l'emplacement de votre formulaire de contact.

Si vous souhaitez ajouter le formulaire à une page WordPress existante, cliquez sur le bouton Sélectionner une page existante .

Pour intégrer votre widget de formulaire dans une nouvelle page, cliquez sur Créer une nouvelle page.

options d'intégration pour les wpforms

Le plugin ouvrira alors la page dans l'éditeur WordPress afin que vous puissiez intégrer votre widget. Pour ce faire, cliquez sur la petite icône plus (+) pour ajouter un nouveau bloc de contenu.

ajouter un nouveau bloc de contenu wordpress

Ensuite, écrivez "wpforms" dans la barre de recherche en haut. Une fois que vous avez fait cela, cliquez simplement sur le widget WPForms dans les options ci-dessous.

sélectionner le bloc de contenu wpforms

Ce faisant, le widget WPForms sera intégré à votre page. Dans le widget, utilisez le menu déroulant et sélectionnez le formulaire de contact que vous venez de créer.

choisissez votre formulaire de contact wpforms

N'oubliez pas de cliquer sur le bouton Publier ou Mettre à jour pour confirmer vos modifications.

Comme cela, vous avez ajouté le formulaire à votre site web WordPress. Pour voir ce que cela donne, vous pouvez aller de l'avant et ouvrir votre page de contact WordPress.

afficher le widget du formulaire de contact sur votre site web

Intégrer le widget du formulaire de contact dans la barre latérale ou le pied de page de WordPress

Vous pouvez également afficher votre nouveau formulaire de contact dans les zones de votre site Web où des widgets sont disponibles, comme la barre latérale ou le pied de page.

Tout d'abord, allez dans le menu Apparence " Widgets pour ouvrir la page des widgets de votre site web. À partir de là, vous pouvez ajouter, supprimer et gérer tous vos widgets WordPress.

ouvrez la page des widgets de votre site web

Ensuite, vous pouvez choisir entre la barre latérale et le pied de page. Pour intégrer votre formulaire de contact dans la barre latérale, cliquez sur le panneau Barre latérale.

ouvrir le panneau latéral

Si vous souhaitez plutôt intégrer le formulaire dans votre pied de page, cliquez sur Pied de page.

Pour notre exemple, nous utiliserons la barre latérale.

ouvrir le panneau de bas de page

Ensuite, cliquez sur l'icône plus (+) pour ajouter un nouveau widget, puis cliquez sur WPForms.

intégrer le widget du formulaire de contact

Vous pouvez maintenant utiliser le widget WPForms pour choisir le formulaire de contact que vous souhaitez intégrer.

Comme précédemment, utilisez le menu déroulant pour sélectionner votre nouveau formulaire de contact.

choisissez votre widget de formulaire de contact

Cliquez sur le bouton " Mettre à jour" pour enregistrer vos modifications, et le tour est joué !

Vous avez maintenant un widget de formulaire de contact sur votre site web. Allez-y et ouvrez votre site web pour voir à quoi il ressemble.

intégrer le formulaire de contact dans la barre latérale

Et c'est tout !

Nous espérons que cet article vous a montré comment ajouter un widget de formulaire de contact sur votre site WordPress. En utilisant WPForms, vous pouvez le faire en quelques étapes simples.

Ensuite, vous pouvez facilement atteindre vos clients, générer des leads, augmenter vos conversions, et bien plus encore.

Prêt à créer des formulaires de contact attrayants ? Obtenez WPForms pour votre site web.

Si vous souhaitez créer un site web magnifique en toute simplicité, consultez notre liste des meilleurs plugins de construction de pages.

Enfin, si vous avez apprécié cet article, connectez-vous avec nous sur Twitter et Facebook pour obtenir d'autres tutoriels utiles.

avatar de l'auteur
Sajjan Sharma Rédacteur principal
Sajjan écrit sur WordPress, le marketing des médias sociaux et les entreprises en ligne depuis plus de 10 ans. Ses intérêts professionnels s'étendent au marketing d'influence, à la curation de contenu et aux stratégies de marketing numérique.

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de confidentialité et que tous les liens ne sont pas suivis. N'utilisez PAS de mots-clés dans le champ du nom. Engageons une conversation personnelle et constructive.