Skip to main content
Mar 1, 2013 3:28 PM UTC
Solved

Form Error Message Placement

Hi Everyone -- I've conducted some searches on this topic and haven't been able to find an answer. I would like to determine where the 'error message' for forms is placed. Currently our error messages are appearing on the right hand side of the form (which is appearing on the iframe but off the view screen -- here's an example of what I'm talking about: schoolwires.com/makeoverreferral). We would like to avoid expanding the ifame window, hence why we are trying to relocate the error message.

Is there any way that we can choose where the error message gets displayed?

Thank you for your help!
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Accepted solution
Mar 26, 2013 6:54 PM UTC
I have implemented this and it is supported in major browsers. Hope it helps! 
 
Moving the error messages
 
Depending on how you set up your form, the error messages that appear on each field may be in the wrong position. Use this CSS to move the error messages below the field. You may need to tweak the left or top amounts until it appears correct on your form.
 
<style type="text/css">
span.mktFormMsg
  {
    left: 0px !important;
    top: 15px !important;
  }
</style>
 
Source: https://community.marketo.com/MarketoArticle?id=kA050000000Kyss

6 replies

Mar 1, 2013 6:24 PM UTC
I have seen the error messages moved to either above or below the field input.  You would have to include some custom CSS on your landing page to achieve this.
Translate
Mar 1, 2013 7:16 PM UTC
Thanks Kenny!
Do you have a reference you could point me towards for the custom CSS that I could share with my web designer?
Translate
Mar 7, 2013 2:23 PM UTC
We are facingi the same challenge...where could we see examples of custom CSS that would put the error messages below the field input?  Thanks!
Translate
Mar 26, 2013 6:45 PM UTC

h

Translate
Accepted solution
Mar 26, 2013 6:54 PM UTC
I have implemented this and it is supported in major browsers. Hope it helps! 
 
Moving the error messages
 
Depending on how you set up your form, the error messages that appear on each field may be in the wrong position. Use this CSS to move the error messages below the field. You may need to tweak the left or top amounts until it appears correct on your form.
 
<style type="text/css">
span.mktFormMsg
  {
    left: 0px !important;
    top: 15px !important;
  }
</style>
 
Source: https://community.marketo.com/MarketoArticle?id=kA050000000Kyss
Translate
Nov 5, 2013 3:06 AM UTC
wow, it's really helpful Preet!

Thanks
Translate