How can I add email validation to the subscribe form in Webflow?

To ensure users enter a valid email address in your Webflow subscribe form, you can enable built-in email validation within the Form Block settings.

​

1. Use the Email Field Type

​

• Select the form input where users will enter their email.
• In the Element Settings panel (right sidebar), under Type, select Email.
• This automatically activates HTML5 validation to check for a valid email format (e.g., name@example.com).

​

2. Set Required Field (Optional but Recommended)

​

• While the email input is selected, check the Required box in the Settings panel.
• This ensures users can't submit the form without entering an email.

​

3. Customize the Error Message (Optional)

​

• Select the Form Block, then click on the error message block (which appears when clicking outside the input field after entering invalid data).
• You can edit the default error message text to better match your tone (e.g., “Please enter a valid email address.”).
• Make sure it's visible by clicking on the form and selecting the “Show State” → “Error” in the top bar.

​

4. Test the Form

​

• Preview your site by clicking Preview (eye icon).
• Try submitting the form with invalid email formats (e.g., “test@”) to verify that the validation triggers.
• A red border and error message should appear around the email input.

​

Summary

​

To add email validation to a Webflow subscribe form, change the input type to “Email” and optionally mark it as required. Webflow’s built-in HTML5 validation will prevent submissions unless users enter a properly formatted email.