How to change the background of one menu item in my header theme sense

Store Design
1

Hi! I want to change the background of one menu item in my header.

The background I want to change is the “request a quote” link/button in my website. I want it to have a different background. Blue is fine.

How do I change this?

Been trying to mess with the liquid code but to no avail. thanks

2

@imattf Please share your store URL and password(If it is password protected.). So that I can check and give you the exact solution.

3
4

Hello @imattf
Please share your website URL.

5

You could try writing something like this:

{% if link.title == 'Request A Quote' %} style="background: blue" {% endif %}
6

tried this out, sadly didn’t work. Maybe I put it in the wrong line? I’ve tried putting it in the links code

in the header file

7

Yes, you could have put it on the mobile menu code, usually there’s two menu lists in the header.liquid file, one for desktop and one for mobile.

8

found the desktop one. still didn’t work :confused:

9

Hello @imattf

I would like to give you a solution to support you:

  1. Go to Online Store-> Theme-> Edit code
  2. Open your theme.liquid theme file
  3. Paste the below code before :
<style>
.header__menu-item[href="/pages/request-a-quote"] {
background-color: blue;
}
.header__menu-item[href="/pages/request-a-quote"] {
color: white !important;
}
</style>

Was my reply helpful? Please Like and Accept Solution. This mean alot to me.