Highlight static blog page link in header

Question

I created a navigation bar like tab system for my header and I can get all but my news button to highlight on that page. The news is a static page for all of my blog/news post.

Not sure if it's my code but if anyone has any ideas, much thanks to you.

<?php
$parent_title = get_the_title($post->post_parent);
?>

            <?php
                $items = wp_get_nav_menu_items("main-nav");
                foreach($items as $item): 
            ?>
            <a <?php  if($item->title == $parent_title){ echo 'class="active '.$parent_title.'"';}else{ echo 'class="'.$item->title.'"';} ?> href="<?php echo $item->url; ?>"><?php echo $item->title; ?></a>
            <?php endforeach; ?>

Answer 1

Per your comment:

Because I wanted the freedom to customize the HTML and CSS of the menu. I didn't want the generated html like: ul or li tags. Plus it gives me freedom to set up my links the way I want them. – blackbull77 20 hours ago

You can do all of that with the output from wp_nav_menu() (except for the generated <ul> and <li> tags of course - but then, those tags are semantically correct since you're outputting a list). – Chip Bennett 19 hours ago

Could you show how I can go about this? – blackbull77 44 mins ago

1. Output your list via wp_nav_menu(), referencing the theme_location, like so:

   <?php
   wp_nav_menu( array(
       'theme_location' => 'primary_nav'
   ) );
   ?>
   

2. Target the .current-menu-item CSS class to style according to your needs

3. For the default fallback menu, you can also target the .current_page_item CSS class.
4. To style parent/ancestor menu items, target .current-menu-parent, .current-menu-ancestor, .current_page_parent, and .current_page_ancestor.
5. To add your own, custom CSS classes, use the nav_menu_css_class filter.

Answer 2

I found the answer by accident and I'm going pass it on for anyone that may want to try this out.

Here's how I did it:

<?php if ( is_page() ) {

        $parent_title = get_the_title($posts_page->post_title);
        echo $parent_title;    

 } else {

    $posts_page_id = get_option( 'page_for_posts');
    $posts_page = get_page( $posts_page_id);
    $posts_page_title = $posts_page->post_title;

    $parent_title = $posts_page_title;
    echo $parent_title; 

 } ?>

 <?php
     $items = wp_get_nav_menu_items("main-nav");
     foreach($items as $item): 
  ?>
        <a <?php  if($item->title == $parent_title){ echo 'class="active '.$item->title.'"';}else{ echo 'class="'.$item->title.'"';} ?> href="<?php echo $item->url; ?>"><?php echo $item->title; ?></a>
 <?php endforeach; ?>

What it does is if the post is a page, it will post the title of the parent page other wise it will give you the name of the blog static page title. Hope this help some people.

Special Thanks to DynamicWP article!