Main Menu colour to highlight which Collection/Page you are on

Solved
Highlighted
Tourist
11 1 2

Hello, I have a question on the main menu. I want to have highlighted in a different colour the tab in which the user is in, i.e. if they choose "shop all" that is a different color compared to the others on the main menu navigation. 

 

I just want to avoid having a title on the collection page. 

0 Likes
Highlighted

Hello @ALEXIAKARIDES,

Please share your site url so that I will give you exact solution

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
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
11 1 2

Hello thank you - it is not published yet. However, I am using the broadcast theme 

0 Likes
Highlighted

@ALEXIAKARIDES,

Please add below css in your scss file

.main-menu--active .nav-link {
	color: red;
}

Note: Change color as per your requirement

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
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes

Success.

Tourist
11 1 2

Thank you so much ! It worked. 

 

Can I ask on additional thing please, what do I need to add to make that bold as well? 

 

Many thanks 

0 Likes
Highlighted

Success.

@ALEXIAKARIDES,

To make them bold add below css

.main-menu--active .nav-link {
	font-weight: bold;
}

 

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
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
1 Like