Vous voulez ajouter un formulaire de contact sur votre site WordPress, mais vous ne savez pas par où commencer ?

Le problème : WordPress ne propose PAS de formulaire de contact par défaut. Vous devez :

• Installer un plugin (Contact Form 7, WPForms, Gravity Forms...) ;
• Configurer les paramètres d'envoi d'email ;
• Personnaliser le design ;
• Intégrer le formulaire dans votre page ;
• Essayer d'éviter les spams.

Dans ce guide, je vous montre 2 façons de créer un formulaire de contact WordPress professionnel :

1. Avec Contact Form 7 (le plugin gratuit le plus populaire) ;
2. Avec le thème Divi (qui intègre un module formulaire).

💡Vous cherchez plus de conseils sur la création d'un site avec WordPress ?
Téléchargez la checklist : 20 étapes concrètes pour lancer votre site sans coder. 👇

 

---

💡Cet article peut contenir des liens affiliés, vers des produits ou des logiciels que j'utilise personnellement dans le cadre de mon travail de développeur.

 

Pourquoi vous avez besoin d’un formulaire de contact sur votre site

Avant de plonger dans le tutoriel, rappelons rapidement pourquoi le formulaire de contact est certainement la partie LA PLUS IMPORTANTE de tout votre site.

1. C'est quand même le but de votre site pro

Si vous êtes artisan.e, thérapeute, photographe, architecte ou autre prestataire de service, vous avez crée votre site pour pouvoir attirer de nouveaux clients.
En général, ils vont d'abord consulter vos offres, puis se diriger vers la page contact. C'est le but ultime.

2. Vous évitez d'afficher votre email publiquement

Afficher votre email en clair sur votre site est une invitation ouverte aux robots spammeurs. Ils sont en embuscade, prêts à vous proposer des pilules bleues, des cadeaux Lidl et des colis en attente.

Avec un formulaire de contact, votre adresse email reste privée et vous êtes un peu plus tranquille.

3. Vous collectez des informations structurées

Avec un formulaire, vous pouvez demander :

• Nom et prénom
• Email
• Téléphone
• Objet du message
• Message détaillé

Résultat : vous recevez des demandes bien organisées au lieu d'emails fourre-tout.
Néanmoins, évitez de poser trop de questions pour ne pas décourager les volontaires.

4. Vous paraissez professionnel

Une simple adresse mail fait un peu amateur.

Le formulaire a quelque chose de plus officiel qui va rassurer vos futurs clients.

 

---

Méthode 1 : Créer un formulaire de contact sur WordPress avec Contact Form 7

Contact Form 7 est le plugin de formulaire le plus populaire sur WordPress.

Avec plus de 5 millions d'installations actives, c'est le choix "classique" quand on veut ajouter un formulaire de contact gratuitement.

Voyons comment l'installer et le configurer.

Étape 1 : Installer Contact Form 7

Depuis votre tableau de bord WordPress, allez dans Extensions → Ajouter.

Dans la barre de recherche, tapez "Contact Form 7".

Cliquez sur Installer puis Activer.

Une fois activé, vous verrez un nouvel onglet "Contact" dans le menu latéral de WordPress.

 

Étape 2 : Créer votre premier formulaire

Cliquez sur Contact → Formulaires de contact.

Par défaut, Contact Form 7 crée un formulaire de démonstration qui s'appelle "Formulaire de contact 1".

Nous n'allons pas l'utiliser, mais plutot en créer un nouveau en cliquant sur le bouton "Add Contact Form".

Donnez un nom à votre formulaire (par exemple : "Formulaire page Contact").

Vous arrivez sur l'interface de configuration, divisée en 4 onglets :

1. Formulaire : où vous créez les champs ;
2. Mail : où vous configurez l'envoi des emails ;
3. Messages : où vous personnalisez les messages d'erreur, de confirmation et ou autres.
4. Réglages additionnels : pour des options avancées.

 

Étape 3 : Créer les champs du formulaire

C'est ici que ça devient un peu technique.

Contact Form 7 fonctionne avec des shortcodes et l'extension vous sert à écrire le code plus facilement.

Vous cliquez sur les boutons en haut (texte, email, textarea, etc.) pour ajouter des champs, et Contact Form 7 génère un shortcode que vous devez copier-coller dans l'éditeur (dans votre page "Contact").

 

Les champs les plus courants sont :

• Texte ;
• E-mail (si la réponse ne contient pas un "@", le message ne pourra pas être envoyé) ;
• URL ;
• Téléphone ;
• Zone de texte (un paragrpahe plus long, pour vous expliquer leur projet) ;
• Menu déroulant ;
• Case à cocher.

Comment ajouter un champ "Nom" :

1. Déjà, mettez votre souris au bon endroit (au dessus ou en dessous des champs déjà présents). Vous souhaitez garder les titres? ("Votre nom", "Votre e-mail", etc.). Alors, conservez la structure présente dans l'exemple. Modifiez uniquement la partie enter des crochets.
2. Cliquez par exemple sur le bouton "texte" ;
3. Une fenêtre s'ouvre avec des options (Obligatoire, Nom du champ, Valeur par défaut...) va s'ouvrir ;
4. Vous pouvez remplir ces options, mais le plus simple est de ne toucher à rien ;
5. Cliquez sur le bouton "Enregistrer"
6. Contact Form 7 génère un code comme : [text* your-name]
7. Vous copiez-collez ce code dans l'éditeur.

Le problème ?

Si vous ne comprenez pas comment fonctionnent les shortcodes, vous allez vite être perdu.

Voici à quoi ressemble un formulaire Contact Form 7 typique :

<label> Votre nom (obligatoire)
    [text* your-name] </label>

<label> Votre e-mail (obligatoire)
    [email* your-email] </label>

<label> Objet
    [text your-subject] </label>

<label> Votre message
    [textarea your-message] </label>

[contact-form-7 id="14ea87c" title="Formulaire page Contact"]

 

C'est du code HTML mélangé avec des shortcodes. Pas très visuel, je m'y perds aussi.

Si vous n'êtes pas à l'aise avec le code, vous allez peut-être devoir faire quelques essais, mais c'est faisable (et gratuit).

 

Étape 4 : Configurer l'envoi des emails

Cliquez sur l'onglet Mail.

Ici, vous devez configurer où et comment les emails seront envoyés.

Les champs à remplir :

• À : L'adresse email où vous recevrez les messages (exemple : contact@votresite.fr). [_site_admin_email] signifie que c'est l'adresse d'administration de votre site qui sera utilisée (celle où vous recevez les notifications lors des mises à jour).
• De : L'adresse email de l'expéditeur (par défaut : wordpress@votresite.fr - L'expéditeur du mail est votre site, pas directement la personne qui vous a écrit, c'est normal).
• Objet : L'objet de l'email (exemple : "Nouveau message depuis le site") ;
• Corps du message : Le contenu de l'e-mail : le message que la personne a écrit sur votre page Contact.

 

Étape 5 : Résoudre les problèmes d'envoi d'emails

ATTENTION : C'est ici que ça peut devenir technique (oui avant c'était rien 🤡).

Par défaut, WordPress utilise la fonction PHP mail() pour envoyer des emails. Mais cette fonction est souvent bloquée par les hébergeurs.

Résultat :

• Un client potentiel remplit le formulaire ;
• Le message de confirmation s'affiche ("Votre message a bien été envoyé") ;
• Mais vous ne recevez JAMAIS l'email 👍

La solution ? Installer un plugin SMTP.

SMTP (Simple Mail Transfer Protocol) est un protocole d'envoi d'emails, utilisé par les boites mails classiques et qui est plus fiable que la fonction PHP par défaut.

Vous devez :

1. Installer un plugin comme WP Mail SMTP ou Post SMTP ;
2. Configurer vos identifiants SMTP (regardez la documentation de votre service d'e-mails : Gmail, Outlook, Orange ou autre) ;
3. Tester l'envoi plusieurs fois.

 

C'est une configuration technique supplémentaire qu'il ne faut pas négliger sous peine de rater beaucoup de messages.

 

Étape 6 : Intégrer le formulaire dans une page

Une fois votre formulaire créé, Contact Form 7 génère un shortcode :

[contact-form-7 id="123" title="Formulaire de contact"]

Vous devez copier ce shortcode et le coller dans votre page Contact.

Comment faire :

1. Allez dans Pages → Modifier votre page Contact (ou la créer si elle n'existe pas encore) ;
2. Ajoutez un bloc Shortcode ou "code court".
3. Collez le shortcode
4. Publiez

Votre formulaire s'affiche sur la page.

Le problème ? Eh bien c'est très laid.

Le formulaire a un design basique (champs gris, bouton vintage). Il ne s'intégrera pas automatiquement au design de votre site.

 

Étape 7 : Personnaliser le design du formulaire

Par défaut, Contact Form 7 génère un formulaire très moche.

Pour le rendre joli, vous devez ajouter du CSS personnalisé.

Exemples de personnalisation CSS :
(à ajouter dans Apparence > Éditeur de fichiers des thèmes - Attention, vous devez utiliser un thème enfant pour faire ça, sinon vos modifications seront effacées à la prochaine mise à jour).

/* Changer la couleur du bouton */
.wpcf7-submit {
    background-color: #b45fc8;
    color: white;
    border: none;
    padding: 10px 20px;
}

/* Mettre tous les champs en pleine largeur */
input[type="text"]
{
    background-color: #fff;
    color: #000;
    width: 100%;
}

➡️ Petit à petit, avec un peu de patience, vous pouvez modifier l'apparence de chaque partie.

Vous pouvez aussi utiliser des plugins comme Contact Form 7 Skins, mais ça rajoute un plugin supplémentaire (et donc du poids à votre site).

 

Étape 8 : Protéger contre le spam

Les formulaires de contact sont de vrais aimants à spam.

Contact Form 7 propose plusieurs options anti-spam, que vous pourrez configurer dans la partie "Intégration".

 

---

 

Méthode 2 : Créer un formulaire de contact WordPress avec Divi (la méthode rapide)

Maintenant, voyons comment faire la même chose avec un éditeur visuel comme celui de Divi.

Divi est un page builder pour WordPress. Il inclut un module Contact Form intégré.

Pourquoi Divi change tout pour les formulaires de contact

Avec Divi, vous créez votre formulaire en glisser-déposer (drag & drop).

Vous voyez en temps réel ce que vous êtes en train de créer.

Et surtout :

• ✅ Pas besoin de plugin supplémentaire
• ✅ Pas de shortcodes à manipuler
• ✅ Pas de configuration SMTP compliquée
• ✅ Design pro par défaut
• ✅ Anti-spam intégré

💡Vous recherchez des infos pour créer votre site WordPress avec Divi ?
Explorez le guide : comment ça marche, combien ça coûte, comment utiliser un template, etc.

➡️ Comment créer un site avec Divi et WordPress ? Le guide complet 2026

 

Étape 1 : Installer Divi

Si vous n'avez pas encore Divi, vous devez :

1. Acheter une licence Divi sur elegantthemes.com
   • 89€/an (ou 250€ en paiement unique à vie)
2. Télécharger le plugin depuis votre compte Elegant Themes
3. L'installer dans WordPress (Extensions → Ajouter → Téléverser)
4. L'activer

Une fois Divi activé, vous avez accès au Divi Builder sur toutes vos pages.

Étape 2 : Ajouter le module Contact Form

Allez dans Pages → Modifier votre page Contact (ou créez-en une nouvelle).

Cliquez sur "Utiliser Divi Builder".

Créez une nouvelle section (cliquez sur le + bleu).

Ajoutez une nouvelle ligne (cliquez sur le + vert).

Et enfin ajoutez un nouveau module (cliquez sur le + gris).

Cherchez le module "Formulaire de contact" et sélectionnez-le.

Divi génère un formulaire basique qui contient 3 champs :

• Nom
• Email
• Message

Votre formulaire est déjà fonctionnel et pas si moche. On va tout de même faire quelques réglages, au moins pour les messages arrivent dans voter boite mail.

Étape 3 : Personnaliser les champs du formulaire

Pour ajouter ou modifier des champs, cliquez sur "Add New Field" (Ajouter un nouveau champ).

Divi vous propose plusieurs types de champs :

• Champ d'entrée (texte court, par exemple pour écrire son nom) ;
• Email ;
• Zone de texte (texte long pour expliquer un projet ou poser des questions) ;
• Cases à cocher (plusieurs choix possibles) ;
• Bouton radio (1 seul choix possible) ;
• Menu déroulant.

Exemple : pour ajouter un champ "Téléphone"

1 - Cliquez sur "Ajouter un nouveau module ou une nouvelle ligne"

Donnez un titre à ce nouveau champ : "Téléphone"

Sélectionnez le type : "Champ d'entrée" ;

Marquez-le comme Obligatoire (ou pas) ;

Vous pouvez aussi choisir de n'autoriser que des nombres, ou 10 caractères (numéros français).

C'est tout. Vous voyez en temps réel votre formulaire se construire.

Profitez en pour modifier l'intitulé des autres champs (comme "e-mail adress")

Étape 4 : Configurer l'envoi des emails

Si vous êtes encore dans les réglages du champ, remontez d'un cran pour aller dans ceux du formulaire :

Ensuite, dans les réglages du module Formulaire de contact, allez dans l'onglet Contenu → Email.

Remplissez :

• Email : l'adresse où vous recevrez les messages (exemple : contact@votresite.fr) ;
• Modèle du message : le contenu de l'email (facultatif).

Le gros avantage ?

La fonction d'envoi d'emails de WordPress fonctionne très bien la plupart du temps.

Si jamais vous rencontrez des problèmes d'envoi, vous pourrez installer WP Mail SMTP comme avec Contact Form 7.

 

Puisque vous êtes là, modifiez l'intitulé du bouton, juste au-dessus.
Ce réglage se trouve dans Contenu → Texte ;
À la place de "Submit", vous pouvez par exemple écrire "Envoyer".

Vous pouvez aussi prévoir un message de succès, comme "Votre message a bien été envoyé".

 

Étape 5 : Personnaliser le design du formulaire

Cliquez sur l'onglet Style dans les réglages du module (celui du milieu).

Vous pouvez personnaliser visuellement :

• La police des champs ;
• La couleur des champs ;
• La taille des champs ;
• L'espacement entre les champs ;
• Le style du bouton (couleur, taille, bordures, effets au survol, etc.) ;
• L'arrière-plan du formulaire.

Tout se fait en glisser-déposer et vous voyez les changements en temps réel sur la page.

Exemple : changer la couleur du texte

1. Allez dans Sytle → Champs → Champs Texte ;
2. Choisissez votre couleur.

Terminé.

Étape 6 : Activer l'anti-spam

Si vous trouvez que vous recevez trop de spam, vous pourrez activer les protections antispam.
Divi propose un système très simple avec une addition, mais vous pouvez aussi intégrer un outil plus complexe.

Pour cela, rendez-vous dans Contenu → Protection contre les spams

 

Étape 7 : Tester et publier

Vous avez déjà un formulaire un peu plus présentable, sans trop d'efforts.

Vous n'avez plus qu'à sauvegarder.

Pensez à bien tester votre formulaire en vous envoyant des messages !

Temps total : 10-15 minutes

---

 

🔥 Ce que vous pouvez faire en plus avec Divi

Voici quelques exemples concrets de ce que vous pouvez créer avec Divi ou un autre éditeur visuel, mais qui serait très compliqué avec un plugin ordinaire.

1. Un design personnalisé :

• Des champs sur 2 colonnes ;
• Un arrière-plan dégradé ;
• Des bordures arrondies ;
• Un bouton animé au survol.

Vous pouvez utiliser les réglages du module Divi.

2. Champs conditionnels

Vous voulez afficher certains champs uniquement si l'utilisateur sélectionne une option spécifique ? Par exemple, s'il choisit une prestation spécifique, vous lui posez une question suppplémentaire.

Divi intègre un système de logique conditionnelle intégrée (Allez simplement dans Contenu → Logique conditionnelle).

5. Formulaire intégré dans une popup

Divi 5 propose de nouvelles options d'affichage, notamment dans des pop-ups.

💡Vous recherchez des infos pour créer votre site WordPress avec Divi ?
Explorez le guide : comment ça marche, combien ça coûte, comment utiliser un template, etc.

➡️ Comment créer un site avec Divi et WordPress ? Le guide complet 2026

---

💡 Quel est le meilleur choix pour VOUS ?

Choisissez Contact Form 7 si :

✅ Vous avez un budget très serré (outil gratuit) ;
✅ Vous êtes à l'aise avec le code (shortcodes et CSS) ;
✅ Vous avez un peu de temps devant vous ;
✅ Vous voulez juste un formulaire très basique.

Choisissez Divi si :

✅ Vous voulez un résultat professionnel rapidement ;
✅ Vous voulez que votre ait site ait un design un peu plus original ;
✅ Vous ne voulez pas perdre de temps à écrire du code ;
✅ Vous avez besoin de fonctionnalités avancées (redirection, anti-spam...).

 

D'ailleurs, le formulaire de contact n'est qu'une des fonctionnalités de Divi. Vous pouvez aussi créer votre page d'accueil, votre menu, votre portfolio... tout en glisser-déposer.

Si vous avez un budget ultra serré et que vous êtes à l'aise avec le code, une extension gratuite peut suffire.

 

---

Prêt à créer votre formulaire de contact WordPress ?

👉 Essayer Divi ;

Vous avez besoin d'aide pour votre site, je peux sans doute vous aider :

• Création de site sur mesure ;
• Journée VIP pour améliorer votre site WordPress ;

 

---

🚀 Comment installer Divi et créer votre formulaire (tutoriel rapide)

Si vous souhaitez remplacer votre thème actuel par un outil plus puissant comme Divi, voici la marche à suivre.

1. Créez un compte et choisissez une formule

Allez sur elegantthemes.com et choisissez :

• Abonnement annuel (environ 89€/an) : accès illimité à Divi + support + mises à jour pendant 1 an.
• Licence illimitée (environ 250€) : idem avec à vie.

Pour un site professionnel que vous allez utiliser plusieurs années, l'abonnement illimité est évidemment plus intéressant.

2. Téléchargez le thème

Une fois votre achat terminé, vous recevrez des instructions par e-mail. Vous pouvez aussi aller dans la partie "Account" du site pour télécharger votre produit autant de fois que vous le voulez.

3. Installez Divi dans WordPress

Vous allez ensuite changer de thème. Si votre site a déjà du contenu, il risque de ne plus s'afficher correctement.
Vous pouvez vous rendre dans Outils → Exporter pour le sauvegarder en cas de besoin. Mais le plus simple est parfois de copier-coller vos textes dans un document puis de recréer vos pages de zéro, avec un template.

• Allez dans Apparence → Thèmes ;
• Cliquez sur "Ajouter un thème", puis "Téléverser un thème" ;
• Sélectionnez le fichier ZIP que vous avez téléchargé ;
• Cliquez sur "Installer maintenant" ;
• Puis "Activer".

Vous pouvez aussi suivre ce tutoriel ✨

 

---

 

Créer une formulaire de contact sur WordPress - Questions fréquentes

Est-ce que Contact Form 7 est vraiment gratuit ?

Oui, Contact Form 7 est 100% gratuit. Il est possible de le rendre plus fonctionnel et joli en installant des plugins supplémentaires, mais ce n'est pas obligatoire.

Pourquoi mes emails Contact Form 7 ne partent pas ?

Par défaut, le formulaire de contact WordPress utilise la fonction PHP mail() qui est souvent bloquée par les hébergeurs.

Solution : Installez un plugin SMTP comme WP Mail SMTP et configurez vos identifiants Gmail ou autre.

Combien de formulaires puis-je créer avec Divi ?

Autant que vous voulez !

Avec une licence Divi, vous pouvez créer des formulaires illimités sur autant de sites que vous voulez.