Solved

How to change color in single navigation menu in Debut Theme - red

boldshapes
New Member
6 0 0

Hey,

I am using Debut Theme on my store boldshapes.co

I would like to change color of "Outlet" only in my header menu to red color or to #FF3333 if possible 

How can i make it?

Capture d’écran 2021-07-28 100800.png

Accepted Solution (1)

diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@boldshapes, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

button[aria-controls*='black-friday'] > .site-nav__label, button[data-target*='black-friday'] .mobile-nav__label{
    color: #FF3333 !important;
}


This will work for all browsers and devices: mobile, tablets and desktop.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

View solution in original post

Replies 10 (10)

ZestardTech
Shopify Expert
5393 970 1291

Hello There,

1.In your Shopify Admin go to online store > themes > actions > edit code
2.Find Asset >theme.scss.css and paste this at the bottom of the file:

ul#SiteNav li:nth-last-child(1)>button.site-nav__link.site-nav__link--main.site-nav__link--button span.site-nav__label {
color: #FF3333!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
boldshapes
New Member
6 0 0

Hello,

thank you for your help but stil doesn't work.

Could you help me ? 

https://www.boldshapes.co/

Thank you

Zworthkey
Shopify Partner
5581 642 1565

@boldshapes 

ul#SiteNav li:last-child > a>span {
    color: red !important;
}

Add this code in theme.scss

boldshapes
New Member
6 0 0

Thank you @Zworthkey , it's working.

 

But i would like the first menu instead of the last one.

The "Black Friday" one.

https://www.boldshapes.co/

How can i change that ?

 

THank you

Zworthkey
Shopify Partner
5581 642 1565
li.site-nav--has-dropdown:first-child > button span {
    color: red !important;
}

@boldshapes 
Add this code and try instead of previous code

ZestardTech
Shopify Expert
5393 970 1291

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.css and paste this at the bottom of the file:

li.site-nav--has-dropdown:first-child > button span {
color: red !important;
}

Screenshot :- https://image.prntscr.com/image/mvjnYx93QuSeLL4IjLSD3g.png

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

Zworthkey
Shopify Partner
5581 642 1565
ul#SiteNav li:nth-last-child(1)>button.site-nav__link.site-nav__link--main.site-nav__link--button span.site-nav__label {
color: #FF3333!important;
}


Add this code to theme.cssThank you.

diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@boldshapes, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

button[aria-controls*='black-friday'] > .site-nav__label, button[data-target*='black-friday'] .mobile-nav__label{
    color: #FF3333 !important;
}


This will work for all browsers and devices: mobile, tablets and desktop.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

boldshapes
New Member
6 0 0

Thank you, that's perfect !

Alia_Makarem
Shopify Partner
63 0 18

Hi Diego,

 

I tried to work this on my website, but nothing changed, please can you help me out with it?

https://radstudiolb.com/

Menu item to change "Outlet", I switched 'black-friday' from your code to 'outlet' , but nothing happened.

 

Thanks,

Alia