Solved

Change the color of a single main menu item

Sauravb
Tourist
6 0 2

Hello,


I need help for CSS coding on Studio Theme -> I would like to change the text color of only one of my main navigation menu to highlight it.

 

The "Sale" navigation menu should appear in RED rather than black for both Mobile and Desktop 


I tried to quibble with the code but nothing to do, the color does not change. I'm having trouble identifying my menu or placing my code incorrectly on my CSS stylesheet.

 

Website - https://tabeerhomes.com

Theme - Impact

Accepted Solution (1)

Made4uo-Ribe
Shopify Partner
6383 1533 1903

This is an accepted solution.

Hi @Sauravb 

Check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

a[href="/collections/sale"] { 
    color: red;
}

 

And Save. 

Result:

Made4uoRibe_0-1714079795105.pngMade4uoRibe_1-1714079804121.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Replies 6 (6)

Made4uo-Ribe
Shopify Partner
6383 1533 1903

This is an accepted solution.

Hi @Sauravb 

Check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

a[href="/collections/sale"] { 
    color: red;
}

 

And Save. 

Result:

Made4uoRibe_0-1714079795105.pngMade4uoRibe_1-1714079804121.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Sauravb
Tourist
6 0 2

Thank you so much!

vixaclay
Visitor
2 0 1

Hello, I am trying to do the same and change the color of my Swim Category to Pink. I was able to change the sale menu item on my website to red, but when i do the same with the swim dropdown menu it does not change it. My website is vixafashion.com. 

Thanks

Made4uo-Ribe
Shopify Partner
6383 1533 1903

Hi @vixaclay 

Check this one. Same instruction. 

 

summary#HeaderMenu-swim {
    color: pink;
}

 

And save. 

Result:

Made4uoRibe_0-1714418641872.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
vixaclay
Visitor
2 0 1

That worked for desktop! Is there a way to make it pink for mobile as well?

Made4uo-Ribe
Shopify Partner
6383 1533 1903

Yep, sure. Same Instruction. 

 

summary#HeaderDrawer-swim {
    color: pink;
}

 

And Save. 

Result:

Made4uoRibe_0-1714581786204.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.