Archived topic
change anchor links in primary navigation on subpage and keep menu hover
7 replies · Started by Sandro on January 27, 2022
Hi there,
I am building a "one-page" website with anchor links within the primary navigation to get to the different sections. However, I do also have two subpages ("Impressum" and "Datenschutz") from which the user needs to be able to get back to the main-page, but of course this is not possible with only anchor links.
Therefore I have added a "/" before the anchor links (/#services), which pretty much does the thing in terms of navigation. But then I get the problem that on the main page all menu items are always displayed as "current" and therefore the hover does not work anymore.
how can i manage this differently?
thank you very much in advance.
Hi there,
yeah thats WP for you, every link on a page will be given a current-menu-* class which is what GP uses for current menu styles. Question: Do you need to highlight the specific on page menu item ? If so you will need a plugin like this:
Hi David,
thank you very much for your response.
I managed to get things done in terms of highlighting the menu item when it was clicked, but only when I delete the "/" before "#" in the custom links. I still didn't manage to get it fixed so that the links on the subpages also work (to get back to the main page)...
:-(
Do you have any suggestions?
Thank you & cheers,
Sandro
Hi Sandro,
Are you using the plugin right now?
Can you link us to your site?
Hi Ying,
sorry for my late reply.
I have added the link in the private information section.
Many thanks for checking!
So first in Customizer > Colors --> Primary Navigation you need to set the Current Color to match the Initial Color.
Then we use some CSS to change the color of the current item that the plugin highlights:
.main-navigation .main-nav ul li a.mPS2id-highlight {
color: #cca131;
}Thank you very much. It works.
Glad to hear that!
