• I needed to have a sub-navigation for a WordPress template I am developing, and after searching the entire WordPress Codex, and what seems like the entire Internet, I came up with the following solution:

    Requirements

    • Has to include the top parent page title and link (if the page is in the about section, I needed to include the about section title and link in the side navigation).
    • Lists child pages only 1 level deep, and stays that way on even 3+ level sub pages (Only tested 3rd level pages).
    • No plugin required.

    Solution

    <?php
    	if(!$post->post_parent){
    		// will display the subpages of this top level page
    		$master = wp_list_pages("title_li=&include=".$post->ID."&child_of=".$post->post_parent."&echo=0&depth=1");
    		$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0&depth=1");
    	}else{
    		// diplays only the subpages of parent level
    		//$children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0&depth=1");
    
    		if($post->ancestors)
    		{
    			// now you can get the the top ID of this page
    			// wp is putting the ids DESC, thats why the top level ID is the last one
    			$ancestors = end($post->ancestors);
    			$post_ancestors = get_post_ancestors($post);
    			$master = wp_list_pages("title_li=&include=".array_pop($post_ancestors)."&echo=0&depth=1");
    			$children = wp_list_pages("title_li=&child_of=".$ancestors."&echo=0&depth=1");
    			// you will always get the whole subpages list
    		}
    	}
    
    	if ($children) { ?>
    		<ul>
    			<?php echo $master . $children; ?>
    		</ul>
    <?php } ?>
Viewing 4 replies - 1 through 4 (of 4 total)
  • Thanks for sharing! I’ve been looking for this solution for the last 2 months!

    The only thing i can’t seem to get to work is: displaying the 3rd level of the navigation correctly. As you can see here the 3rd level is always showing the last navigation items in the array, in this case the children of the (child)page “parts”. And not the children of the current (child)page.

    Do you know how i can solve this problem? This is the code i’m using.
    Much appreciated.

    function custom_subnav(){
    	global $post;
    
    	if(!$post->post_parent){
    		// will display the subpages of this top level page
    		$master = wp_list_pages("title_li=&include=".$post->ID."&child_of=".$post->post_parent."&echo=0&depth=1");
    		$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0&depth=1");
    	}else{
    		// diplays only the subpages of parent level
    		$children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0&depth=1");
    
    		if($post->ancestors)
    		{
    			// now you can get the the top ID of this page
    			// wp is putting the ids DESC, thats why the top level ID is the last one
    			$ancestors = end($post->ancestors);
    			$post_ancestors = get_post_ancestors($post);
    			$master = wp_list_pages("title_li=&include=".array_pop($post_ancestors)."&echo=0&depth=1");
    			$children = wp_list_pages("title_li=&child_of=".$ancestors."&echo=0&depth=2");
    
    			if(count($ancestors) >= 1){
    				$style = "style=height:64px;";
    			}
    			// you will always get the whole subpages list
    		}
    	}
    
    	if ($children) {
    		$output = '';
    		$output.='<div id="subnavigation" '.$style.' >';
    		$output.='	<div class="subnavouter">';
    		$output.='	<ul>';
    		$output.=		$master . $children;
    		$output.='	</ul>';
    		$output.='</div>';
    	}
    
    	echo $output;
    }

    cheers! Ronny

    Anyone?

    Thread Starter Chiss22

    (@chiss22)

    Hi Ronny,

    Not sure how to fix this. Hopefully someone has a suggestion. You could try a plugin. I usually opt out of plugins so future WordPress templates are easier to code, no need to set up a plugin first. Sometimes you need them though.

    hello Chiss22,

    this i also something I want.
    But i its not working properly: https://www.ruunerwold.nl/bas/vissen

    At the left bottom is your navigation.
    When you click on subpage2, nothing is happening?!

    Whats wrong with the script?

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘3 Level Sub Navigation with Master Page in List’ is closed to new replies.