Changing font colour of only the SALE option on my header menu to red.

Solved
Highlighted
Tourist
12 0 1

Hi,

 

I am looking to change only one of the header menu (Sale) to a different colour (Red) from the rest of the menu items.

 

I was able to find some code on the forum but it resulted in only changing the colour on the home page and when i navigate to another page it reverts back to the original colour.

 

Any help with this issue would be greatly appreciated.

 

For reference, we are using Turbo-Portland as the theme.

 

Thanks,

 

Nathan

 

 

Annotation 2020-01-07 152852.png

0 Likes
Highlighted
Shopify Partner
129 27 31

I might be able to help, but I'd need your store's URL so I can have a look.

- Yes, we build Shopify Apps. Hit me with your idea: https://vellir.tech
- Let customers preview your products and easily add them to cart with Peek Mode
- Add free, good looking social share icons with built-in analytics to your store with Share Lab
- Manage your new arrivals with Newr
0 Likes
Highlighted
Tourist
12 0 1

Thanks for the reply, the store URL is https://zure.com.au/

0 Likes
Highlighted

This is an accepted solution.

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->styles.scss.css

.vertical-menu li:nth-child(1) a.top_link {
    color: red;
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
Highlighted
Tourist
12 0 1

Thanks, this has resolved my issue!

0 Likes
Highlighted
Shopify Partner
4 0 1

One can also make this edit without having to add any css by simply renaming 'Sale' menu item, within the Main Menu, so that it includes a short bit of html before and after: 

 

<font color=red>SALE</font>

 

Save the navigation menu and refresh your screen and the Sale menu should now display red.

 

Sons of Odin - viking jewellry skull biker rings  motorcycle jewelry ~.png

Highlighted
Tourist
12 0 1

Thanks for the alternate method, will keep it in mind for next time.

Highlighted
New Member
1 0 0

Hi, I need help with this too. 

I tried doing it but i dont have the styles.scss.css asset. 

my website is www.elandmar.com

Thanks!!

0 Likes