Manchester based web developer and designer of high quality websites, printed matter and moving images.

Been developing a solution for a new corporate site in development. Utilizing WordPress as a fully blown CMS, a major priority was developing a dynamic sub navigation solution within the theme. I found loads of sub menu and section navigation plug-ins but there where all a little too complicated.

Additionally I came up against two other issues:

1. Finding out the depth of the page within the hierarchy of the site.
2. Control over whether the menu displayed “sibling” links or “children” links.

A lot of the existing tutorials are great, but their implementation is very broad. The “wp_list_pages” function within WordPress is great, very flexible and well documented. Yet swapping between section or child menu based on page depth seemed to be a dead end. Until I read this great tutorial by Jake Goldman talking about a hardly mentioned but great function, called “get_post_ancestors();”. This cool function will create an array of the current posts ancestors. Using this I expanded on Jake Goldman’s great article, adding a little more finite control over the submenu.

Page depth and sibling / child code for WordPress

Heres the PHP code I dropped into the sidebar.php of my Wordpress theme. Hopefully should be of use. My example displays the sibling/ section links into the navigation. While displaying the child links for all the pages higher in the hiarachy. Hope this code is usefull.

#Creates Array from the pages ancestors post ID's
$post_ancestors = get_post_ancestors($post);

#Un-comment array for guidence
#print_r($post_ancestors);

#Gets the base post id
$top_page = array_pop($post_ancestors);

#Get post depth
#After a certain depth into the page hierarchy the page displays sibling menu items in sub menu.

if (count($post_ancestors) <= 1) {
#Shallow Link Display Children
$children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0&depth=1');

 } elseif (count($post_ancestors) >= 2) {

#Deep Link Display Siblings or Section Links
$children = wp_list_pages('title_li=&child_of='.$post->post_parent.'&echo=0&depth=1');

} elseif (is_page()) {

#Default Display Children
$children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0&depth=1');

} 

if ($children) {
#Outputs the submenu if it exists
echo('
Sub Menu');
echo($children);
echo('

');

Example of the hierarchy of the site

• Locations
  • Manchester
  • Dubai
  • Turkey
  • Dubai Marina
    • Botanica
    • The Torch
      • Overview
      • Facilities
      • Properties
        • 2 Bedroom Apartment
      • Payment Plans
      • FAQ’s