Finally, A Solution To Spam!
No More Spam In from your Divi Website
Today is a good day! Elegant Themes has added Google reCAPTCHA to Divi in both the Contact Form and the Email Optin. That’s right, I was casually reading over the tons of bug fixes in the Divi changelog for version 4.0.7 when I spotted it…reCAPTCHA support was added!
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!
▶️ Please watch the video above to get all the exciting details! 👆
What is reCAPTCHA?
First of all, what is this weird thing called reCAPTCHA? The “re” part is a special type of CAPTCHA by Google. The word CAPTCHA stands for “Completely Automated Public Turing test to tell Computers and Humans Apart.” Now you know a great piece of trivia to use at parties!
According to the Google reCAPTCHA website:
“reCAPTCHA is a free service that protects your website from spam and abuse. reCAPTCHA uses an advanced risk analysis engine and adaptive challenges to keep automated software from engaging in abusive activities on your site. It does this while letting your valid users pass through with ease.”
So in the words of Nelson, it’s a really cool thing that stops fake bot people.
Review What’s New
Check The Divi Contact Form and Email Optin Modules
The first step is to simply go to your Divi Contact form Module and take a look at this awesome new feature reCAPTCHA feature.
A new Spam Protection toggle is now available in both the Divi Contact Form and the Divi Option Module. We are showing images from the Contact Form, but the process is exactly the same for the Email Optin.
Are you confused yet by Account Names, Site Keys, and Secret Keys? Don’t worry, I explain it all step-by-step below, so keep reading!
Register A New Site
We can see that an account needs to be created and some information entered, so let’s do that next. The first thing to do is to head over to the Google reCAPTCHA website and complete a registration form for our website.
Step #1: Click the blue “Admin Console” button in the top right corner.
After logging in, you will find a page that looks like this:
Let’s walk through this step-by-step and get your Divi website set up properly with Google reCAPTCHA. I’ll go over each item next.
Step #2: Enter the Label To Identify Your Site
The label is simply a way for you to identify this particular site in the future. It is helpful to label this something like the site name or the site domain name.
Step #3: Choose A reCAPTCHA Type
You need to select from version 2 or version 3.
For this tutorial, select reCAPTCHA v3 from type options.
Step #4: Add Your Domain
Here you should enter the domain name of the site you want to register.
Step #5: Accept the reCAPTCHA Terms of Service
Finish off this section by reading and agreeing to the terms of service.
Step #6: Click the blue “Submit” button
After submitting the registration form, you will go to a new page.
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:
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.
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.
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.
Step #4: Click Submit
Finish things off with a quick button press and you are on your way to a spam-free Divi Contact Form or Email Optin!
Step #5: Adjust The Minimum Score
The score is the key to this entire anti-spam thing! It’s important for you to understand the basics, and for that, I recommend the video on Google ReCAPTCHA’s about page.
I’m going to keep my set to the default 0.5 score for now, which can be adjusted after evaluating the analytics.
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.
Analytics
Check Your Divi Contact Form and Email Optin Google reCAPTCHA Analytics
One of the cool features of using Google reCAPTCHA is being able to see analytics for your Divi websites. Among other things, you can see the total requests and suspicious requests You can see all this from the Google reCAPTCHA admin area.
Can I Hide The reCAPTCHA Badge?
You Can Legally Hide the reCAPTCHA Badge with CSS As Long As You Add A Disclaimer
Many people were asking me if you can hide the Google reCAPTCHA badge that shows up on the bottom right corner of your website. I looked into this, and Google has officially answered this question on their FAQ document.
Basically yes, you are allowed to hide the badge as long as you include the reCAPTCHA branding visibly in the user flow. So in other words, you need to show the following text near your Contact Form module or Email Optin module:
This site is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy">Privacy Policy</a> and
<a href="https://policies.google.com/terms">Terms of Service</a> apply.
To hide the Google reCAPTCHA badge, copy and paste the following code snippet into your Divi>Theme Options>Custom CSS box.
.grecaptcha-badge {
visibility: hidden;
}
You need to update the link to google as your link goes to the enterprise version and I think it is difficult to find v3 from there; but maybe my eye were just tired.
google.com/recaptcha/admin/create
Sure I’ll make the link more direct, thanks for letting me know!
love your site it extremely helpful withy easy to understand teaching
Thank you Wallace, so glad you like it and can benefit from the content! 🙂
Well done! A friendly advice: the Google video link is broken.
Thank you, fixed https://www.google.com/recaptcha/about/