May you please help me. My website is www.wardrobenthings.com .I want to make SALE on the menu to show in red and I have tried everything recommended in previous posts but it is not working. May you please assist me. Thank you.
Topic summary
A website owner is seeking help to change the color of the “SALE” menu item to red on their website (www.wardrobenthings.com).
The user has already attempted solutions from previous forum posts without success and is requesting specific assistance to resolve this styling issue.
2 Likes
Here’s a quick fix you can try:
-
Go to your theme editor → Edit code → Assets → base.css (or theme.css).
-
Scroll to the bottom and add this snippet:
a[href*="sale"] {
color: red !important;
font-weight: 600;
}
- Save and refresh your store page — make sure your menu item is exactly called “SALE” or links to something like
/collections/sale.
If that doesn’t reflect, your theme might be using a dynamic header menu structure (like Dawn 9+), which requires targeting its specific menu class. If coding is feeling too technical I can come in and aid you.
1 Like
Please add this code to Custom CSS of them settings
.menu-tool a[href="/collections/on-sale"] { color: red !important; }
Best regards,
Dan from Ryviu: Product Reviews App
I checked your website www.wardrobenthings.com. To make the SALE menu show in red, it usually involves updating either your theme settings or adding a small CSS snippet. Some themes don’t allow this via the standard menu editor, which is likely why previous solutions haven’t worked.
If you want, I can provide the exact CSS code or even implement it for you to ensure it works perfectly. Feel free to reach out, and I can help get this fixed professionally.
— Paul | Shopify Expert & Freelance Developer
Hi @presharcy
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset > timber.scss.css and paste this at the bottow of the file:
.site-nav a[href*="/on-sale"] span {
color: red !important;
font-weight: 600;
}
.site-nav a[href*="/on-sale"]:hover span {
color: #d00000 !important;
text-decoration: underline;
}
1 Like
Hi @presharcy
- Go to Online Store → Theme → Edit code.
- Open your theme.css or base.css file and find this code in the file:
.site-nav > li > a span {
color: black !important;
}
.site-nav > li > a[href="/collections/on-sale"] span {
color: red !important;
}
If this code works, please mark my comment as the solution.
Thank You!
Thank you so much. It worked perfectly. I really appreciate it.
1 Like
Hi @presharcy
Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance. If helpful, please like all posts.
Best regards,
Devcoder 
1 Like