Then, register all domains associated with your site (see the note below). Once you register, you'll see two API keys in your reCAPTCHA setting. You'll be using these when enabling validation in the next step.
You’ll want to add any custom domains you’re using, such as example.com. You can also include example.webflow.io (replacing example with your subdomain) if you’re using it for publication, staging, or testing. Subdomains for a custom domain are automatically registered. This means registration for example.com also registers subdomain.example.com. Learn more about Google reCAPTCHA's domain name validation.
Registering domains may take up to 30 minutes to take effect.
Enable reCAPTCHA validation
Now, head over to project settings → forms tab → reCAPTCHA validation section and follow the steps below to enable reCAPTCHA on this project.
IMPORTANT — before enabling reCAPTCHA on your project
Enabling reCAPTCHA will enforce validation for all forms on this site. Any forms that do not have a reCAPTCHA element will fail to submit. This change will go into effect immediately as you click save (step 3 below), whether you republish your site or not. So, before you enable reCAPTCHA, make sure to add a reCAPTCHA element to each of your forms.
Paste the API keys — the site key and the secret key — into the correct fields
Enable reCAPTCHA validation
Save your changes
Publish your project
For security and correct functionality, make sure not to paste the secret key in the site key field.
If you prefer to keep designing, or you’re not ready to enable reCAPTCHA for all forms on your published site, you can come back to project settings to enable it later.
On your published site, check to make sure the form works correctly.
reCAPTCHA may not function correctly for one of many reasons. Here are some issues, warnings, error messages, and how you can fix them.
You can't see the reCAPTCHA element on your published site
Paste the API keys again in the correct fields in the project settings → forms tab → reCAPTCHA validation section
Save the settings
Publish your site
Clear your cache and test again
ERROR for site owner: Invalid domain for site key
This warning indicates that you haven't registered the correct domain(s) for these reCAPTCHA keys. It also shows when you've removed the domain(s) registered for this reCAPTCHA.
To fix this error, add your domain(s) in your reCAPTCHA settings page, save the settings, and publish your site. Clear the cache and test again.
If clearing the cache doesn't work, test in an incognito window. One, you'll see if the error is fixed. Two, this will reset the cache for the reCAPTCHA setting, and now, you should be able to see the reCAPTCHA functioning correctly in all browsing windows.
If the key still doesn't work, delete the keys and generate new ones. Make sure to replace both keys in your project settings when you generate new keys. Note that the site key and secret key are case-sensitive.
Customizing your reCAPTCHA
reCAPTCHA has limited styling capabilities. However, you can use custom attributes to customize the reCAPTCHA element.
Custom attributes will only appear on the published site.
Change the color theme of the reCAPTCHA
By default, the reCAPTCHA element has the light theme. You can switch it to a dark theme.
To use the dark theme, add the following custom attribute:
Change size of the reCAPTCHA
The default size of the reCAPTCHA element is normal. You can use the compact size by adding a custom attribute.
To change the size of your reCAPTCHA element, add the following custom attribute:
Can I Use ?
Data on support for the feature across the major browsers from caniuse.com.