How To Set Up Google reCAPTCHA v3 In The Divi Contact Form and Email Optin Module

Elegant Themes silently added Google reCAPTCHA to the Divi Contact Form and Divi Optin Module, and I'm going to show you how to set it up!

I immediately tested it, and was so excited to share the findings with the rest of you on YouTube and on the blog. So here are the easy step-by-step directions!

anti-spam Divi contact form
spam protection service in the Divi contact form
setting up the spam protection service in Divi contact form
spam protection in Divi
register your Divi website for Google reCAPTCHA

Adding Google reCAPTCHA To Your Divi Website

After you register a website, you will get the site key and secret key for the site. It will look something like this:

Google reCAPTCHA site key and secret key

Keep this page open and go back to your Divi Contact Form or your Divi  Email Optin Module. 

Step #1: Enable Spam Protection

Go to the “Spam Protection” toggle and turn on “Use A Spam Protection Service.” This brings up some new options and fields. 

anti-spam Divi contact form
spam protection service in the Divi contact form

NOTE: The “Service Provider” is set to reCAPTCHA by default and cannot be changed.

Step #2: Choose reCAPTCHA Account

Next, click the gray button to add an account. (If you have already added an account in the past, you can select it from the list.) This will bring up another set of options called Account Name, Site Key, and Secret Key.

add Google reCAPTCHA account in Divi contact form or email option

NOTE: The “Account name” is set to Default by default but can be changed. You can use the “Label” name that you set earlier in step #2 of the previous section.

Step #3: Add Site Key and Secret Key

Now you can simply copy and paste the Site Key and Secret Key from the Google reCAPTCHA website to your Divi Contact form or Email Optin.

add Google reCAPTCHA account in Divi contact form or email option
add Google reCAPTCHA account in Divi contact form or email option

NOTE: Google reCAPTCHA v3 is invisible. There may be a badge that appears on your website, but there is no checkbox on the forms. See below for how to properly and legally hide the badge.

Google reCAPTCHA v3 analytics

To hide the Google reCAPTCHA badge, copy and paste the following code snippet into your Divi>Theme Options>Custom CSS box.

Please share this post!

Nelson Lee Miller (aka The Divi Teacher)

Nelson is the owner of Pee-Aye Creative Co in the beautiful state of Pennsylvania. He loves helping small businesses, exploring, building websites with Divi, and teaching others.

Join Our NEW Divi Facebook Group!

The Divi Teacher Logo

Related Posts

Leave A Response!

24
Leave a Reply

avatar
  Subscribe  
newest oldest most voted
Notify of
Marloes Lodder

Thank you for your clear instruction! Helped a lot!

Erwin

After following your instruction, captcha is not visible. Do you have an idea how that is possible?

Miguel Morales

Thank you so much! Helped a lot!

Elaine Rogers

This is amazing – works a treat – thank you for such an amazing walk-through!

Jason Groves
Jason Groves

Is this visual builder only? Doesn’t work in normal Divi using Chrome or Safari…

Click ReCaptcha and nothing else loads up to ask for account details except for the sensitivity of the ReCaptcha.

Can’t click save and exit to reload it either…

Moa

Thank you very much for this information. The explanations are very clear and it works perfectly on my sites.

Sri

Thank you for the guide. But i get this error at console

Uncaught Error: Invalid reCAPTCHA client id:

Any reason for it?

Victor

Well done! A friendly advice: the Google video link is broken.

Balaka
Balaka

Thanks for the tutorial!

Just a heads up that recaptcha v3 will add 2 seconds of load time across your entire website (!).

And once enabled, the API cannot currently be removed from Divi. That means that even when it’s disabled within the module, it’s still being loaded across your website.

Elegant Themes are aware of this and hopefully a fix will be available soon.

Sander

Great post. You should mention at the end of this manual that recaptcha v3 is invisible. Like the other commenter I was also confused that nothing showed up after completing the setup.

Andre
Andre

Hi, thanks for the instruction! About 2 weeks recaptcha is on and it really works.
The only problem I´m facing is the slowing page speed, after activating the recaptcha whent from 97 to 50 on page speed insights. Any tips to fix that? seems like recaptcha goes on every page even on the ones that dont have a form.
Thanks again!

Renske Foekema

Hi, Nelson,
Thanks for the clear explanation. Only the Spam protection options are missing from my contact form. With you it is between ‘ redirect’ and ‘link’, but with me there is nothing between ‘ redirect’ and ‘link’. While I do have the latest version of Divi (version 4.3.2). Do you know why and how I can get it?
Thanks
Renske Foekema

Linda Rawson

Is there any way to put this on the login screen?

Shop Our Divi Products!

Child Themes • Plugins • Layouts

Visit The Shop

Divi Tutorials On YouTube

Subscribe to our helpful Divi videos!

Visit Our Channel

Pin It on Pinterest

0

Your Cart