How to keep current-menu-item navbar highlight when on sub menu pages – Themeco Community

How to keep current-menu-item navbar highlight when on sub menu pages

Jen H — Thu, 10 Apr 2014 02:22:35 +0000

I’m using Integrity stack and notice that when on a child page (sub-menu), the parent page does not maintain current-menu-item styling in the main menu navbar. Can you tell me how (or is it possible) to do this?

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Christian — Thu, 10 Apr 2014 12:20:08 +0000

Hey Jen,

In the Customizer > Custom > CSS, please add the code below.

.current-menu-parent a.sf-with-ul {
  color: white !important;
  -webkit-box-shadow: 0 2px 0 0 #ffffff;
  box-shadow: 0 2px 0 0 #ffffff;
}

Hope that helps. 🙂

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Jen H — Fri, 11 Apr 2014 08:04:48 +0000

k thanks – this did the trick for me (yours was missing inset)


.current-menu-parent a.sf-with-ul { 
-webkit-box-shadow: 0 4px 0 0 #F21E29 inset; 
box-shadow: 0 4px 0 0 #F21E29 inset; 
}

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Support — Fri, 11 Apr 2014 08:51:11 +0000

Hey Jen,

Glad that it works for you.

We appreciate that you replied with working code this really helps other users having same issue.

Thanks

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Ying-Fu — Fri, 11 Apr 2014 12:21:51 +0000

Is this also possible for the menu type color since I got rid of the little bar?

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Alexander — Fri, 11 Apr 2014 19:26:24 +0000

Hi Ying-Fu,

Sure, just use color: #abc123; instead of the box shadow rules.

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Dani M — Wed, 16 Apr 2014 16:26:18 +0000

This is exactly what i was looking for.

Only one issue though, i have some pages under more than one parent on the navigation bar. When i click one of these child pages both the menus are highlighted. Any way to only highlight the parent that was used to get to the page?

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Rad — Thu, 17 Apr 2014 00:25:33 +0000

Hi Dani,

Given the code above, you can change it into :

.current-menu-parent > a.sf-with-ul { 
-webkit-box-shadow: 0 4px 0 0 #F21E29 inset; 
box-shadow: 0 4px 0 0 #F21E29 inset; 
}

Hope this helps.

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

ovation — Tue, 24 Feb 2015 23:52:08 +0000

This reply has been marked as private.

Reply To: How to keep current-menu-item navbar highlight when on sub menu pages

Christopher — Wed, 25 Feb 2015 08:10:32 +0000

Hi there,

please try this :

li.current-page-ancestor a span {
color: red;
}

Hope it helps.