1. Documentation
  2. Working in the Classic Unbounce Builder
  3. Working with Forms

Modifying Form Validation Error Messages in the Classic Builder

Follow
Avatar
Kim Harley
Last Updated

When a visitor fills out the form on your page, but their form entry doesn't validate, they'll see some errors, which look like this by default:

before.png

You can modify and customize the wording of these errors by adding a snippet of Javascript to your landing page in the Classic Builder! 

To add this script,

  1. Navigate to your page in the Classic Builder. 
  2. Click the Javascripts javascriptsbutton.png button in the bottom left of the Classic Unbounce Builder.
  3. Click + Add New JavaScript. A new dialog box will appear.
  4. Give your script a name, set the Placement to Before Body End Tag, and paste in the following code:

  1. To customize your form validation error messages, update the text within the quotation marks ' ' to whatever you'd like your new message to read. For example:

    window.ub.form.validationMessages.your_name.required = 'You forgot to enter your name!';

Here's the result:

after.png

Save and Publish your page to finalize these changes!

Note:

Using .email or .phone rather than .required will display only when the email field or phone number field doesn't have the correct input. If you would like the validation to be shown even when the field is empty, you'll need to add both the .email/.phone and the .required custom code to your page.

Related Articles

Adding & Editing Form Fields  

Related articles