List page menu with children and grandchildren in wordpress

Question

Okay so it's been over a year since I made a WordPress theme and now I've started again but I've run into a problem with my menu on pages.

This is my current page hierarchy (I'm still only testing hence the names)

Home

This page
 *Child 1
  **Grandchild 1
  **Grandchild 2
 *Child 2
  **Grandchild 3
  **Grandchild 4
  **Grandchild 5
 *Child 3
  **Grandchild 6

Another page

Now when I visit "This page" I want to show a link to "This page" (current) and all the direct childs (no grandchildren here) of "This page" like in this sketch: http://img840.imageshack.us/img840/3006/thispage.png

Now when i visit a "Child 1" of "This page" I want to show everything from above menu and all childs of "Child 1" (Grandchild 1 & 2) in a sub ul under "Child 1" like in this sketch: http://img4.imageshack.us/img4/7868/child1.png

And now when I visit "Grandchild 1" I want to show the same menu as I did for "Child 1" only with "Grandchild 1" as current item instead like in this sketch: http://img819.imageshack.us/img819/1633/grandchild1.png

This is my current code based on the example in the wordpress codex (under wp_list_pages() function) for a slightly other type of menu but it isn't working very well and absolutely not well for the godchildren.

<?php
if($post->post_parent){
 $children = wp_list_pages("title_li=&include=".$post->post_parent."&echo=0");
 $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) { ?>
 <div class="page-menu">
 <ul>
 <?php echo $children; ?>
 </ul>
 </div>
<?php } ?>

My plan is to have the menu as a sidebar on my page as you can see in the sketches.

So does anyone know how one could achieve this result?

score 0 · Answer 1 · answered Dec 03 '10 at 18:32

I would strongly recommend just using wp_list_pages(), and then bring in CSS to hide parts you don't want visible (there are plenty of classes outputted by the function, check your source to see what's available).

In addition, you're also going to make it a lot easier for search engines (and users, if they're using a limited browser or accessibility enhancement) to browse your site, since the entire hierarchy is always there in the HTML.

List page menu with children and grandchildren in wordpress

1 Answers1