Comment ajouter un reCaptcha à Contact Form 7 dans WordPress ?

Par Baptiste Pagès le 18 janvier 2021
Mis à jour le 18 janvier 2021
Votre site WordPress manque de visibilité ?
J'analyse votre SEO

Contact Form 7 est un fantastique plugin de formulaires pour WordPress. Mais comme tout formulaire, il peut être la cible de spams et de messages mal intentionnés envoyés par des programmes. Aujourd'hui, je vais vous montrer comment régler ce problème en ajoutant un recaptcha à vos formulaires Contact Form 7 👍

Étape 1 - Créer la page de contact

Dans ce tutoriel je ne vous expliquerai pas comment utiliser Contact Form 7. On va donc simplement commencer par créer une page de contact sur laquelle nous allons insérer un formulaire soit au moyen d'un bloc comme ci-dessous, soit au moyen d'un shortcode.

Ensuite, nous allons publier cette page et cliquer sur "Voir la page". Comme vous pouvez le constater ci-dessous, pour l'instant c'est le formulaire de contact par défaut, et il n'y a pas de captcha.

Une page de contact super simple, sans captcha.

Étape 2 : installer Advanced noCaptcha & invisible Captcha

Pour ajouter un captcha à notre formulaire, nous allons maintenant installer le plugin Advanced noCaptcha & invisible Captcha.

Ensuite, il va falloir faire quelques réglages. Cliquez sur "Advanced nocaptcha" dans le menu vertical de WordPress, dans "Réglages".

Vous allez maintenant arriver sur la page des réglages de ce plugin et pourrez y trouver un lien "Google" sur lequel vous devez cliquer.

Une fois que vous êtes connecté à votre compte Google, vous devriez arriver sur la page Googe reCaptcha, avec le haut de page suivant :

Cliquez sur le "+" à droite pour obtenir vos clés de reCaptcha.

Il faut maintenant remplir le formulaire correctement. Le seul champ important ici, c'est les domaines. Vous devez y mettre l'adresse de votre site.

Dans ce tuto, je vous montre comment faire un reCaptcha classique, donc le version 2 type case à cocher. Cliquez sur envoyer, et vous obtiendrez les clés dont vous avez besoin.

Retournez maintenant sur votre site, dans les paramètres du plugin, et copiez-collez les clés dans les champs correspondant. "Clé du site" va dans "Site Key" et "Clé secrète" dans "Secret Key".

Enregistrez les changements (bouton en bas de l'écran). Et voilà ! Le reCaptcha v2 est disponible sur votre site. En route pour la dernière étape...

Étape 3 : ajouter le reCaptcha dans le formulaire Contact Form 7

Pour intégrer le reCaptcha dans CF7, le plugin advanced noCaptcha nous propose un shortcode qu'on peut trouver à cette adresse.

[anr_nocaptcha g-recaptcha-response]

Il va falloir insérer ce shortcode dans le formulaire. Pour ça, ouvrez le formulaire en question en allant dans "Contact" puis en sélectionnant le formulaire souhaité.

Dans le formulaire, ajoutez maintenant le shortcode avant le bouton d'envoi.

N'oubliez pas d'enregistrer le formulaire, et le tour est joué ! En retournant sur la page de contact, on voit un nouveau bouton "Je ne suis pas un robot". Votre formulaire est protégé 🥳

Conclusion

Merci d'avoir lu cet article, j'espère qu'il vous aidera si vous rencontrez des problèmes de spam avec Contact Form 7. Si vous avez du mal avec votre site n'hésitez pas à faire appel à moi ou à un confrère, c'est souvent mieux d'être accompagné par un pro !

Cet article vous a plu ?

Voici d'autres articles populaires qui vous intéresseront peut-être :
SEO
Les bases du Référencement Organique
Apprenez les bases du référencement organique afin d'éviter les erreurs de débutant.
Lire cet article
DESIGN
Comment changer la police d'un site WordPress ?
Tout ce qu'il faut savoir pour gérer la typographie de votre site WordPress est ici, suivez le guide !
Lire cet article
CODE
Comment ajouter du CSS additionnel dans WordPress ?
Découvrez comment ajouter facilement du code CSS additionnel dans n'importe quel site WordPress.
Lire cet article
WOOCOMMERCE
Comment importer des produits dans WooCommerce ?
Apprenez à importer des produits à votre boutique WooCommerce très facilement (en vidéo).
Lire cet article
Je m'appelle Baptiste et je suis un webdesigner / consultant SEO spécialisé dans WordPress, basé à Grasse dans le Sud de la France. J'aide les petites entreprises à développer leur présence web dans ce monde de fou 😉
menu-circlecross-circle