This topic has 6 replies, 3 voices, and was last updated 10 years, 1 months ago ago by Olga Barlow
How do you modify the color palette for the alerts (alert type=… I’d like the colors to match the colors I’m using in my client’s website. The default colors totally clash.
Hello,
Please provide us with the link to your site and specify color of what items you want to change.
Thank you.
Regards,
Eva Kemp.
Ideally, we would like them to be colored and set at 80% opacity would be the ideal. But if we not able to change opacity, then use the solid.
alert type=”success” hex #757347 this is a green
alert type=”error” hex #a24033 this is a red
alert type=”info” hex #597b7c this is a blue
alert type=”warning” hex #d4c051 this is a yellow
I’m a little surprised we can’t configure this in the theme since we customize the color palette for the rest of the site. thanks for helping us figure out how to get this done so it matches the brand palette.
Please advise. Thanks.
Hello,
Could you please clarify with more details what exactly you want to change?
Please show us a screenshot to avoid misunderstanding.
Thank you.
Regards,
Eva Kemp.
Hi Eva,
Anywhere an alert of the type success – whether I’ve added a new shipping address, submitted a forgot password correctly or added an item to my cart from a product list page, that alert that by default is green should be the green from my color palette. In this case the hex color should be hex #757347. Since I don’t know every place that 8theme has configured a [success, warning, info, error] type alert to display, I can’t tell you exactly which ones I want to update…I want to update them all – whatever they are.
My developer updated a CSS file and some of the success alerts are now that new color, but not all of them….???? help?
Hello,
You need to add following code in custom.css to override the styles:
.woocommerce-message, .alert-success, .success {background-color: new_color !important;}
.woocommerce-error, .alert-error, .error {background-color: new_color !important;}
.woocommerce-info, .alert-info, .info {background-color: new_color !important;}
.alert-block, .warning {background-color: new_color !important;}
Regards,
Olga Barlow
The issue related to '‘Alert Color’' has been successfully resolved, and the topic is now closed for further responses