What could be causing the error when submitting a form in Webflow?
TL;DR
- Check that the form's action/method settings are default unless integrating externally.
- Ensure all required fields are completed and validations pass.
- Verify reCAPTCHA keys, avoid duplicates, and publish after configuring.
- Confirm form notifications are active and email addresses are valid.
- Only use forms on properly hosted Webflow or custom-connected domains.
- Inspect for conflicting custom code or incorrect submit button types.
- For Ecommerce, ensure payment setup is complete and fields aren’t missing.
- Monitor submission limits on free plans and upgrade if needed.
- Use browser Console to detect JavaScript or integration errors.
- Test on webflow.io to rule out domain misconfiguration issues.
Form submission errors in Webflow can result from several common issues related to form configuration, integrations, or embed code.
1. Check Form Action and Method Settings
- Webflow forms should not have custom
actionormethodattributes unless you're integrating with a third-party service. - By default, Webflow handles form submissions internally. If the form was modified or custom code was added, remove any action/method overrides unless needed for an external integration.
2. Validate Required Fields
- Ensure all required fields are filled out before submission.
- Webflow prevents submission if any required field is empty or validation fails (e.g., invalid email).
3. Confirm reCAPTCHA Configurations
- If you enabled Google reCAPTCHA, make sure you:
- Entered valid site key and secret key in Project Settings > Forms.
- Published the site after adding reCAPTCHA.
- Avoid having multiple reCAPTCHA instances, especially when using multiple forms per page.
4. Verify Form Notification Settings
- Check Project Settings > Forms to ensure the notification email is valid and the form is not disabled.
- If the site has been exported, Webflow will not collect form submissions unless you’ve set up your own handling or a third-party service (e.g., Zapier, Formspree).
5. Confirm Domain Hosting
- Webflow forms only work when:
- The site is published to a Webflow domain or custom domain properly connected via DNS.
- If visitors submit the form on a non-Webflow-hosted site, form submissions won't go through unless you use custom action URLs or scripts.
6. Inspect Any Custom Code Conflicts
- Custom JavaScript can interfere with how forms work if improperly configured.
- Check for:
- Custom
onsubmitevents - Form submit buttons that aren’t of type
submit - Missing or altered Webflow
data-wf-pageordata-wf-siteattributes
7. Review Payment-Related Settings (for Ecommerce)
- If you're working with a checkout form in Webflow Ecommerce:
- Ensure your payment settings are complete.
- Check that the Checkout page is not disabled or missing required fields.
8. Monitor Webflow Submission Limits
- Free plans have a limit on form submissions per month. If exceeded:
- A warning may appear in your dashboard.
- Webflow will stop accepting submissions until the quota resets.
9. Check Browser Console for Errors
- Use the browser’s Developer Tools > Console to spot any JavaScript errors on form submission.
- These could point to issues with custom code, third-party services, or Formspree misconfigurations.
10. Test on Webflow.io Subdomain
- If issues persist, publish the site to your webflow.io subdomain and test the form there.
- If it works there but not on your custom domain, the issue may be DNS misconfiguration or domain setup.
Summary
Most Webflow form submission errors stem from misconfigured fields, reCAPTCHA issues, custom code conflicts, or using the form on unauthorized domains. Double-check form settings, hosting status, and Console logs for error clues.