I seem to run into this problem frequently and can never find a solution. I have a Wordpress site with a top navigation. Since this is in my header.php, and used on all pages, I cannot hardcode my active menu state for each page.
How can I dynamically set the activate state to work for each page?
Here is my current nav code:
<nav id="main-menu" class="padbot">
<ul id="ce">
<li class="cemenu"><a href="<?php echo $base_url;?>/about">About</a></li>
<li class="cemenu"><a href="<?php echo $base_url;?>/consulting">Consulting</a></li>
<li class="cemenu"><a href="<?php echo $base_url;?>/intelligence">Intelligence</a></li>
<li class="cemenu"><a href="<?php echo $base_url;?>/academy">Academy</a></li>
<li class="cemenu"><a href="<?php echo $base_url;?>/blog">Blog</a></li>
<li class="cemenu"><a href="<?php echo $base_url;?>/contact">Contact</a></li>
</ul>
I've already setup a CSS class called "active" that has my active state properties. Ideally, what I'm looking for is when your on the "About" page (or any of the other pages), the class I created for the active state will be appended to the current li classes's.
Example:
<li class="cemenu active"><a href="<?php echo $base_url;?>/about">About</a></li>
Thanks!