Menu appearance issues

Hi Guys, do you have any idea why does my top menu look different on the main page and on the other pages? My problem is that 2 menu points didn’t change colors with mouse hoover on the main page, but they are already in the hoover color, while they are working well on other pages. I want the main page top menu look the same as the other pages’ main menu. Do you have any idea how I should do this? Here is the url: http://sullivanlegal.net/ Thank you!

Hi There,

That is happening because technically the “Areas of Practice” menu item is in homepage right? You should duplicate your menu and assign the other one as the homepage one page navigation (https://prnt.sc/g6oi30)

While keeping the original one as the Primary Menu (https://prnt.sc/g6oikh)

But since we’re dealing with just one menu item, I could provide you a 2 line custom css for this:

/*Areas of Practice menu item color*/
.x-navbar .x-nav .menu-item-1242 a {color: #fff !important;}
.x-navbar .x-nav .menu-item-1242 a:hover {color: hsl(148,78%,30%) !important;}

Add it on Theme Options > CSS

Hope it helps,
Cheers!

1 Like

HI, thank you, it solved the main problem. Is that possible that the “home” will change to white when mouse is on another menu point? So is that possible that only one menu point is green at a time, default the home, but as soon as the mouse is on another one, only that one? I hope it makes sense :slight_smile:

Hi There,

I understand what you’re trying to do. It is green to indicate that you’re already on that page (current-menu-item), turning it to white because you hover-over other item does not really make sense and it requires a JS script which outside of our support.

Thank you for understanding,