[Resolved] Keep mutisite network menu item highlighted when on other pages.

[Brian]

I have a multisite setup with two menus:
primary: Network menu with each site (made the same on each site using custom links that point to the site)
secondary: Pages menu for that site (different for each site)

Clicking a network menu item goes to the site and correctly highlights that item because the page url matches the menu link.

The problem is that when another page on the same site is selected, the site is no longer highlighted in the network menu.

I assume that I could use the CSS from this forum Q but how can I determine the name of the correct menu item? And where should I place them? (In the custom > additional CSS?)

#menu-item-47 a {
background-color: #8224e3;
color: #ffffff;
}

My site: https://sparkyandbear.com

OR, is there a more appropriate way to setup the menus for multi-site?

~Brian

[Tom]

Hi Brian,

If you right click the menu item and click “Inspect” (in Chrome), you should see the <li> element which will have a unique ID for each menu item.

You’ll need to add the CSS to the page that the menu item should be “current” on, so I would add it using the Simple CSS plugin inside the meta box for each specific page: https://wordpress.org/plugins/simple-css/

[Brian]

That works!

(I placed it in the Customize > Simple CSS for each site, rather than every individual page, but that’s probably what you meant anyways.)

~Brian

[Tom]

Glad you got something working 🙂

[Author]

Posts