Dynamic WordPress Page Navigation

PHP
1

I’m looking for help in coding a WordPress driven navigation for the many pages and sub-pages of a website. The example site is on a test server that has the navigation hard coded for each page so I could fine tune the expected behavior before diving into the WordPress logic and the wp_list_pages() function. Here is the link to the test site.

The navigation hierarchy will look something like this:


Parent Page 1
 - Child Page 1
 - - Sub-Child Page 1
 - - Sub-Child Page 2
 - - Sub-Child Page 3
 - Child Page 2
 - - Sub-Child Page 1
 - - Sub-Child Page 2
 - - Sub-Child Page 3

Parent Page 2
 - Child Page 1
 - - Sub-Child Page 1
 - Child Page 2

Parent Page 3

Parent Page 4

Some parent pages will have have children, some won’t (about us and contact us don’t have children). Some Children will have sub-pages, and some won’t.

The trick is for me to reveal to the visitor only the child page links they need to see. For example, when clicking on a Parent page, I need to show the Children (if any), without showing the Sub-child pages. When clicking on a Child page I then need to show the Sub-child pages. The test site should do a better job demonstrating the desired behavior.

Looking though the WP codex and it’s explanation of wp_list_pages, this is what I have so far:

<?php
 
/* if the current pages has a parent, i.e. we are on a subpage */
if($post->post_parent){
    $children = wp_list_pages("title_li=&include=".$post->post_parent."&echo=0"); // list the parent page
    $children .= wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0"); // append the list of children pages to the same $children variable
}
 
/* else if the current page does not have a parent, i.e. this is a top level page */
else {
    $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0"); // form a list of the children of the current page
}
 
/* if we ended up with any pages from the queries above */
if ($children) { ?>
    <ul>
        <?php echo $children; /*print list of pages*/ ?>
    </ul>
<?php } ?>

I’m getting close with this, but the behavior is screwed up. It’s not keeping the parent pages in the list, and treating the Child pages as the first <ul> level. Because of the CSS styling, it’s important that pages get treated with the correct <ul> list level, and that Parent pages remain on every page. And when one level deep, to allow the child pages to remain. When 2 levels deep, allow the sub-child and any other child pages to remain.

I hope I’ve given enough information to start a conversation. Thank you for any help.