EEConf 2024 is around the corner! EEConf 2024
How does one style inline form errors for membership registration? In the source code for example, one field looks like this before submitting with an error:
<label for=”username”>Username*: </label> <input type=”text” name=”username” id=”username” value=”“/>
After submitting and an error message, the source looks like this:
<label for=”username”>Username*: This field is required.</label> <input type=”text” name=”username” id=”username” value=”“/>
My question is how do we apply a class or any kind of styling to the error message, so that it can stand out, when it just becomes a part of the label tag? There doesn’t appear to be a way to add a class to error messages, so how can we make them look different and stand out?
Are you using the old style “Member profile” templates or the later registration form tags? https://docs.expressionengine.com/latest/member/registration.html
If you’re using the newer registration form the example gives you for instance:
<label for="username">Username*: {if error:username}{error:username}{/if}</label>
<input type="text" name="username" id="username" value="{if username}{username}{/if}"/>
You can add a span
tag to the error tag to give you a styling hook:
{if error:username}<span class="your_class">{error:username}</span>{/if}
Packet Tide owns and develops ExpressionEngine. © Packet Tide, All Rights Reserved.