You can change the colour using by adding some CSS via the Styles button in the toolbar. The CSS currently applies to the form validation errors HTML is as follows:

.lp-form-errors {

position:absolute;

display:none;

z-index:999999;

}

.lp-form-errors div.content {

border:1px solid #661414;

background-color:#ccc;

font-family:‘helvetica’, ‘arial’, ‘verdana’, ‘san serif’;

}

.lp-form-errors div.content h3 {

background-color:#661414;

padding:8px;

font-size:14px;

line-height:18px;

font-weight:bold;

color:#f3d8d8;

}

.lp-form-errors div.content ul {

background-color:#f3d8d8;

padding:8px;

font-size:14px;

line-height:16px;

font-weight:normal;

color:#661414;

}

.lp-form-errors div.content li {

list-style:square;

margin-left:20px;

margin-bottom:8px;

}

So if, for example, you wanted to make the header background black you would add something like this in the Styles Dialog:

.lp-form-errors div.content h3 {

background-color:#000;

}

The positioning is a bit more difficult because it is positioned dynamically depending on the width of the page and the position and size of your form. If you continue to have problems with the position can you send an email to support@unbounce.com with a link to your page and perhaps a screen shot of what you are seeing? That will help us troubleshoot any issue more effectively.

thanks

Justin

One more thing, if you add css via the Manage Styles dialog they should be enclosed in tags.

thank you so much! I will try this out!!!

Hi,

on the same subject : Is it possible to change the text of the required fields box that pops on validation ?

We are working for clients of different countries (spain, france…) and need to translate those texts…

thanks for your answer

Hi Simon - The text on the form error messages can be changed with a little custom javascript. Check out our support article below for detailed instructions:

http://support.unbounce.com/entries/2…

Johnny,

the link you have posted is not working anymore. Is the article about changing the text on the form error message with custom javascript still available somewhere?

Hi Florian - we just did a pretty major update to our documentation–unfortunately, some of the redirects to the new articles aren’t working properly though. You can find the info on changing the form validation error text here now: http://documentation.unbounce.com/hc/en-us/articles/203799174-Adding-and-Editing-Form-Fields#content…

@Justin, thanks for the handy tip.

Quick note that you forgot to include the styling of the header, which is:

.lp-form-errors div.content div.error {

background-color:#661414;

padding:8px;

font-size:14px;

line-height:18px;

font-weight:bold;

color:#f3d8d8;

}