{"id":2259,"date":"2021-03-15T09:59:38","date_gmt":"2021-03-15T07:59:38","guid":{"rendered":"https:\/\/www.h-hennes.fr\/blog\/?p=2259"},"modified":"2021-04-24T15:05:29","modified_gmt":"2021-04-24T13:05:29","slug":"prestashop-ajouter-un-captcha-sur-linscription-a-la-newsletter","status":"publish","type":"post","link":"https:\/\/www.h-hennes.fr\/blog\/2021\/03\/15\/prestashop-ajouter-un-captcha-sur-linscription-a-la-newsletter\/","title":{"rendered":"Prestashop : Ajouter un captcha sur l&rsquo;inscription \u00e0 la newsletter"},"content":{"rendered":"\n<p>Ces derniers mois ( voir depuis plus longtemps :\/ ) les spams se sont attaqu\u00e9s en masse au formulaire d&rsquo;inscription \u00e0 la newsletter sur Prestashop.<br \/><br \/>J&rsquo;ai d\u00e9j\u00e0 fait un module de captcha qui permets de r\u00e9gler le probl\u00e8me des spams sur le formulaire de contact et la cr\u00e9ation des clients depuis plusieurs ann\u00e9es.<br \/>La demande de pouvoir rajouter un captcha sur la newsletter \u00e9tait d\u00e9j\u00e0 r\u00e9currente, mais il n&rsquo;y avais pas de solution simple et rapide pour le mettre en place.<br \/><br \/>La bonne nouvelle est que depuis la sortie de la version 2.6.0 du module <strong>ps_emailsubscription<\/strong> gr\u00e2ce \u00e0 une pull request de l&rsquo;in\u00e9vitable Jean-Fran\u00e7ois Viguier ( https:\/\/github.com\/PrestaShop\/ps_emailsubscription\/pull\/49\/files )<br \/><br \/>Il est possible via des nouveaux hooks d&rsquo;impl\u00e9menter facilement un captcha sur l&rsquo;inscription newsletter.<br \/><br \/>Le hook \u00e0 utiliser est <strong>displayNewsletterRegistration <\/strong>et il est impl\u00e9ment\u00e9 dans le fichier <em>modules\/ps_emailsubscription\/views\/templates\/hook\/ps_emailsubscription.tpl<\/em><\/p>\n\n\n\n<pre lang=\"smarty\" escaped=\"true\">\n<div class=\"email_subscription block_newsletter\" id=\"blockEmailSubscription_{$hookName}\">\n  <h4>{l s='Newsletter' d='Modules.Emailsubscription.Shop'}<\/h4>\n  {if $msg}\n    <p class=\"notification {if $nw_error}notification-error{else}notification-success{\/if}\">{$msg}<\/p>\n  {\/if}\n  <form action=\"{$urls.current_url}#blockEmailSubscription_{$hookName}\" method=\"post\">\n    <input type=\"text\" name=\"email\" value=\"{$value}\" placeholder=\"{l s='Your e-mail' d='Modules.Emailsubscription.Shop'}\" \/>\n    {if $conditions}\n      <p>{$conditions nofilter}<\/p>\n    {\/if}\n    {hook h='displayNewsletterRegistration'}{* Le nouveau hook est ici *}\n    <input type=\"hidden\" value=\"{$hookName}\" name=\"blockHookName\" \/>\n    <input type=\"submit\" value=\"ok\" name=\"submitNewsletter\" \/>\n    {hook h='displayGDPRConsent' id_module=$id_module}\n    <input type=\"hidden\" name=\"action\" value=\"0\" \/>\n  <\/form>\n<\/div>\n\n<\/pre>\n\n\n\n<p>J&rsquo;ai donc mis \u00e0 jour mon module <strong>eicaptcha<\/strong> pour utiliser ces nouveaux hooks et impl\u00e9menter la v\u00e9rification du captcha sur le formulaire d&rsquo;inscription \u00e0 la newsletter.<br \/>C&rsquo;est donc le cas \u00e0 partir de la version<strong> 2.1.0<\/strong> qui est sortie aujourd&rsquo;hui.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/captcha-newsletter.png\"><img loading=\"lazy\" decoding=\"async\" width=\"646\" height=\"364\" src=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/captcha-newsletter.png\" alt=\"Affichage captcha sur la newsletter\" class=\"wp-image-2258\" srcset=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/captcha-newsletter.png 646w, https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/captcha-newsletter-300x169.png 300w\" sizes=\"auto, (max-width: 646px) 100vw, 646px\" \/><\/a><figcaption>Affichage captcha sur la newsletter<\/figcaption><\/figure>\n\n\n\n<p>En revanche ce qui est un peu plus emb\u00eatant c&rsquo;est que le hook n&rsquo;est pas pr\u00e9sent nativement dans le th\u00e8me classic ( ni sans doute dans une majorit\u00e9 de th\u00e8me )<br \/>Il sera donc n\u00e9cessaire pour une majorit\u00e9 d&rsquo;entre vous d&rsquo;ajouter manuellement le code suivant dans le fichier<em> themes\/votretheme\/modules\/ps_emailsubscription\/views\/templates\/hook\/ps_emailsubscription.tpl <\/em><br \/>\u00e0 l&rsquo;endroit ou vous souhaitez afficher le captcha et <strong>\u00e0 l&rsquo;int\u00e9rieur du form<\/strong><\/p>\n\n\n\n<pre lang=\"smarty\" escaped=\"true\">\n{hook h='displayNewsletterRegistration'}\n<\/pre>\n\n\n\n<p>Afin d&rsquo;\u00e9viter trop de retours et de permettre aux utilisateurs du module d&rsquo;avoir des informations si la v\u00e9rification ne fonctionne pas j&rsquo;ai \u00e9galement optimis\u00e9 le mode debug du module afin d&rsquo;afficher ces informations.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"239\" src=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3-1024x239.png\" alt=\"Debug captcha newsletter\" class=\"wp-image-2261\" srcset=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3-1024x239.png 1024w, https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3-300x70.png 300w, https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3-768x179.png 768w, https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2021\/03\/image-3.png 1101w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Debug captcha newsletter<\/figcaption><\/figure>\n\n\n\n<p>Vous pouvez d\u00e8s \u00e0 pr\u00e9sent t\u00e9l\u00e9charger la nouvelle version 2.1.0 du module depuis la page des releases\u00a0 de github <a href=\"https:\/\/github.com\/nenes25\/eicaptcha\/releases\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/nenes25\/eicaptcha\/releases<\/a><\/p>\n<p>En cas de probl\u00e8mes n&rsquo;h\u00e9sitez pas \u00e0 ouvrir des issues sur github \u00e9galement.<br \/>A compter d&rsquo;aujourd&rsquo;hui le spam devrait donc drastiquement\u00a0 r\u00e9duire \u00e9galement sur vos formulaires d&rsquo;inscription \u00e0 la newsletter \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ces derniers mois ( voir depuis plus longtemps :\/ ) les spams se sont attaqu\u00e9s en masse au formulaire d&rsquo;inscription \u00e0 la newsletter sur Prestashop. J&rsquo;ai d\u00e9j\u00e0 fait un module de captcha qui permets de r\u00e9gler le probl\u00e8me des spams sur le formulaire de contact et la cr\u00e9ation des clients depuis plusieurs ann\u00e9es.La demande de [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[245],"tags":[260,567,104],"class_list":["post-2259","post","type-post","status-publish","format-standard","hentry","category-prestashop-2","tag-captcha","tag-newsletter","tag-prestashop","prestashop-1-6","prestashop-1-7","prestashop-1-7-6","prestashop-1-7-7","prestashop-1-7-8","prestashop-8-1"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/2259","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/comments?post=2259"}],"version-history":[{"count":2,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/2259\/revisions"}],"predecessor-version":[{"id":2262,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/2259\/revisions\/2262"}],"wp:attachment":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/media?parent=2259"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/categories?post=2259"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/tags?post=2259"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}