malihu on "[Plugin: Page scroll to id] multiple menu itemes problm"

i have also a problem with multiple highlitghted menu items.

everything is fine when a extra page is activated.

<ul id="menu-menu-1" class="nav navbar-nav"><li id="menu-item-31" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-31 active">PROFIL
<li id="menu-item-39" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-39 active">ANGEBOT
<li id="menu-item-40" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-40 active">NETZWERK
<li id="menu-item-41" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-41 active">IMPRESSUM / KONTAKT
<li id="menu-item-44" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-44">Blog

when clicking on the onepager link every link is active.

<ul id="menu-menu-1" class="nav navbar-nav"><li id="menu-item-31" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-31">PROFIL
<li id="menu-item-39" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-39">ANGEBOT
<li id="menu-item-40" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-40">NETZWERK
<li id="menu-item-41" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-41">IMPRESSUM / KONTAKT
<li id="menu-item-44" class="menu-item menu-item-type-taxonomy menu-item-object-category current-menu-item menu-item-44 active">Blog

1. could I fix this issue with an entry in the plugin, or should I fix it inside the css?

regards

https://wordpress.org/plugins/page-scroll-to-id/

by the way this is my css for the activated menu item
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #000000;
background-color: #ffffff;
margin-top: 4px;
}

I think your menu items are highlighted by your theme (not the plugin) via the classes current-menu-item and current_page_item. Those classes are applied by wp themes when menu links point to the same page.

This should be fixed in your CSS. You should normally disable the styling for the .current-menu-item and .current_page_item on menu links that are handled by 'Page scroll to id'.

I can't really help though unless I see your page... Can you post your link?

http://www.synagie.de/

The links are not highlighted by the plugin because the selector you've set in "Highlight selector(s)" field is not valid (it seems you've set mPS2id-clicked). You should either remove the value or change it to your actual menu links selector (e.g. .menu-item a[href*='#']).

The active class and the selector .navbar-default .navbar-nav > .active > a are not related to 'Page scroll to id'.

First change the "Highlight selector(s)" value in plugin settings and then edit your CSS in order to remove the .active > a styling and use .mPS2id-highlight to highlight your menu links.

it works, thanks

You have a syntax error. There's an extra parenthesis in the "Highlight selector(s)" value (probably a copy error). Change:

.menu-item a[href*='#'])

to:

.menu-item a[href*='#']

I think I'm having this same issue. Would you happen to know what the css would be in the Fruitful theme code? http://toucodirect.com

@duchesscorp

The CSS can be:

.main-navigation ul li.current_page_item a._mPS2id-h,
.main-navigation ul li.current-menu-item a._mPS2id-h,
.main-navigation ul li.current_page_item a[data-ps2id-api='true'],
.main-navigation ul li.current-menu-item a[data-ps2id-api='true']{ color: inherit; background-color: inherit;
}
.main-navigation ul li.current_page_item a.mPS2id-highlight{ color: #ffffff; background-color: #57a603;
}

You should also define which elements to highlight (because you have many 'Page scroll to id' links in your page that target the same elements). In plugin settings, insert the following value in "Highlight selector(s)" field:

.main-navigation .menu-item a

Great! Thank for that. It worked. However, now the home target doesn't highlight. All the other menu items are working fine. Any ideas?

Try changing the CSS selector from:

.main-navigation ul li.current_page_item a._mPS2id-h,
.main-navigation ul li.current-menu-item a._mPS2id-h,
.main-navigation ul li.current_page_item a[data-ps2id-api='true'],
.main-navigation ul li.current-menu-item a[data-ps2id-api='true']{ /* ... */
}

to:

.main-navigation ul li.current_page_item a._mPS2id-h,
.main-navigation ul li.current-menu-item a._mPS2id-h{ /* ... */
}

I tried that as well as the other CSS code with api in it and both the home button and the target button are solid. I've tried several combinations and none of them only highlight the one. Thoughts?

I may have misunderstood... I thought you just wanted the home link always highlighted because you're always on the home page and its URL is http://toucodirect.com/.

If you want the home link to scroll the page, you need to give it a hash (like your other links), for example http://toucodirect.com/#home and create a home target to the place you want (the same way you did with services, pricing etc.).