I've created a Dynamic Menu that highlights the selected page and colors for example the blog page "red" while the other links (home, about, contanct) remain white.
My question is how can I make the Dynamic Menu work when say the blog goes to /blog/page/2/ and have the blog remain red instead of dropping the highlight?
Here's the code for my menu.
< nav id="menu" class="mid" role="navigation">
< ?php wp_nav_menu( array( 'theme_location' => 'primary-menu' ) ); ?>
< /nav>
Then, I register the menu inside the functions.php
add_action( 'init', 'register_my_menu' );
function register_my_menu() {
register_nav_menu( 'primary-menu', __( 'Primary Menu' ) );
}
Here's the CSS that highlights the .current-menu-item
#menu .current-menu-item a {
opacity: 1.0;
}
This is when the Menu is Active on example.com/work
This is when the Menu is Active on the example.com/blog *just the first blog page though
This is the menu when it switches to example.com/blog/page/2, example.com/work/showcase/website1337
How, can I make it so that the Dynamic Menu detects that /page/2 is still associated with the parent page "/blog/, /work/" and is still highlighted like images 1 and 2?
Thanks :3