Change color of one item in main menu to red (Impulse Theme)

marky1
New Member
1 0 0

Hi Guys,

I'm using the impulse theme, and I wanted to change one item's color to red in the main menu. I tried the ways in the forum already, but they didn't work. So I'm wondering if anyone know how to deal with it. My website is planetlinen.com.au. The item I want to change is the SUPERSALE

Replies 41 (41)
AlexEffron
Shopify Partner
2682 387 1047

For that, I need to analyze your website and then I can provide any solution over here.


So Please provide website URL and if your store is password protected then also provide password

oscprofessional
Shopify Partner
11586 1813 2318

Hello marky1,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css

header#SiteHeader a[href="/collections/super-sale"] {
    color: red !important;
}
Please Like and Accept Solution. Free website audit to grow your business Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
AlexEffron
Shopify Partner
2682 387 1047

Please place this code at the end of Assets -> theme.scss.liquid file

a[href="/collections/super-sale"]  {
color: #ff0000 !important;
}



MS-WEB-DESIGNER
Shopify Partner
3012 181 488

Dear @marky1 

  1. From your Shopify admin, go to Online Store > themes.
  2. Locate your current theme and then click Actions > Edit code.
  3. After that in the Assets folder, click to open your theme.scss.liquid file.
  4. Go to the very bottom of this file and paste the following code:

 

/* Start */
#SiteHeader > div.page-width > div.text-center > ul > li:nth-child(8) a { color: white; background: red !important; }
/* End*/

 

  • Save and check your theme by refreshing it.
Click Here to Hire Shopify Store Customization Experts
Boost Conversions & Average Order Value with this
Best App for Sticky Add To Cart
EllaBrown2021
Excursionist
92 0 9

Have you solved this problem?

Mark118
Excursionist
49 0 3

Hi,

Did you ever find a solution to this? None of the replies below worked for me.

Thanks

Mark

AlexEffron
Shopify Partner
2682 387 1047

@Mark118 

I read your problem and it seems that I need to analyze your website to provide the solution here.
Would you please share your website URL and if your website is password protected then also provide the password.

Mark118
Excursionist
49 0 3

Hi ,

Thank you for your reply. 

My site is frontiers-woman.com  

Thanks, Mark

 

AlexEffron
Shopify Partner
2682 387 1047
Mark118
Excursionist
49 0 3

The Sale menu - in red would be ideal!

Thanks

AlexEffron
Shopify Partner
2682 387 1047

@Mark118 

Please Go to Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid and paste this code at the end of this file.

a[href="/collections/sale"] {
color: #ff0000 !important;
}

 

Mark118
Excursionist
49 0 3

Hi HardikDavra

I added the code - see below - but no change on the site....

Mark118_0-1629451644818.png

 

oscprofessional
Shopify Partner
11586 1813 2318

Hello,
you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!
Please Share your store live url with password (if it password protected) where you want to do modification, so that I will solve your issue here!

Please Like and Accept Solution. Free website audit to grow your business Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
Mark118
Excursionist
49 0 3

Hi there, thanks for your reply. 

Store - frontiers-woman.com

I'm looking for the Sale menu on the nav bar to be in red.

Best,

Mark

oscprofessional
Shopify Partner
11586 1813 2318

 

li.site-nav__item.site-nav__expanded-item.site-nav--has-dropdown:last-child a {
    color: red;
}
.site-nav--has-dropdown:last-child a:hover {
    color: red !important;
}
a.site-nav__dropdown-link.site-nav__dropdown-link--second-level {
    color: #000 !important;
}

 

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

Please Like and Accept Solution. Free website audit to grow your business Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
Mark118
Excursionist
49 0 3

Hi,

I added that code but it doesn't seem to work:-

Mark118_0-1629458507425.png

 

Any ideas?

Many thanks, Mark

oscprofessional
Shopify Partner
11586 1813 2318

Add css at the top or in between

Please Like and Accept Solution. Free website audit to grow your business Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
Mark118
Excursionist
49 0 3

Added it to the very top and it works perfectly - thanks very much. 

Is there any way for it display in red on mobile view?

 

oscprofessional
Shopify Partner
11586 1813 2318
@media only screen and(max-width:749px){
a#Label-collections-sale7 {
    color: red;
}
}

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

Please Like and Accept Solution. Free website audit to grow your business Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing