IL MANQUE LES IMAGES DE CET ARTICLE POUR L’INSTANT /!\
Avez-vous un site web qui tourne sous WordPress ? Il est évident que vous souhaitiez être contacté par vos visiteurs via la « page de contact » de votre site. Pour cela, vous devez installer un plugin de formulaire de contact. Aucune idée sur la marche à suivre pour intégrer le formulaire ? Pas de souci, suivez simplement ces différentes étapes pour l’installation et la configuration du formulaire et recevez les messages directement dans votre boite messagerie.
Quel formulaire de contact choisir ?
Il existe une panoplie de plugins de formulaire de contact, mais nous allons ici faire le choix sur Contact Form 7, l’un des plugins les plus utilisés sur WordPress. Son principal avantage est sa facilité de prise, pas besoin d’être expert pour créer son formulaire, l’intégrer aux différentes pages et articles et la cerise sur le gâteau, il est en français.
Nous allons vous montrer où télécharger le formulaire, comment ajouter un simple formulaire de contact sur votre site et comment le paramétrer, le tout pas à pas.
Comment installer Contact Form 7 ?
Dans ce tutoriel, nous utilisons la dernière version à ce jour de Contact Form 7 : 4.3.1
-
Téléchargement
Vous avez deux possibilités pour télécharger le plugin Contact Form :
-
Soit à partir de la plateforme WordPress en français à cette adresse : https://fr.wordpress.org/plugins/contact-form-7/. Ensuite, il faudra se rendre dans la page des extensions, puis cliquez sur « ajouter » ensuite « Mettre une extension en ligne ». Choisissez maintenant votre fichier joint pour l’installer.
-
Soit directement sur votre tableau de bord en suivant ces étapes :
Cliquez sur l’onglet « Extensions », puis sur « Ajouter » tout en haut et à gauche de la fenêtre. (Constatez que sur cette capture d’écran, on voit déjà le module Contact Form 7 puisqu’il était déjà installé, mais vous ne le verrez pas sur la liste des extensions)
Dans la barre de recherche (en haut et à droite de l’écran), entrez « Contact Form 7 ». Le module va s’afficher, vous pouvez alors cliquer sur « Installer maintenant ». Pensez également à activer le module dans l’onglet « Extensions ».
Vous devez ensuite configurer l’email de destinataire c’est-à-dire l’émail vers lequel le message doit être envoyé. Regardons chaque champ de l’onglet « Email ».
« To » : L’email vers lequel le message doit être envoyé autrement dit votre propre email.
« From » : Il s’agit de l’email de l’expéditeur qui est récupéré à partir du champ de l’email du formulaire ainsi que son nom par les marqueurs : [your-name] [your-email].
« Sujet » : L’objet ou le sujet du message indiqué par l’expéditeur grâce au marqueur [your-subject].
« Additionnal Headers » (Entêtes supplémentaires) : ce champ indique l’email auquel doit être envoyée une copie du message reçu. Vous pouvez laisser le marqueur Reply-To: [your-email] tel quel. Une copie sera envoyée à celui qui vous a contacté.
« Message Body » : il indique le message que vous allez recevoir à email.
Cochez ensuite « Envoyer cet email au format HTML »
« File Attachements » (pièce-jointe) : Si vous comptez recevoir les pièces jointes de vos expéditeurs, il faudra renseigner le marqueur de ce champ. Dans notre exemple : [file file-474 limit:20 filetypes:.doc|.docx|.zip|.pdf|.xls|.xlsx]
En clair, vous acceptez une limite de taille de 20 Mo et les types de fichiers suivants : .doc, .dox, .zip, .pdf, .xls, .xlsx
Dans l’onglet « Message », vous avez les différents messages affichés lors de la réussite ou de l’échec. Vous pouvez à loisir les modifier.
Intégration du formulaire dans une page de contact
Sauvegarder le tout en cliquant sur le bouton « Sauvegarder »
Rentrez dans le tableau de bord et cliquez sur l’onglet « Contact » pour afficher cette fenêtre :
Copiez tout le code qui se trouve en dessous de Shortcode et recopiez dans une page.
Et pour finir, voici notre formulaire achevé. N’est pas beau ?
