Drop Down menu change color for single menu item

Solved
Karlis
Tourist
7 0 5

Hi,

 

I'm using Dawn theme and would like for Sale collection in the menu to be in red, how can I go about do it? I've added screenshot below to specify which link I'm referring to.

Karlis_0-1698227070795.png

 

Accepted Solution (1)
ZestardTech
Shopify Expert
5300 950 1260

This is an accepted solution.

Hello There,

 

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

 

.list-unstyled a[href="/collections/sale-1"] {
color: red!important;
}
.list-unstyled a[href="/collections/sale"] {
color: red!important;
}

 

ZestardTech_0-1698309906980.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

View solution in original post

Replies 9 (9)
ZestardTech
Shopify Expert
5300 950 1260

Hello There,

Please share your store URL and password.
So that I will check and let you know the exact solution here.

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
Karlis
Tourist
7 0 5

Hi,

 

The url of the store

Thank you!

ZestardTech
Shopify Expert
5300 950 1260

This is an accepted solution.

Hello There,

 

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

 

.list-unstyled a[href="/collections/sale-1"] {
color: red!important;
}
.list-unstyled a[href="/collections/sale"] {
color: red!important;
}

 

ZestardTech_0-1698309906980.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
Karlis
Tourist
7 0 5

Thank you! 

ZestardTech
Shopify Expert
5300 950 1260

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.

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
sahilsharma9515
Shopify Partner
347 32 57

Hi @Karlis 

 

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

 

Best Regards,

Sahil

- Your

 Coffee Tip 

can create magic in coding ❤️❤️

- Need a Shopify Developer? CHAT ON WHATSAPP or EMAIL ME !


- Hopefully the solution will help you. If yes then Please hit

 Like 

and

 Mark it as solution! ❤️


DavidEKim
Shopify Partner
392 131 163

@Karlis 

Hi,

Please follow the steps below to make the "Sale" menu item in red.

1. Go to online store > ... (next to customize) > Edit code 

2. In code editor, please go to Snippets > open "header-dropdown-menu.liquid" file

3. Please find the code below in line 45 & line 53

 

{{ childlink.title | escape }}

 

 

4. Replace the code with this code.

 

{{ childlink.title | replace:'Sale','<span style="color:red;">Sale</span>' }}

 

 

5. Save the file.

It should be in red now.

 

Before

20231025_203718.jpg

 

After

20231025_203621.jpg

 

Actual look

20231025_203959.jpg

 

 

I hope it helps.

If helpful, please Like and Accept Solution.
Want to customize your store, please feel free to contact me.
PeopleVillage - Shopify Partner
Karlis
Tourist
7 0 5

Hi,

 

Thank you. I tried but it didn't work. Initially I thought that it is because I changed it to On Sale, both in menu and in code, but then I switched back to Sale in both places, but still didn't work. Am I doing it correctly? 

Karlis_0-1698244793470.png

 

Made4uo-Ribe
Shopify Partner
4015 917 1124

Hi @Karlis 

Would you mind to share your Store URL website? with password if its unpublish. You can also PM us if you dont like to share your store URL. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com