Adding reCAPTCHA to Elementor

Last Updated

Google offers two versions of reCAPTCHA that can be added to Elementor’s contact forms.

To apply reCAPTCHA to the website, you will need to generate secure keys to connect to the website.

To generate these keys, visit: https://www.google.com/recaptcha/about/

Click Admin Console in the header and either create a Google account or log into an existing one.

Generate Secure Keys

When you have logged into your account, you will have the option to register a new website either on the dashboard or by clicking the + symbol. 

You will then be shown the following screen:

Enter a label for the website and choose either reCAPTCHA v3 or reCAPTCHA v2.

Both offer slightly different front-end experiences for a user to interact with when submitting a form.

Add the domain name of the website you wish to connect the key too, accept the terms and click the Submit button.

You will then be taken a screen showing the Site Key and Secret Key, as shown below:

Your personal security keys need to be copied and then added to your live website.

Adding Keys to Elementor

Log into the website and choose Elementor > Settings and click the Integrations tab as shown below:

Copy the matching set of keys to either reCAPTCHA or reCAPTCHA V3 depending on the ones you have registered with Google and click save changes.

Add reCAPTCHA to Contact Form

With the keys added to Elementor you can now add the reCAPTCHA option to the contact form.

On the contact page, or wherever the contact form is shown, click to edit the contact form settings.

In the Content Tab, click add item and choose either reCAPTCHA or reCAPTCHA V3 to match your settings, as shown below:

Once you have set your option, click the update button to save.