If you’ve been following the recent trends with premium WordPress themes, you’ve probably noticed that the two-tiered navigation menu has become extremely popular. An example of this is the popular Revolution WordPress themes. This style of menu can be used in a variety of ways, but the most common seems to be to display your children pages in a menu below your blog’s parent pages.
If you’ve wondered how to hack your existing WordPress theme to accomplish something along these lines, Darren Hoyt has taken the time to explain this in his post Creating Two-Tiered Conditional Navigation in WordPress. Here is the PHP you’ll need:
<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 } ?>
Once you’ve got the code in place, you’ll want to style it to look the way you want it to. Click over to Darren’s post to get the styling information!
Kyle Eslick
Kyle Eslick is the founder and primary author of WordPress Hacks. You can learn more about him at KyleEslick.com or you can follow his personal tweets here.
I also love using the editor image its fantastic and very useful. 
Kyle,
Your blog has been recommended to us as a interviewee's favorite blog!
We would like to do an interview with you ...
Looking through some more recent theme frameworks for Wordpress and stumbled upon this one.
The link for the demo seems ...
Great theme, I only have one problem, the smooth gallery will not accept images from my server so I had ...
Nice hack, I’ll traslate the tip in my blog
Thank you for the tip!
If anyone is interested, I wrote a similar article for creating à dropdown menu for categories/sub-categories.
The article is in French and can be read here.
This works great for my site where I have a “services” parent page and a several child pages with detailed information on each service.
I stripped out the “pages” element so it only displays the children as subnav li’s as my horiztonal header navigation has the pages links.
however – how can I maintain an active menu state on the parent when viewing a child page as well as an active state on the child?
this is my main nav in the header to acheive active links on the parent pages for each section:
<li class=”">
Thanks for this really usefull hack I will modify my template with this.