Captcha in newsletter module

[tomputer]

Hello!

I am looking for any solution to integrate recaptcha with default prestashop block_newsletter module.

I am using Prestashop 1.6.1.2.

Now the module is  hooked to my front page and is sending a lot of spam and many uncorrect emials are added to database!

 

 

[freelex]

Same issue

[chafox]

Same issue...

Did you find any solution for this problem ?

[jetway]

As i understand you want to add recaptcha to your Newsletter registration? Whenever someone inputs an email address before registering it you want recaptcha to appear?

[tomputer]

I ran slidecaptcha on newsletter module on my site after few modifications.

 

I am sure that is not a clean solution but it's work!

 

At first I add manual code in top of my theme footer.tpl file

 

<link rel="stylesheet" href="http://mydomainname/modules/slidecaptcha/views/css/QapTcha.jquery.css" type="text/css" />
<script type="text/javascript" src="http://mydomainname/modules/slidecaptcha/views/js/jquery-ui.js"></script>
<script type="text/javascript" src="http://mydomainname/modules/slidecaptcha/views/js/jquery.ui.touch.js"></script>
<script type="text/javascript" src="http://mydomainname/modules/slidecaptcha/views/js/QapTcha.jquery.js"></script> 

 

 

next I copied slidecaptcha module code to bottom of my footer.tpl file

<script type="text/javascript">
$(document).ready(function(){
    // Simple call
    {if $submitsc =='true'}
        $('.submitMessage, #submitMessage,.contact-form-box .submit').css('display','none');
        {/if}
    // More complex call
    $('.QapTcha').QapTcha({
    autoSubmit : {$submitsc},        
        disabledSubmit : true,
    autoRevert : true,
txtLock    : "{l s='Form Locked, slide to unlock' mod='slidecaptcha'|strip_tags:'UTF-8'}",
txtUnlock  : "{l s='Form Unlocked' mod='slidecaptcha'|strip_tags:'UTF-8'}",
    PHPfile    : "/modules/slidecaptcha/php/Qaptcha.jquery.php"
    });
  });
</script>

The slidecaptcha module is hooked to footer!

 

And finally I add this code to blocknewsletter.tpl

 {include file="$tpl_dir./../../modules/slidecaptcha/views/templates/front/slidecaptcha.tpl"}

I know that this solution is weak  but i can't find other solution! 

Edited April 28, 2017 by tomputer (see edit history)

[franky.martin]

I also need to add a captcha en newsletter module in prestashop 1.7 because I have a lot of email spam every day. Any help?

[Knowband Plugins]

There are many module on the addons for the reCaptcha. You can contact the module developer to check if they have covered the newsletter as well in the recaptcha. 

(I believe most the recaptcha covers login/registration/contact us page so you need to check the developer to newsletter section).

 

 

[franky.martin]

En 2/4/2020 a las 5:13 PM, Knowband Plugins dijo:

There are many module on the addons for the reCaptcha. You can contact the module developer to check if they have covered the newsletter as well in the recaptcha. 

(I believe most the recaptcha covers login/registration/contact us page so you need to check the developer to newsletter section).

 

 

I think the recaptcha must be active for default in prestashop to avoid spam problems. We have to pay for basic things :-(

[Guest]

.

Edited July 26, 2021 by Guest (see edit history)

[Guest]

.

Edited July 26, 2021 by Guest (see edit history)

[RisoCorbetta]

On 4/15/2020 at 5:23 PM, Guest said:

No problem and add recaptcha to templates and modules.
Always put before the button code:

<div class="g-recaptcha" data-sitekey="you google key" style="margin-bottom: 10px; margin-top: 12px;"></div>
<button .....

And add the code to the ./themes/your theme name/templates/_partials/head.tpl file at the very bottom:

<script src="https://www.google.com/recaptcha/api.js" async defer></script>

 

 

On 4/15/2020 at 5:29 PM, Guest said:

You can create multiple keys on Google.
And to give each module or page a different key.

Could you kindly give me a few more pointers on how to do this?

I'm setting up my self-taught shop, I like to learn and get by, I also think it would be useful for everyone

For example, when you say to put the first code before the button, do you mean (referring to the newsletter form) to put it before the newsletter subscription button?

Thanks

[Isaul]

On 4/15/2020 at 10:23 AM, Guest said:

No problem and add recaptcha to templates and modules.
Always put before the button code:

<div class="g-recaptcha" data-sitekey="you google key" style="margin-bottom: 10px; margin-top: 12px;"></div>
<button .....

And add the code to the ./themes/your theme name/templates/_partials/head.tpl file at the very bottom:

<script src="https://www.google.com/recaptcha/api.js" async defer></script>

 

Hello,

I am trying to implement this solution, I already pasted the recaptcha script in the head section, that's a no brainer. But when I tried pasting the above class into the button, it's not working as expected.

Here's what I'm trying so far. Lines 9-11 and 18-20.

<div class="block_newsletter">
  <div class="row">
    <h4 class="sub_heading title"><span class="news1">{l s='Get our latest news and special sales' d='Shop.Theme'}</span></h4>
    <div class="block_content">
      <form action="{$urls.pages.index}#footer" method="post">
          <div class="newsletter-form">
            <input
              class="btn btn-primary pull-xs-right hidden-xs-down"
              class="g-recaptcha"
              data-sitekey="mypublickey"
              data-callback='onSubmit'
              name="submitNewsletter"
              type="submit"
              value="{l s='Subscribe' d='Shop.Theme.Actions'}"
            >
            <input
              class="btn btn-primary pull-xs-right hidden-sm-up"
              class="g-recaptcha"
              data-sitekey="mypublickey"
              data-callback='onSubmit'
              name="submitNewsletter"
              type="submit"
              value="{l s='OK' d='Shop.Theme.Actions'}"
            >
            <div class="input-wrapper">
              <input
                name="email"
                type="text"
                value="{$value}"
                placeholder="{l s='Your email address' d='Shop.Forms.Labels'}"
              >
            </div>
            <input type="hidden" name="action" value="0">
            <div class="clearfix"></div>
          </div>
          {if $msg}
			<p class="alert {if $nw_error}alert-danger{else}alert-success{/if}">
			  {$msg}
			</p>
		  {/if}
		  <div class="newsletter-message">
              {if $conditions}
                <p>{$conditions}</p>
              {/if}
          </div>
      </form>
    </div>
  </div>
</div>

** 'mypublickey' was replaced.

I believe my template has two inputs because it's one for mobile and one for desktop. But besides that, is the above solution correct? Can you give some pointers?

Edited June 4, 2020 by Isaul
gammar and typos (see edit history)

[Guest]

.

Edited July 26, 2021 by Guest (see edit history)

[Isaul]

Thank you for responding.

I already tried that, but still it didn't stop me from hitting the subscribe button and getting the 'verification email has been sent'. It shouldn't let me hit the 'Subscribe' button unless I pass the 'I'm not a robot' check. No?

I was looking at Google documentation, and as far as I can understand, I'm still not getting the user’s response token.

This is how it is implemented.

		<form action="{$urls.pages.index}#footer" method="post">
          <div class="newsletter-form">
          	<div class="g-recaptcha" data-sitekey="*********-************" style="margin-bottom: 10px; margin-top: 12px;"></div>
            <input
              class="btn btn-primary pull-xs-right hidden-xs-down"
              name="submitNewsletter"
              type="submit"
              value="{l s='Subscribe' d='Shop.Theme.Actions'}"
            >
            <input
              class="btn btn-primary pull-xs-right hidden-sm-up"
              name="submitNewsletter"
              type="submit"
              value="{l s='OK' d='Shop.Theme.Actions'}"
            >
            <div class="input-wrapper">
              <input
                name="email"
                type="text"
                value="{$value}"
                placeholder="{l s='Your email address' d='Shop.Forms.Labels'}"
              >
            </div>
            <input type="hidden" name="action" value="0">
            <div class="clearfix"></div>
          </div>
          {if $msg}
			<p class="alert {if $nw_error}alert-danger{else}alert-success{/if}">
			  {$msg}
			</p>
		  {/if}
		  <div class="newsletter-message">
              {if $conditions}
                <p>{$conditions}</p>
              {/if}
          </div>
		</form>

And this is how it was implemented on the end of 'head.tpl' file.

<head>
  ......
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
     <script>
       function onSubmit(token) {
         document.getElementById("newsletter-form").submit();
       }
     </script>    
  </head>

 

[RisoCorbetta]

Thanks for the help, I was able to add the box and it seems to work, only I have a problem.

It's not blocking my newsletter subscription button.
It doesn't matter if you tick the captcha box or not.

 

 

[num47]

Anyone got any solution yet? This is really vital because hackers can easily target this. And, yes, this feature should be default to any kind of eCommerce software. Protection from hacking is very basic now a days. 

[mmontero2]

I found this free module that works fine on my website: Releases · nenes25/eicaptcha (github.com)

In this websites you can get more information about this module:

ᐈSolucionar SPAM Prestashop / Instalar reCAPTCHA Google Prestashop (tiendaonlinemurcia.es)

Module Catpcha pour prestashop 1.7 | Hervé Hennes (h-hennes.fr)