If you have any kind of form on your WordPress website, be it a contact form, comments form or even the WordPress login form. Bots will always fill up those forms with spams. You will get tons of spam messages from bots. At the end of the day if you did not put any precaution in place, you will get so many spam messages that you will not be able to differentiate between the real messages and spam messages.
Recently I have made a WordPress website for a client using Elementor. I put an Elementor subscription form in the footer. My client requested me to help him put a reCAPTCHA to the form to avoid any kind of spams from the bots. He integrated the reCAPTCHA v3 with Elementor. When I integrated the reCAPTCHA v3 with the form, he was kind of confused. Because it did not have the “I’m not a robot” checkbox. I had to explain him that reCAPTCHA v3 does not have the checkbox, it automatically decides which messages are spams.
Difference Between reCAPTCHA v2 and reCAPTCHA v3
Both reCAPTCHA v2 and v3 are services provided by Google to prevent spams. The reCAPTCHA v2 is the traditional reCAPTCHA with the “I’m not a robot” checkbox. Whereas the reCAPTCHA v3 works differently, it does not have any checkbox, it does a bit of calculations and automatically decides whether the message is spam or not.
Some of you might prefer to use the traditional “I’m not a robot” checkbox type reCAPTCHA with your Elementor form. It is absolutely fine if you want to choose the checkbox type reCAPTCHA. Hence in this blog I am going to show you how you can add that to an Elementor Pro contact form. Right from the integration to adding the checkbox to the form.
Steps for adding "I'm not a robot" reCAPTCHA to an Elementor Pro contact form
Step 1: Going to the reCAPTCHA setting in Elementor
In the WordPress back end, hover over Elementor and then click on “settings”. Then click on “integrations”. Then click on the link “reCAPTCHA”. But before doing this, please make sure that you are logged into your Google account in chrome browser.
Step 2: Getting the site key and secret key from Google.
After clicking the link, you will be redirect to Google. There you will need to create a new reCAPTCHA for this new website. Please follow the screenshots below sequentially.
Step 2: Pasting in the site key and secret key on Elementor
After you get the site key and secret key from google, now you will need to paste it in Elementor. After you paste the information in, make sure to scroll down and save the changes.
Step 3: Adding the reCAPTCHA to Elementor Form
Now simply create a new page, add the form element by elementor. Then simply add a reCAPTCHA type field to the form. After you add it the reCAPTCHA would show up. Make sure to save the changes. Please follow the screenshots below.
I hope you have found this blog helpful. Adding a small reCAPTCHA functionality will greatly improve the functionality of your Elementor Pro contact form. There will be no spams. You will only get real messages from real clients. If you face any issues regarding this, then please feel free to contact me.