How to underlined the menu item selected

Hi,

The selector you’ve set in ‘Highlight selector(s)’ seems to be wrong. You have: .header_main_menu_wrapper .menu-item a but there’s no element with class header_main_menu_wrapper in your HTML.

You should change it to something like:
#header .menu-item a
as your top header has the id header.

You should also change .header_main_menu_wrapper to #header or .header-menu in your CSS.

Hope this helps

Hi, thanks for your help. I have tryed to do that, but not functionally ??

You’re welcome ??

I’m sorry if I wasn’t clear. You added the correct selector in plugin settings but not in your CSS.
In your CSS change:

#header or .header-menu

to:

#header .menu-item a.mPS2id-highlight

and add the styling you want for the highlighted links.

From what I’ve seen, something like the following should underline the highlighted links according to your theme’s style:

#header .menu-item a.mPS2id-highlight:after{
    opacity: 1;
    transform: scale(1) translateZ(0);
}

Also, I don’t think you really need the ‘Keep highlight until next’ option, so you can uncheck it in plugin settings.

Let me know

Very very very very very thanks!!!! *_*

The last two question:

1. When I’m over the menu item, the underlined is blue, but I want it in white color
2. When I’m in a section (for example Storage) the items underlined are 2: Home and Storage. Why?

Thanks!!!

No problem.

These are not related to plugin so I can’t be sure if will do exactly what you need:

1. Add something like the following in your CSS:

#top-nav > ul > li:hover > a:after{
    border-color: white;
}

2. “HOME” link is always underlined by your theme’s CSS because you are always on the homepage, which means that the link is considered as current page link.

This rule seems to be defined in style.css line: 1083. You can try changing the CSS rule from:

#top-nav > ul > li > a.hover:after,
#top-nav > ul > li.current-menu-ancestor > a:after,
#top-nav > ul > li.current-menu-item > a:after {
    opacity: 1;
    transform: scale(1) translateZ(0);
}

to:

#top-nav > ul > li > a.hover:after {
    opacity: 1;
    transform: scale(1) translateZ(0);
}

but it all depends on how you want the “HOME” link and other/different pages links to work.

Your support is excellent! Very thanks for all!

You’re welcome