I want to customize the error message box which comes for various errors. i want only a single custom message for all types of errors and also a different custom icon. How can i implement this?

2 Answers 2


You can overwrite the standard salesforce error message css classes. In my example i have a simple error message with only short summary and a custom icon. So i took all error css classes and changed the icon. Then i have wrapped my message in a outputPanel and edited the message class (but only for this output panel): removed background and border. You can pack that two css classes to the static resource and include on your pages. Don't forget to wrap the custom message into the output pannel:

.errorM4 .msgIcon, .errorSmall {
    background-image: url(/img/samples/flag_red.gif) !important;

.myCustomMessage .message {
    background: none  !important;
    border: none !important;


    <apex:outputPanel styleClass="myCustomMessage">
        <apex:pageMessage severity="error"
                          summary="Some error text" />

Standard error message layout:

enter image description here

Customized error message:

enter image description here


Sergey's trick is pretty nifty, but theoretically the css class names etc may change without warning. To solve this, instead, you may want to implement your own error / exception handling class and visualforce component to display any errors in the view.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .