Logo EP Studly sites étudiants
Réserver une démo
WordPress BTS NDRCTutoriel pas-à-pas

Créer un formulaire de contact WordPress avec Spectra

Le formulaire de contact permet aux visiteurs de joindre l'entreprise sans exposer d'adresse email. Ce tutoriel construit un formulaire complet avec le bloc Formulaire de Spectra : champs, bouton d'envoi, message de confirmation et test.

Robin Richard · Formateur E5 · Co-fondateur d’EP Studly · 18 septembre 2025 · Mis à jour le 1 octobre 2025 · 5 min de lecture

Partager :
Créer un formulaire de contact WordPress avec Spectra
Sommaire
  1. Introduction
  2. 1. Ajouter le widget de formulaire
  3. 2. Régler l’affichage et traduire les messages
  4. 3. Configurer l’email de réception
  5. 4. Personnaliser les champs du formulaire
  6. 5. Ajouter d’autres champs si nécessaire
  7. FAQ – Formulaire de contact WordPress avec Spectra
  8. Conseils pour l’examen (E5B)
  9. Erreurs à éviter
  10. Checklist révision rapide

Introduction

Dans l’épreuve E5B du BTS NDRC, vous devez montrer que vous savez mettre en place des outils de communication efficaces. Le formulaire de contact est un élément indispensable : il permet aux visiteurs de prendre contact facilement avec l’entreprise.

👉 Dans ce tutoriel, vous allez apprendre pas à pas à créer un formulaire de contact WordPress avec le plugin Spectra : de l’ajout du widget à la personnalisation des champs, en passant par la configuration de l’adresse email de réception.

1. Ajouter le widget de formulaire

Avant toute chose, il faut insérer le formulaire de contact sur la bonne page, généralement la page Contact du site. C’est à cet endroit que les visiteurs chercheront à vous écrire.

  • Rendez-vous dans Pages > Contact.
  • Cliquez sur + Ajouter un bloc.
  • Cherchez le widget Formulaire (Spectra) et insérez-le.
Sélectionner la page contact via le backoffice wordpress
Sélectionner la page contact via le backoffice wordpress
Ajouter le widget "Form" via spectra
Ajouter le widget "Form" via spectra
Glisser le widget formulaire de contact sur votre page wordpress
Glisser le widget formulaire de contact sur votre page wordpress
Sélectionner l'option "Simple Contact Form"
Sélectionner l'option "Simple Contact Form"

Une fois placé, le formulaire de base apparaît immédiatement sur la page, prêt à être configuré.

2. Régler l’affichage et traduire les messages

Le formulaire Spectra propose des réglages d’affichage simples mais essentiels. C’est aussi à cette étape qu’il faut penser à la traduction en français, car par défaut certains messages sont en anglais.

  • Activez ou désactivez les labels (ex. : Prénom, Email).
  • Choisissez un style : en boîte (encadré) ou libre.
  • Traduisez en français le message de succès et le message d’erreur affichés après l’envoi.
Régler l’affichage et traduire les messages
Régler l’affichage et traduire les messages

Cette étape est cruciale pour l’expérience utilisateur : un formulaire non traduit donne une impression non professionnelle.

3. Configurer l’email de réception

Une fois l’affichage réglé, il faut paramétrer la réception des messages. L’objectif : faire en sorte que chaque soumission arrive dans la boîte mail de l’entreprise.

  • Dans l’onglet Action, renseignez l’adresse email de réception (ex. : contact@entreprise.com).
  • Ajoutez des adresses en copie (Cc) si nécessaire.
  • Définissez un objet d’email clair (ex. : “Demande de contact via le site”).
Configurer l’email de réception du formulaire de contact.
Configurer l’email de réception du formulaire de contact.

👉 Cette étape est indispensable pour garantir que le formulaire serve vraiment d’outil de communication.

4. Personnaliser les champs du formulaire

Il est important d’adapter les libellés et placeholders pour correspondre au vocabulaire attendu par vos visiteurs. Par défaut, certains champs sont en anglais (“John”, “Message”).

  • Changez les placeholders en français : Votre prénom, Votre nom, Votre message.
  • Traduisez tous les intitulés pour un rendu cohérent.
  • Ajustez le design si besoin : couleurs, marges, espacement.
Personnaliser les champs du formulaire
Personnaliser les champs du formulaire

Un formulaire clair inspire confiance et facilite la prise de contact.

5. Ajouter d’autres champs si nécessaire

Selon le contexte de l’entreprise, vous pouvez enrichir le formulaire avec de nouveaux champs. Cela permet de recueillir plus d’informations utiles.

Exemples de champs à ajouter :

  • Téléphone pour pouvoir rappeler le prospect.
  • Case à cocher pour valider les conditions d’utilisation (RGPD).
  • Zone de texte supplémentaire pour des détails spécifiques.
Ajouter d’autres champs si nécessaire
Ajouter d’autres champs si nécessaire

⚠️ Attention toutefois à ne pas surcharger le formulaire : restez simple et pertinent.

FAQ – Formulaire de contact WordPress avec Spectra

Un formulaire de contact WordPress est un outil incontournable pour tout site professionnel. Il permet aux visiteurs d’envoyer facilement un message sans quitter la page et améliore l’expérience utilisateur. Avec le plugin Spectra, vous pouvez créer en quelques clics un formulaire responsive, personnalisable et conforme au RGPD. Découvrez ci-dessous les réponses aux questions les plus fréquentes pour bien configurer votre formulaire de contact.

1. Pourquoi ajouter un formulaire de contact sur WordPress ?

Un formulaire de contact permet aux visiteurs de poser des questions, demander un devis ou s’inscrire à une formation sans quitter votre site. Il améliore la crédibilité et centralise les demandes, contrairement à une simple adresse e-mail affichée.

2. Comment créer un formulaire de contact avec Spectra ?

Dans WordPress, ouvrez la page souhaitée puis cliquez sur + Ajouter un bloc.
Recherchez Contact Form (Spectra), insérez-le, puis personnalisez les champs (Nom, Email, Message, Téléphone, etc.). Vous pouvez ensuite définir l’adresse e-mail qui recevra les demandes.

3. Peut-on personnaliser les champs d’un formulaire de contact Spectra ?

Oui ✅. Spectra permet de modifier les placeholders (ex. “Votre prénom”), de traduire les labels, de rendre certains champs obligatoires et d’ajouter de nouveaux champs (téléphone, menu déroulant, case à cocher, texte libre).

4. Comment recevoir les messages envoyés via le formulaire ?

Dans les paramètres Action > E-mail, indiquez l’adresse de réception (ex. contact@monsite.com). Vous pouvez aussi ajouter des adresses en copie et personnaliser l’objet de l’email (ex. “Nouvelle demande via le site”).

5. Quels sont les avantages de Spectra pour un formulaire de contact ?

Spectra se distingue par :

Sa simplicité d’utilisation (aucun plugin externe nécessaire).
Des formulaires responsive et design sans CSS complexe.
La possibilité de personnaliser le style (couleurs, bordures, marges).
Un gain de temps pour les étudiants lors de l’épreuve E5B.

Conseils pour l’examen (E5B)

  • Justifiez vos choix (ex. : ajout du champ téléphone pour améliorer le suivi client).
  • Traduisez tous les champs et messages en français.
  • Montrez la preuve du test (ex. capture d’un email reçu).
  • Vérifiez le rendu sur mobile et tablette.

Erreurs à éviter

  • Laisser les champs et messages en anglais.
  • Oublier de définir une adresse email valide.
  • Ajouter trop de champs non pertinents.
  • Ne pas tester le formulaire avant la soutenance.

Checklist révision rapide

  • Formulaire Spectra inséré sur la page Contact
  • Messages traduits en français
  • Adresse email de réception configurée
  • Objet d’email défini
  • Champs personnalisés (placeholders et libellés en français)
  • Champs supplémentaires ajoutés si besoin
  • Formulaire testé avec succès

📚 Envie d’aller plus loin ? Découvrez notre guide complet BTS NDRC E5B 2025-2026 – Formation WordPress BTS NDRC 2025 pour maîtriser toutes les compétences de l’épreuve !

🎥 Retrouvez tous nos tutos en vidéo sur la playlist YouTube dédiée !

Newsletter

La circulaire, les sujets, la méthode — dans votre boîte mail

Deux parcours distincts : formateur (ressources de classe, décryptage de la circulaire) ou étudiant (révisions, sujets corrigés). Zéro spam, désinscription en un clic.

En vous inscrivant, vous acceptez de recevoir nos emails. Désinscription à tout moment.

Robin Richard, EP Studly

Robin Richard

Co-fondateur d’EP Studly

07 43 39 76 98robin@epdigital.fr

Contactez nous pour obtenir une démo, une demande de devis ou de support.

Vos informations servent uniquement à traiter votre demande et sont conservées trois ans après notre dernier échange. Détail dans notre politique de confidentialité

Un membre de notre équipe vous recontacte sous 24 h