Code To Create Two Tiered Conditional Navigation In WordPress?

Hi,

To Display Two Tiered Conditional Navingation In wordpress need to use this code which you need to add in menu file of your theme:

ul id=”nav”>
<?php wp_list_pages(‘title_li=&depth=1′); ?>
</ul>

<?php if($post->post_parent)
$children = wp_list_pages(“title_li=&child_of=”.$post->post_parent.”&echo=0″); else
$children = wp_list_pages(“title_li=&child_of=”.$post->ID.”&echo=0″);
if ($children) { ?>
<ul id=”subnav”>
<?php echo $children; ?>
</ul>
<?php } else { ?>
<?php } ?>

And Add this code in style.css file of your theme:

* {
margin:0;
padding:0
}

#nav
{
background:#577da2;
border-bottom:1px solid #FFF;
height:32px;
}

#nav li
{
margin-right:25px;
}

#nav li, #subnav li
{
float:left;
list-style:none
}

#nav a, #nav a:visited
{
color:#FFF;
text-decoration:none;
font-weight:bold
}

#nav a:hover, #nav a:active,
li.current_page_parent a,
li.current_page_parent a:visited,
#nav li.current_page_item a,
#nav li.current_page_item a:visited
{
background:#295887
}

#subnav
{
background:#e6eef7;
border-top:2px solid #577da2;
border-bottom:2px solid #cad8e6;
height:28px;
}

#subnav li
{
border-right:1px solid #295887;
padding:0 7px;
}

#subnav a, #subnav a:visited
{
color:#295887;
text-decoration:none;
font-weight:bold
}

#subnav a:hover, #subnav a:active,
#subnav li.current_page_item a,
#subnav li.current_page_item a:visited
{
text-decoration:underline
}

Thanks,

Shane G.

Popularity: 1%