Change colour one single menu item Prestige theme

Solved
JWDMK
Tourist
5 0 1

Hope anyone can help!

 

I would like to change the word "Shoptegoed actie"  in the main menu (both for desktop and mobile) to a different colour (red for example).

https://nl.suitsuit.com/ is the site link. What code/custom css  should I add to the liquid theme file? 

 

Thanks a lot. 

KetanKumar
Shopify Partner
20524 2121 7737

Hello, @JWDMK 

Thanks for post.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.HorizontalList li:last-child a, .SidebarMenu__Nav div:last-child a {
color: red;
}

change the color as you like

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
JWDMK
Tourist
5 0 1

@KetanKumar thanks lot for your help! Unfortunately it changes the cart icon on the far right as all the last items in the dropdown menu as well?Schermafbeelding 2020-05-24 om 11.12.58.png

0 Likes
KetanKumar
Shopify Partner
20524 2121 7737

oh sorry for that can you please update this code

.Header__MainNav .HorizontalList li:last-child a, .SidebarMenu__Nav div:last-child a {
color: red;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
JWDMK
Tourist
5 0 1

Hi @KetanKumar  thanks but unfortunately the mega menu still show the bottom item in same colour as top menu (see attached)Schermafbeelding 2020-05-24 om 13.40.16.png

0 Likes
KetanKumar
Shopify Partner
20524 2121 7737

oh, sorry for repeating

can you please add this code also don't remove firs one just added 

.Header .Link--secondary {
    color: #454545 !important;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
JWDMK
Tourist
5 0 1

Hi @KetanKumar, thank you for you help so far. I just found out that everything works out fine on the desktop site, however, the mobile page still seems troublesome. 
As you can see it is not only the last item in the menu but several other items as well that turn red.. 


Thanks!Schermafbeelding 2020-07-01 om 09.20.06.pngSchermafbeelding 2020-07-01 om 09.20.01.pngSchermafbeelding 2020-07-01 om 09.19.29.png

0 Likes
KetanKumar
Shopify Partner
20524 2121 7737

This is an accepted solution.

@JWDMK 

Thanks for update can you please add this code also

.SidebarMenu .Collapsible, .SidebarMenu .Linklist a.Text--subdued.Link.Link--primary, a.Collapsible__Button.Heading.Text--subdued.Link.Link--primary.u-h7 {
color: rgba(84,86,90,0.5);
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
JWDMK
Tourist
5 0 1

THanks a lot! Seems to work so far! :) 

0 Likes
Gourav07
Excursionist
12 0 3

@KetanKumar need your help with the same

 

please check attached screenshot . . i was able to achieve the same with the help of an article from @Bo wherein i entered the style element in the navigation and then https://community.shopify.com/c/Technical-Q-A/Anyone-know-how-to-change-the-colour-of-one-title-SALE... .

 

and then i followed the method @LittleVentures of removing the "escape" from headers section to achieve what @Bo recommended ! & it worked but :

 

my SALE header menu was displaying twice

and these changes i made, were not reflecting in mobile view !

 

then i followed your method and it worked but i was not able to get the "New" next to "Boondh" to red color !

 

if there's a way i could simply type the CSS in navigation just like what @Bo mentioned and the same works for Prestige theme, that would be great and less cumbersome !

 

looking forward to your response !