Integrate Free reCAPTCHA To Your Contact Form!

Intro

In this blog post, I will teach you how to create your reCAPTCHA site key and secret key using your free google account, plus integrate reCAPTCHA to your contact form hassle-free! What is reCAPTCHA? reCAPTCHA is ”I’m not a robot” tickbox in your contact form. It helps with protecting your website from malicious bots sending you spam messages. In general, you’ll be safe & sound in blocking fake spam messages. As a result, you will only receive messages from legitimate users which are actually real humans, not bots!

Foundations Needed

Before we get started, make sure to already have elementor basic and elementor pro widgets plugins installed & activated in your wordpress website! For the sake of this tutorial, I will show you how to add reCAPTCHA in this way, using elementor basic and elementor pro widgets. If you missed my blog posts on how to use elementor pro widgets completely for free without paying a dime + how to create & modify your professional contact form, here are the links to them so you can keep up with no issues:

Secret Website To Download Elementor Pro Widgets For Free!

Create Professional Contact Form Design Tutorial!

Also, you’ll need a paid domain name for your website, that is unfortunately unavoidable. Otherwise you won’t be able to create your reCAPTCHA credentials. But hey, it’s only $10/Year, not much! I tried using a free domain name, it’s not working.

Create reCAPTCHA Credentials

Previous slide
Next slide

Come to google.com and search for ”reCAPTCHA”. Click on the 1st result displaying ”reCAPTCHA.” You’ll be redirected to this page:

https://www.google.com/recaptcha/about/

Make sure you’re logged in to your free google account and remember it, because that is where your reCAPTCHA site key and secret key will be located. Try not to mix more free google accounts so you can organise better. On the top, click on ”V3 Admin Console.” Next, register a new site. Provide your website domain name (paid domain name – costs cca $10/year). Secondly, choose ”Challenge (V2)” + ”I’m not a robot” Checkbox for reCAPTCHA type. Attention! If you select reCAPTCHA V3 version – ”Score Based (V3)”, there is a high probability that you will be blocked when trying to sign to your website. To avoid that, we’ll be using confirmed V2 version of reCAPTCHA! Once you’ve provided your data, click on the ”Submit” button down below. Consequently, you will receive your reCAPTCHA site key and secret key. In the next phase, we will integrate reCAPTCHA to our wordpress website by copy and pasting our site key and secret key to ”Elementor – Settings – Integrations.”

 

Integrate reCAPTCHA

Previous slide
Next slide

So log in to your wordpress dashboard, on the navigation menu to the left-hand-side, choose ”Plugins-Installed Plugins.” Find your installed elementor plugin and click on ”Settings.” Next up, select ”Integrations” and scroll down until you find reCAPTCHA. Additionally, paste your site key and secret key. Then scroll down and ”Save Changes.” Congratulations, you’ve successfully integrated reCAPTCHA to your wordpress website. In the final phase, all that is left is to use reCAPTCHA in our contact form.

Add reCAPTCHA To Contact Form

Previous slide
Next slide

Come to ”Pages-All Pages” and choose your page where your contact form is created. Edit that page – ”Edit with Elementor.” My contact form is created in my homepage, so I will edit my homepage. Find your contact form and click on it. We need to add reCAPTCHA form field. Under ”Content” where all your form fields are choose ”Add Item.” Afterwards, select ”reCAPTCHA.” Watch out not to select ”reCAPTCHA V3” because we’re using general V2 version ”reCAPTCHA.” Simply name your reCAPTCHA ”Label” – ”recaptcha.” reCAPTCHA is automatically going to be a required form field, just make sure that the ”Required Mark”  under all form fields is selected to ”Show.” Done! ”Update” your new changes. Let’s test our new reCAPTCHA, shall we? Refresh your page and fill out your contact form. Check the box ”I’m not a robot” and bam! As you can see, reCAPTCHA is working perfectly. Confirmation is green checkmarked tickbox!

Bottom Line

In this blog post, I’ve helped you to create your free reCAPTCHA – ”I’m not a robot” tickbox to avoid receiving spam messages through your contact form. All we needed to do was to create our site key and secret key using our free google account, integrate them to elementor settings in our wordpress website and then add reCAPTCHA form field to our professional contact form. Now you’re safe & sound to only receive messages from legitimate real humans! Appreciate your time reading this tutorial, enjoy using your free reCAPTCHA!