Solved

Highlight one menu item in main menu!

iroket
Tourist
6 0 1

In our main menu we have a Mother's Day collection
We want to highlight this in the menu
with #FF9F1C orange background 
can someone help?

https://admin.shopify.com/store/theloomiaa/

Accepted Solution (1)

ThePrimeWeb
Shopify Partner
2122 606 470

This is an accepted solution.

Hey @iroket,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.header__navigation a[href="/collections/mothers-day-collection"] {
    background-color:  #FF9F1C;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1714492937081.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 4 (4)

ThePrimeWeb
Shopify Partner
2122 606 470

This is an accepted solution.

Hey @iroket,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.header__navigation a[href="/collections/mothers-day-collection"] {
    background-color:  #FF9F1C;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1714492937081.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

Made4uo-Ribe
Shopify Partner
6035 1449 1787

Hi @iroket 

You share the wrong Store URL. 

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.❤️❤️❤️
For FREE, premium codes, and trusted, knowledgeable Shopify developers, visit us at

Made4uo.com


iroket
Tourist
6 0 1

hey thank you for this! this works but it does not work on mobile only desktop! is this the only way?

PageFly-Theodor
Globetrotter
576 76 88

Hi @iroket 


This is Theodore from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
<style>
.header__navigation {
    background-color:  #FF9F1C !important;
}
</style>
</style>

Hope this can help you solve the issue

 

Best regards,

Theodore | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.