Prestashop : Ajouter un captcha sur l’inscription à la newsletter

Ce tutoriel est compatible avec les versions de Prestashop suivantes :
1.6 1.7 1.7.6 1.7.7 1.7.8 +
Cet article est assez ancien, malgré toute l'attention que j' apporte à mes contenus il est possible que celui-ci ne soit plus d'actualité.
N'hésitez pas à me le signaler si nécessaire via le formulaire de contact.

Ces derniers mois ( voir depuis plus longtemps :/ ) les spams se sont attaqués en masse au formulaire d’inscription à la newsletter sur Prestashop.

J’ai déjà fait un module de captcha qui permets de régler le problème des spams sur le formulaire de contact et la création des clients depuis plusieurs années.
La demande de pouvoir rajouter un captcha sur la newsletter était déjà récurrente, mais il n’y avais pas de solution simple et rapide pour le mettre en place.

La bonne nouvelle est que depuis la sortie de la version 2.6.0 du module ps_emailsubscription grâce à une pull request de l’inévitable Jean-François Viguier ( https://github.com/PrestaShop/ps_emailsubscription/pull/49/files )

Il est possible via des nouveaux hooks d’implémenter facilement un captcha sur l’inscription newsletter.

Le hook à utiliser est displayNewsletterRegistration et il est implémenté dans le fichier modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription.tpl

<div class="email_subscription block_newsletter" id="blockEmailSubscription_{$hookName}">
  <h4>{l s='Newsletter' d='Modules.Emailsubscription.Shop'}</h4>
  {if $msg}
    <p class="notification {if $nw_error}notification-error{else}notification-success{/if}">{$msg}</p>
  {/if}
  <form action="{$urls.current_url}#blockEmailSubscription_{$hookName}" method="post">
    <input type="text" name="email" value="{$value}" placeholder="{l s='Your e-mail' d='Modules.Emailsubscription.Shop'}" />
    {if $conditions}
      <p>{$conditions nofilter}</p>
    {/if}
    {hook h='displayNewsletterRegistration'}{* Le nouveau hook est ici *}
    <input type="hidden" value="{$hookName}" name="blockHookName" />
    <input type="submit" value="ok" name="submitNewsletter" />
    {hook h='displayGDPRConsent' id_module=$id_module}
    <input type="hidden" name="action" value="0" />
  </form>
</div>

J’ai donc mis à jour mon module eicaptcha pour utiliser ces nouveaux hooks et implémenter la vérification du captcha sur le formulaire d’inscription à la newsletter.
C’est donc le cas à partir de la version 2.1.0 qui est sortie aujourd’hui.

Affichage captcha sur la newsletter
Affichage captcha sur la newsletter

En revanche ce qui est un peu plus embêtant c’est que le hook n’est pas présent nativement dans le thème classic ( ni sans doute dans une majorité de thème )
Il sera donc nécessaire pour une majorité d’entre vous d’ajouter manuellement le code suivant dans le fichier themes/votretheme/modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription.tpl
à l’endroit ou vous souhaitez afficher le captcha et à l’intérieur du form

{hook h='displayNewsletterRegistration'}

Afin d’éviter trop de retours et de permettre aux utilisateurs du module d’avoir des informations si la vérification ne fonctionne pas j’ai également optimisé le mode debug du module afin d’afficher ces informations.

Debug captcha newsletter
Debug captcha newsletter

Vous pouvez dès à présent télécharger la nouvelle version 2.1.0 du module depuis la page des releases  de github https://github.com/nenes25/eicaptcha/releases

En cas de problèmes n’hésitez pas à ouvrir des issues sur github également.
A compter d’aujourd’hui le spam devrait donc drastiquement  réduire également sur vos formulaires d’inscription à la newsletter 🙂

14 réflexions sur “Prestashop : Ajouter un captcha sur l’inscription à la newsletter”

  1. Thank you so much for this. I had been struggling with Newsletter spams for some time now. However, no spams for the past 20 hours since I installed this. Thank you.

  2. bonjour
    Merci pour ces explications. Une petite question svp.
    Vous dites qu’il faut ajouter le hook dans le fichier ps_emailsubscription.tpl à l’endroit ou vous souhaitez afficher le captcha et à l’intérieur du form.
    Il faut donc ajouter la déclaration du hook à deux endroits différents ?
    merci
    Christophe

  3. Bonjour Hervé,
    Merci pour ce tuto. Mon site vient d’être attaqué par des inscriptions à la newsletter en masse.
    Par contre, j’ai installé la dernière version de ton super module (merci) , la version 2.1.1 mais le captcha n’apparaît pas. Il y a bien le message « merci de valider le captcha ».
    j’ai pourtant inséré le code
    {hook h=’displayNewsletterRegistration’}
    dans le fichier que tu as indiqué. Je n’ai peut-être pas bien compris les étapes à suivre.
    Merci d’avance de ton aide

    1. Bonjour Marilyne,

      Est-ce que tu as bien vidé ton cache après avoir appliqué la modification ?
      Pour vérifier que c’est bien le bon template qui a été modifié tu peux ajouter un texte à côté et vérifier si il s’affiche bien.
      genre

      TEST

      Cordialement,
      Hervé

  4. Bonjour,

    J’ai bien fait la modification dans le fichier demandé : modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription.tpl

    j’y ai mis : ceci la ou le texte devenait différent :

    { if $ conditions}
    { $ conditions nofilter }
    { / if }
    { hook h = ‘displayNewsletterRegistration’ } {* Le nouveau hook est ici *}

    { hook h = ‘displayGDPRConsent’ id_module = $ id_module }

    j’ai bien transféré mon fichier.. mais cela ne fait rien.

    J’ai essayé de télécharger votre module sur mon prestashop mais cela ne fonctionne pas.

    Qu’est ce que je fais de mal ?

    En vous remerciant.

    1. Bonjour Mélanie,
      Est-ce que vous avez vérifié que vous avez bien édité le bon fichier et que c’est celui qui est utilisé à l’affichage ?
      ( Il suffit de mettre un texte de test dedans pour vérifier )
      Attention à bien vider le cache également ensuite.
      C’est bien dans votre thème que vous avez fait la modification ? et pas directement dans le fichier du module ( votre message n’est pas très clair sur ce point )

      Cordialement,
      Hervé

  5. Bonsoir. J’ai eu la version 2.0.6 installée jusqu’à présent que j’ai installé la version 2.3.1 avec RECAPTCHA V3, en l’ajoutant à l’abonnement à la newsletter. Cela fonctionne parfaitement à 1,7.6.9. J’ai caché la reCAPTCHA avec CSS

    Je veux vous préciser pour votre travail bien fait.

    Je tiens à vous demander s’il serait nécessaire de l’ajouter au formulaire « Guest-Tracking », car ils sont des données qui ne seront pas enregistrées dans la base de données.
    Désolé pour la langue. J’utilise le traducteur de Google

    1. Bonjour Juan,
      Merci pour votre retour.
      Pour demander des évolutions du modules n’hésitez pas à aller le faire directement sur github.
      ( Vous pouvez le faire en anglais )

      Cordialement,
      Hervé

  6. Bonjour, un GRRRAANNNND merci pour le partage de votre travail, bien utile pour des « novices autodidactes » comme moi ! 🙂
    Effectivement, après avoir modifié le fichier « ps_emailsubscription.tpl », ne pas oublier de vider le cache, mais aussi de mettre OUI sur l’option « activer le captcha sur l’inscription à la newsletter » dans le module, et éventuellement de vérifier dans « Apparences/Positions » que EiCaptcha est bien au point d’acccroche « displayNewsletterRegistration ».

    Voilà quelques remarques qui peuvent paraître simples, mais peuvent peut-être éviter des prises de têtes à certaines personnes..

    Effectivement le point négatif c’est que le bloc est un peu moche. :/ mais au moins ça fonctionne !

    Cordialement, Laëtitia.

Répondre à herve Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *