Adding Google reCaptcha v3 to the Shopify contact form

Highlighted
Excursionist
14 0 11

It might be slightly working. There were a few hours over the weekend were 2-3 new accounts per hour, but other than that, they are spreading out the time between account creations.

 

@kmoney52 
Those types of plugins do not fix the problem, just reduce it a little. I can tell you that no site has ever stopped me from saving an image if I needed it for reference or research use. It just stops the person that doesn't know how to use the computer. Some of those apps also need server side protocols which shopify does not give. As a result, images are no longer hosted on shopify, they are on the apps servers. That can be a danger if they close (and break all images on your site).

Fine Art Landscapes - Sawusch Photography - USScenics.com
0 Likes
Excursionist
23 0 14

Since installing this recaptcha I've seen spam emails from my contact form decrease somewhat, but a lot still come through.  Now they're mostly emails saying they want to know where they can "download the software from your site to solve captchas" ironically enough.  

 

Bottom line: This helps, but it absolutely does NOT stop spammers completely.

0 Likes
New Member
1 0 0

Hi there :)

 

Does anyone know how to add reCaptcha V3 to OUT OF THE SANDBOX's Responsive 5.2 theme, as I tried adding it to the contact form via the liquid code, but it did not work? I've been getting spam from bots to my contact form and also my blog comments, and really want t solve this in both places?

 

Can anyone let me know how to do this for this theme, and specifically where to place the Google generated code in the theme code?

 

It would be great to be able to add this to Blog Commenting too if anyone knows how to do this as well.

 

Thanks, guys!!!

 

Elle

0 Likes
New Member
1 0 0

Hi

I followed the advice and was able to insert the code, changing the action to my contact page, and the key to my actual keys, but I only see the recaptcha, not the actual box to check if not a robot. Do I have to disable the submit button or any other actions?

Here is a screen grab of what I see - https://share.getcloudapp.com/nOuWn0K4

 

Any ideas?

0 Likes
Tourist
14 0 2

Works like a charm thank you. I still can't believe that such a basic feature isn't there by default in any shopify plan.

 

Confirm that it is enough to put the code on the top of "templatename".liquid file. i tried it with login, register and so one. works. If it doesn't work try to clean your cache of browser and reload your page.

0 Likes
Tourist
4 0 1

I'm also reluctant to use a 3rd party app, because some bot has spammed me with bogus Customer Registrations and comments to my blogs or newsletter signups. I'm opposed to it in part because by having to subscribe a monthly fee to a third party app, gives the bots a victory. They may not be getting money directly, but they're forcing me to pay to keep them at bay... something I'm not willing to do.

 

I am using the Supply theme on my Shopify site, and tried the various methods described throughout this thread. None of them were successful until I did the following: I only pasted the first script into the "theme.liquid" layout at the very top of the coding area, being careful to substitute my site key where it says "render=recaptcha_key" (which I *think* is what is considered the "token" that is referenced in the second script).

 

I pasted the first AND second script without changing the "recaptcha_key" or anything else in the following elements: Under "Templates:" blog.liquid, customers/activate_account.liquid, customers/register.liquid, page.contact-liquid. In the "Sections:" section, I also copied the second script without changing the "recaptcha_key" or anything else in the element titled newsletter.liquid. I called a Shopify Guru to test it out, and she reported that the reCAPTCHA box appears whenever she signed up, in every location that I mentioned.

 

Perhaps something has changed with reCAPTCHA v3 since the original post of almost a year ago. I don't know. So far, I haven't gotten any further bogus sign-ups/registrations from bots, so I am optimistic that the way I set things up will be working from this point forward. I'll let everyone know if I continue to have issues, though. Here are some screenshots that show how I set the 2 separate scripts up:

 This is what I put into the theme.liquid coded file:

reCAPTCHAv3 code_theme.liquid page.png

 

 

 

 

 

 

 

 

 

 

 

 

 

Then I put the following into each of the other coded elements I listed above:reCAPTCHAv3 code for customer_registration page.png

 

 

 

 

 

 

 

 

 

I hope that this works for anyone else who may have been confused by the various methods that were outlined over the past year or so... As is Google's custom, things seemed a bit overcomplicated and confusing in how they phrased things "load your site key" for example, instead of "insert your site key" where it says "_reCAPTCHA_site_key_".

 

I'm keeping my fingers crossed that this is the "fix" I've been looking for!!

1 Like
Tourist
4 0 1

I believe the "secret key" is the "token" that Google uses in the background to verify your domain/website. It is somehow linked to the "site key" that was generated and that you used to replace the "_reCAPTCHA_site_key_" area. It takes that code and finds the "secret key" that it corresponds to and verifies that it's coming from your website. Then it generates the reCAPTCHA dialogue box as appropriate...

0 Likes
New Member
1 0 0

@Daniel_Bogdan thanks so much for sharing this, I gave it a try yesterday on my customer registration and got it to work! Sadly I came into the office this morning and saw that two random bots had registered with gibberish as first / last names again... I went to try the registration myself and sure enough the captcha is not working for some reason. I believe I have everything set up correctly, I have no idea why it would work yesterday and not today. Yesterday, after I clicked "register" it would take me to the captcha page to do the challenge. After that it would finish the registration. Now it just lets you through without the captcha whatsoever.

 

Here's my setup: 

 

1st script in theme.liquid

Screen Shot 2019-11-07 at 10.02.50 AM.png

 

2nd script in customers/register.liquid

Screen Shot 2019-11-07 at 10.03.24 AM.png

 

It's also worth noting that in my Google reCAPTCHA admin it's showing that I've had 48 total requests, this doesn't seem right either as I've only tested it a handful of times (maybe 10 total) and we've received probably 5 registrations since I implemented this, including the recent bot registrations. 

Screen Shot 2019-11-07 at 10.05.17 AM.png

 

Does anyone have any idea what may be causing this?? Thanks so much

0 Likes
Tourist
4 0 1

Well... "the best laid plans of mice and men oft do go astray..." as the saying goes. Although the method I outlined appeared to work correctly when the Shopify Guru tested it, now it apparently no longer does. I was initially free of bogus sign-ups, but over the past few days, it has started again... Grr!! I'm not certain why reCAPTCHA v3 seems to be either not submitting a challenge at all, or letting sign-ups occur even if/when the dialogue box is being activated. I'm going to try to put BOTH parts of the code in the Customer Sign-up page and disable comments on my blog posts. That will at least give me comfort in knowing that I don't have to keep checking the comments section in my blog posts, and I can monitor just the 1 page to see if it begins to work properly.

 

This has become quite baffling and a bit frustrating to me, because I cannot fathom why anyone would be pursuing this annoying "hobby" of littering Shopify owners' stores with fake/bogus Customer sign-ups... 

 

Has anyone tried any other method of installing the reCAPTCHA v3 code into your website that seems ironclad?

0 Likes
Tourist
14 0 2

I got it work on the register page on my debut theme. V3 with:

 

<script src="https://www.google.com/recaptcha/api.js?render=_reCAPTCHA_site_key"></script>
<script>
grecaptcha.ready(function() {
grecaptcha.execute('-----------THISISMYKEYFROMGOOGLE--------', {action: 'homepage'}).then(function(token) {
...
});
});
</script>

i pasted it on the top of my customers/register.liquid and page.contact.liquid today and it works.

 

I can't make it work on my comments.

 

i tried to paste it into article.liquid comment.liquid but now way. 

 

I tried also to use the V2 Captcha but it only shows the box and has no effect until i can't edit the server side . It should be possible because some apps do it . Anyone knows where to put the code for the validate?

 

Somebody knows where to add it?

 

Thanks in advance

1 Like