Solved

Debut Theme - How do I change just one of the main menu items to a different color?

stainlessbags
New Member
4 0 0

i want to turn the button SALE in the header menu into red color please.

 

This  is my website: www.stainlessbags.com 

 

 

 

 

Accepted Solution (1)

BSS-Commerce
Shopify Expert
3477 461 519

This is an accepted solution.

Hi @stainlessbags ,

Please do the following:

In Online store, select Themes -> ... -> Edit code

view - 2024-04-11T101127.191.png

In the theme.css file, add the following code at the end of the file:

.site-nav.list--inline.site-nav--centered li:last-child{
  background-color: red;
}

view - 2024-04-11T101217.902.png 

Click Save to save changes

view - 2024-04-11T101241.717.png

Hope it helps @stainlessbags 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

View solution in original post

Replies 5 (5)

PageFly-Henry
Astronaut
1075 309 262

Hi @stainlessbags 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: paste bellow code in tag </body> -> save.

PageFlyHenry_0-1712325601299.png

 

 

<style>

[href="/collections/sale-1"] span {

    color: red !important;

}

</style>

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

stainlessbags
New Member
4 0 0

unfortunately nothing changed when i did as you described. 

 

it looks like you are on DAWN theme. i am on Debut theme if that makes sense!

stainlessbags
New Member
4 0 0

can anyone help please ?

 

BSS-Commerce
Shopify Expert
3477 461 519

This is an accepted solution.

Hi @stainlessbags ,

Please do the following:

In Online store, select Themes -> ... -> Edit code

view - 2024-04-11T101127.191.png

In the theme.css file, add the following code at the end of the file:

.site-nav.list--inline.site-nav--centered li:last-child{
  background-color: red;
}

view - 2024-04-11T101217.902.png 

Click Save to save changes

view - 2024-04-11T101241.717.png

Hope it helps @stainlessbags 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

stainlessbags
New Member
4 0 0

thank you for the help, it works great on desktop but not visible on mobile, any solution to that ?