Fixing Your Webflow Form Not Submitting ReCAPTCHA Error

Webflow forms fail due to an authentication mismatch between Google reCAPTCHA keys and authorized domains in your Google Admin Console. This occurs when Google does not recognize the specific data path. Access your Google account settings to ensure both your live production domain and .webflow.io staging subdomain are listed as allowed domains.

Emergency Stop-Gap: If you need to capture leads immediately while we troubleshoot the backend configuration, you can bypass the validation check entirely. Go into your Webflow form settings, remove the reCAPTCHA field, and delete any custom reCAPTCHA script blocks from your site settings. This will stop the system from looking for a Google “handshake” and allow submissions to flow through until you have the time to fix the primary configuration.

Why won’t my Webflow form submit?

When a user clicks “Submit” and nothing happens—or they are left staring at a spinning loading icon that won’t resolve—the browser is failing to validate the reCAPTCHA token before it can send the data to your email or database. These errors often go silent because of how Webflow handles submission events: if the reCAPTCHA script doesn’t return a “success” signal within the required timeframe, the form’s submit function never triggers.

You might see specific errors like “Invalid Site Key,” but more often you will experience a complete lack of response from the button itself. This happens because the browser is waiting for a verification that never arrives, typically because the underlying script is being blocked by security policies or is tied to incorrect credentials.

Related guide: Hire Expert to Fix Broken Webflow Custom Code

What causes the reCAPTCHA error in Webflow?

I know how frustrating it is when a form stops working right before a launch or during a critical campaign—it feels like your front door is locked to customers. However, these errors usually boil down to three specific configuration issues within the Webflow environment. We can get this sorted out by isolating which of these three hurdles you’re hitting.

Is it an incorrect API key?

Most of the time, the issue is a simple swap during the setup phase. You are working with two distinct keys: the “Site Key” and the “Secret Key.” The Site Key is public-facing; it tells Google which site is requesting validation. The Secret Key is private and used only for backend verification. If you accidentally paste the Secret Key into the Site Key field (or vice versa), the connection will break. Additionally, check for “ghost” characters—if you copy-pasted the key and included a trailing space at the end of the string, the validation will fail every single time.

Is the domain missing from Google’s list?

Google reCAPTCHA won’t function unless it recognizes the specific URL where the form lives. A common oversight in Webflow development is failing to include the .webflow.io subdomain in your Google Admin Console whitelist. If you are testing your site on a staging link or a .webflow.io domain and that specific entry isn’t in your settings, the form will fail even if your primary live domain is set up perfectly. You need to ensure every environment where you test the site is explicitly authorized by Google.

Are there conflicting scripts on one page?

If you have multiple forms on a single page, or if you manually added a reCAPTCHA script block while also utilizing Webflow’s native integration features, the two sets of code are essentially “fighting” over who controls the submission process. When the browser detects multiple instances of the same API trying to verify different inputs simultaneously, it often defaults to blocking the action entirely as a security precaution. To fix this, you need to ensure only one method of verification is active on any given page.

Related guide: Hire Expert to Fix Website Form Emails Going to Spam | Stop

How do I fix the reCAPTCHA error?

I know how frustrating it is when your contact forms stop working; it feels like you’re cutting off a direct line to your customers. This issue usually stems from a mismatch between Webflow’s settings and Google’s security requirements, but we can get this sorted out quickly. To fix this, we will perform a three-step audit: verifying your keys in Webflow, updating your domain list in Google, and cleaning up any conflicting code on your site.

How to verify your keys in Webflow settings

Start by navigating over to your Webflow Project Settings and head to the “Forms” tab. Locate the reCAPTCHA section. You must ensure that the fields are populated with the exact strings provided by Google.

If you suspect a copy-paste error—which is very common because hidden characters or extra spaces can break the connection—delete both keys entirely from the Webflow field, refresh the page, and paste them again directly from your Google Admin Console. This ensures a clean “handshake” between the two platforms.

How to update your domain list in Google Console?

You need to make sure that Google knows exactly which URLs are authorized to use your key. If your specific subdomain isn’t listed, Google will block the request.

1. Log into the Google reCAPTCHA admin console.
2. Select your active property.
3. Scroll to the “Domains” section.
4. Ensure you have added:
   • yourdomain.com
   • www.yourdomain.com
   • yourdomain.webflow.io (This is critical for testing).

How can I find duplicate elements?

If your site has multiple forms, check if you have manually injected a reCAPTCHA script into the <head> of your site. Webflow’s native form integration handles the injection for you automatically. If both are present, they will conflict with each other and cause submission failures.

You can check for duplicate IDs or scripts by opening your site in a browser and opening the Developer Tools (F12). Paste this code into the console to see if multiple reCAPTCHA elements are detected:

// This script identifies if multiple reCAPTCHA containers exist on the page
const captchaElements = document.querySelectorAll('.g-recaptcha');
if (captchaElements.length > 1) {
    console.warn(`Warning: ${captchaElements.length} reCAPTCHA elements found. This will cause submission failures.`);
} else if (captchaElements.length === 0) {
    console.log('No reCAPTCHA elements found. Check your Webflow project settings.');
}

Related guide: Squarespace Contact Form Submission Error Fix

How do I verify the fix?

Once you have pushed these changes live, we need to run a “cold” test. It is a common mistake to simply hit the refresh button; however, your browser often clings to old, broken scripts in its cache to save speed. To ensure you are seeing the updated code and not a ghost of the previous error, clear your browser cache or—more easily—open your site in an Incognito window before testing.

1. Submit the form from your .webflow.io staging link (if applicable).
2. Submit the form from your live domain.
3. Confirm the “Success” message appears and verify that you actually received the notification email in your inbox. If both happen, the fix is active.

Audit Point	Technical Action	Business Value
Key Integrity	Verify Site Key vs. Secret Key in Webflow Settings	Ensures 100% of users can submit the form without errors.
Domain Whitelisting	Add .webflow.io to Google Admin Console	Allows for seamless testing and staging updates.
Script Cleanliness	Remove manual g-recaptcha scripts from Head	Prevents “Double Submission” bugs on multi-form pages.

When should I call a professional?

I understand how stressful it is when your site’s functionality breaks, especially when you’re trying to manage the technical side yourself. While many issues can be resolved with a few tweaks, there are specific scenarios where bringing in an expert is the smartest move to protect your business and save you time. You should consider hiring a specialist if any of the following conditions apply:

1. Security Breaches: If you suspect your Secret Key has been leaked or compromised because of an improperly configured script that exposed it in the source code. A security breach isn’t just a technical glitch; it’s a liability. If credentials have been exposed publicly, you need a professional to audit your implementation and ensure your site’s integrity is restored.

2. Complex Custom Logic: If you are using a custom-coded Webflow integration (such as a third-party API) where the reCAPTCHA is being validated via a separate backend server rather than through Webflow’s native system. When you move away from standard “out of the box” configurations, the logic becomes significantly harder to debug without specialized knowledge of how that specific backend handshake is functioning.

3. Persistent Failures: If you have already verified and corrected your keys and domains, but the form still fails on specific mobile devices or certain browsers. This usually points to a conflict with another script—such as a tracking pixel, a heavy custom animation library, or a third-party widget—that is interfering with the DOM (Document Object Model). These “ghost” bugs are difficult to track down without a developer who can systematically isolate and debug conflicting scripts.

Reference Material

For the specific security requirements and official integration steps, you can find everything laid out in the Google reCAPTCHA developer documentation.