Add reCAPTCHA to your Form

Needless to say how important the safety of your website is. The service that is widely known and combines security with ease of use is reCAPTCHA. It is a free service of Google that protects your website from spam and abuse. 

reCAPTCHA is easy to use, but it is hard to be managed by automated malicious software. Convert Forms extension includes reCAPTCHA v2 (checkbox and invisible), and reCAPTCHA v3; you can configure it with just a few steps.

Add reCAPTCHA v3

The reCAPTCHA v3 differs from the v2 Checkbox and v2 Invisible by running in the background and generating a score based on the user's interaction within your site. The higher the score, the more likely the user is human.

Generate reCAPTCHA Keys

To generate the required keys, you will have to log into your Google account by visiting the Admin Console: https://www.google.com/recaptcha/intro/v3.html

Click on the v3 Admin Console button.

After logging in, you will have to click on the + (Plus) button to register a new site.

After clicking the + (Plus) icon you will be redirected to add a new Site and after you fill in all fields, you will be able to copy your API keys.

Completing the following fields, you will have the required keys that you need to include in your website so that you can enable the service.

• Set your Site's Name in the Label field
• Choose the "reCAPTCHA v3" option from the reCAPTCHA type
• Add your domain name
• Accept the reCAPTCHA Terms of Service
• Click on the SUBMIT button

Your keys are ready! The Site key and the Secret key are what you need.

Add reCAPTCHA v3 Field to your form

In Joomla administration environment click on Global Configuration -> Convert Forms and click on the "reCAPTCHA" tab.

Locate the "reCAPTCHA v3" section and type both your "Site key" and "Secret key" in the respective fields using the corresponding keys that Google has provided you. 

Next, go to the main administration menu: Components -> Convert Forms and then click on Forms.

And choose the form you want to edit.

Choose the tab "Add Field" and click on the reCAPTCHA field in the Advanced Fields category. Save your work.

Subsequently, select the v3 reCAPTCHA version, and more options about appearance are given where you can optionally choose the reCAPTCHA badge in the field options.

reCAPTCHA v3 comes with the Inline, and Bottom Right badges as you can see in the screenshot below:

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Finally, after all the changes save your work. Your reCAPTCHA v3 field is ready!

Add Checkbox reCAPTCHA v2

The "I'm not a robot" Checkbox requires the user to click a checkbox indicating the user is not a robot. This will either pass the user immediately (with No CAPTCHA) or challenge them to validate whether or not they are human.

Generate reCAPTCHA Keys

To generate the required keys, you will have to login into your Google account by visiting the Admin Console: https://www.google.com/recaptcha/intro/v3.html

Click on the v3 Admin Console button.

After logging in, you will have to click on the + (Plus) button to register a new site.

After clicking the + (Plus) icon you will be redirected to add a new Site and after you fill in all fields, you will be able to copy your API keys.

Completing the following fields, you will have the required keys that you need to include in your website so that you can enable the service.

• Set your Site's Name in the Label field
• Choose the reCAPTCHA v2 "Im not a robot" Checkbox from the reCAPTCHA type
• Add your domain name
• Accept the reCAPTCHA Terms of Service
• Click on the SUBMIT button

Your keys are ready! The Site key and the Secret key are what you need.

Add Checkbox reCAPTCHA Field to your form

In Joomla administration environment click on Global Configuration -> Convert Forms and click on the "reCAPTCHA" tab.

Locate the "Checkbox reCAPTCHA v2" section and type both your "Site key" and "Secret key" in the respective fields using the corresponding keys that Google has provided you. 

Next, go to the main administration menu: Components -> Convert Forms -> Forms.

And choose the form you want to edit.

Choose the tab "Add Field" and click on the reCAPTCHA field in the Advanced Fields category. Save your work.

Subsequently, you can select the reCAPTCHA version, in our case, v2 Checkbox, and more options about appearance are given where you can optionally choose the reCAPTCHA theme and size in the respective field options.

reCAPTCHA v2 Checkbox comes with the Light and Dark themes and in a Normal and Compact size as you can see in the screenshot below:

Finally, after all the changes save your work. Your reCAPTCHA field is ready!

Add Invisible reCAPTCHA v2

The invisible reCAPTCHA does not require the user to click on a checkbox, instead it may display a challenge to the user if it detects any spam behavior when a user submits your form.

Generate reCAPTCHA Keys

To generate the required keys, you will have to login into your Google account by visiting the Admin Console: https://www.google.com/recaptcha/intro/v3.html

Click on the v3 Admin Console button.

After logging in, you will have to click on the + (Plus) button to register a new site.

After clicking the + (Plus) icon you will be redirected to add a new Site and after you fill in all fields, you will be able to copy your API keys.

Completing the following fields, you will have the required keys that you need to include in your website so that you can enable the service.

• Set your Site's Name in the Label field
• Choose the reCAPTCHA v2 Invisible reCAPTCHA badge from the reCAPTCHA type
• Add your domain name
• Accept the reCAPTCHA Terms of Service
• Click on the SUBMIT button

Your keys are ready! The Site key and the Secret key are what you need.

Add Invisible reCAPTCHA Field to your form

In Joomla administration environment click on Global Configuration -> Convert Forms and click on the "reCAPTCHA" tab.

Locate the "reCAPTCHA v3" section and type both your "Site key" and "Secret key" in the respective fields using the corresponding keys that Google has provided you. 

Next, go to the main administration menu: Components -> Convert Forms -> Forms.

And choose the form you want to edit.

Choose the tab "Add Field" and click on the reCAPTCHA field in the Advanced Fields category. Save your work.

Subsequently, select the v2 Invisible reCAPTCHA version, and more options about appearance are given where you can optionally choose the reCAPTCHA badge in the field options.

reCAPTCHA v2 Invisible comes with the Inline, Bottom Right and Bottom Left badges as you can see in the screenshot below:

Finally, after all the changes save your work. Your reCAPTCHA Invisible field is ready!

Why you probably don’t need Google reCAPTCHA

Without you having to do a thing, Convert Forms is already protecting your forms from spam submissions. A honeypot field is automatically added to each form by default. It's designed to catch spammers in the same way an actual pot of honey would catch flies. It's just a hidden field placed into every form and it's purpose is to make form submission fail if anything is entered into it.

Read more here: Native Convert Forms Anti-spam Protection with Honeypot

Tips:

• Don’t forget to store your keys.
• Different versions of reCAPTCHA have different keys.

Frequently Asked Questions

Does this require the Joomla CAPTCHA plugins to be enabled?

Convert Forms reCAPTCHA fields do not require the Joomla core reCAPTCHA plugins to be enabled and configured.

Why we did not rely on Joomla CAPTCHA plugins

While Joomla offers CAPTCHA plugins, we took a different approach to Convert Forms. We developed custom CAPTCHA integrations to ensure the best possible user experience and maintain complete control over form security.

Here's why building our own CAPTCHAs benefits you:

• Faster Bug Fixes: Encountering a CAPTCHA issue? We can address it swiftly without relying on external developers or Joomla updates. This minimizes downtime and frustration for your users.
• Optimized Performance: Our custom CAPTCHAs are built specifically for Convert Forms, leading to smoother operation than generic Joomla plugins.
• Clear Ownership: If a CAPTCHA-related issue arises, you can be confident we take full responsibility for a swift resolution. Unlike relying on third-party plugins, where troubleshooting can be cumbersome, and finger-pointing can occur.

Troubleshooting

How to fix the "Please validate" error

When you see this error, it means that the form was submitted, but reCAPTCHA didn't get the chance to verify the user initially. In this case, you can re-try again or reload the page and re-try.

How to fix the "Couldn't validate submission. Invalid score." error

This error occurs only when using reCAPTCHA v3. The user score (automatically determined by reCAPTCHA v3 based on user interaction) doesn't pass the score threshold set within your reCAPTCHA v3 field settings. This means that reCAPTCHA thinks the user is a bot and they must try again later.

How to fix the "Couldn't validate submission. No score found" error

To resolve this particular error message, we need to ensure that both the reCAPTCHA v3 field as well as your reCAPTCHA v3 admin console is properly set up.

Whitelist your domain on your reCAPTCHA v3 settings

Within your Google reCAPTCHA admin console, in the reCAPTCHA v3 set of keys, you must whitelist your domain name. This helps Google identify your site and validate the reCAPTCHA field you've placed in your forms.

Set up your reCAPTCHA v3 settings

You must properly set up your reCAPTCHA v3 keys within Convert Forms. Click here to read more. 

Other reasons

While your form may throw this error, we've seen that it works for other users, so your issue may be related to your local environment. Google reCAPTCHA v3 validates the user based on their interaction on your site. We've seen a lot of false positives where Google may not allow a perfectly normal user who interacts with their site to submit their forms. Eventually, this error should go away.

Joomla 3

If you're using Joomla 3, and reCAPTCHA v3, you've probably seen the error message "Couldn't validate submission. No score found." when your form is submitted. If you're using the reCAPTCHA v2 checkbox, it probably keeps spinning after checking it. You may find a similar behavior with reCAPTCHA v2 invisible.

All these issues are caused by an outdated Mootools library bundled with Joomla 3, called by a 3rd-party extension/plugin/module, conflicting with Google reCAPTCHA. You may ask, if your site has been using this library for a long time, why did this issue start now? Well, Google may have changed something in Google reCAPTCHA, which may have resulted in this issue.

To confirm that Mootools cause this, go to this URL: https://site.com/media/system/js/mootools-core.js. Replace site.com with your domain name. If the file exists, Mootools is installed, and it's most probably the culprit, as you should be running an outdated version such as 1.4.5.

To confirm this, simply do a search for version:"1.4.5," and it should find one match. That confirms that MooTools is the culprit.

How to resolve this issue

Method #1: Download the Mootools Enabler/Disabler extension

Once you install this extension, you can edit the respective plugin and disable the MooTools assets.

Method #2: Manually update the assets

First of all, keep a backup of the following files:

• /media/system/js/mootools-core.js
• /media/system/js/mootools-more.js

Then, download the latest version of MooTools from here:

• For MooTools core: https://mootools.net/core
• For MooTools more: https://mootools.net/more

Finally, ensure the downloaded files have the same name as the existing ones and replace them with those in the directory /media/system/js/.

Your forms's reCAPTCHA field should now function properly.