Prev/Next child navigation for current page?

7 comments

1. All right, here it is, fully working:

   <?php
   $pagelist = get_pages("child_of=".$post->post_parent."&parent=".$post->post_parent."&sort_column=menu_order&sort_order=asc");
   $pages = array();
   foreach ($pagelist as $page) {
      $pages[] += $page->ID;
   }
   
   $current = array_search($post->ID, $pages);
   $prevID = $pages[$current-1];
   $nextID = $pages[$current+1];
   ?>
   
   <div class="navigation">
   <?php if (!empty($prevID)) { ?>
   <div class="previous">
   <a href="<?php echo get_permalink($prevID); ?>" title="<?php echo get_the_title($prevID); ?>">Previous</a>
   
   </div>
   <?php }
   if (!empty($nextID)) { ?>
   <div class="Next">
   <a href="<?php echo get_permalink($nextID); ?>" title="<?php echo get_the_title($nextID); ?>">Next</a>
   </div>
   <?php } ?>
   </div>
   

   One little cosmetic thing needs to get fixed, and that is that the “Previous” and “Next” links always should be shown, whether or not there are any more pages…

   Log in to Reply

2. Great hack, it did what I was looking for.
   I thaught some of you might be interrested in what I added, that is: alternative links

   • to the first child page when you are browsing the parent page
   • to the parent when you are browsing the first child page

   the nav is not displayed when not necessary, the styling fits the one the twenty-thirteen theme applies to post navigation.

   <?php // display nav only if there are child pages
   if ($post->post_parent) { // applies only to child pages 
   $pagelist = get_pages("child_of=".$post->post_parent."&parent=".$post->post_parent."&sort_column=menu_order&sort_order=asc");
   $pages = array();
   foreach ($pagelist as $page) {
   $pages[] += $page->ID;
   }
   $current = array_search($post->ID, $pages);
   $prevID = $pages[$current-1];
   $nextID = $pages[$current+1];
   ?>
   
   <nav class="navigation post-navigation" role="navigation">
   <div class="nav-links">
       <?php if (!empty($prevID)) { /* if we are browsing first child, then link to parent page*/ ?>
           <a rel="prev" href="<?php echo get_permalink($prevID); ?>" title="<?php echo get_the_title($prevID); ?>"><span class="meta-nav">&larr;</span> <?php echo get_the_title($prevID); ?></a>
       <?php }
       else { // else, link to previous child ?>
           <a rel="prev" href="<?php echo get_permalink($post->post_parent); ?>"><span class="meta-nav">&larr;</span> <?php echo get_the_title($post->post_parent); ?></a>
       <?php }
   
       if (!empty($nextID)) { ?>
       <a rel="next" href="<?php echo get_permalink($nextID); ?>" title="<?php echo get_the_title($nextID); ?>"><?php echo get_the_title($nextID); ?> <span class="meta-nav">&rarr;</span></a>
       <?php } ?>
   </div>
   </nav>                      
                       <?php }
                       else { // if we are browsing parent page, then link to first child
   $child_pages = get_pages("child_of=".$post->ID."&parent=".$post->ID."&sort_column=menu_order&sort_order=asc");
   $first_child = $child_pages[0]; ?>
   <?php if (!empty($first_child)) { ?>
   <nav class="navigation post-navigation" role="navigation">
   <div class="nav-links">
       <a rel="next" href="<?php echo get_permalink($first_child->ID); ?>"><?php echo get_the_title($first_child->ID); ?> <span class="meta-nav">&rarr;</span></a>
   
   </div>
   

   Log in to Reply

3. Untested, but this should work:

   First use get_pages to find all other pages (or CPT) with the same parent as the current page. Then find the ‘previous’ and ‘next’ pages.

   function wpse5422_the_page_siblings(){
       $post_id = get_the_ID();
       $parent_id = wp_get_post_parent_id($post_id);
       $post_type = get_post_type($post_id);
   
       $sibling_list = get_pages(array(
            'sort_column'=>'menu_order',
            'sort_order' =>'asc',
            'child_of' =>$parent_id,
            'post_type'=> $post_type
       ));
   
       if( !$sibling_list || is_wp_error($sibling_list) )
           return false;
   
       $pages = array();
       foreach ($sibling_list as $sibling ) {
            $pages[] = $sibling->ID;
        }
   
       $current = array_search($post_id, $pages);
       $prevID = isset($pages[$current-1]) ? $pages[$current-1] : false;
       $nextID = isset($pages[$current+1]) ? $pages[$current+1] : false;
   
       echo wpse5422_display_prev_next($prevID, $nextID);
    }
   

   The above function must be used inside the loop – it takes the current page (or any hierarchical post type) and finds the previous and next sibling page (i.e. of same parent as current page) according to their menu order (this can be changed to date, or title).

   It then uses the following function which takes two IDs as an argument and is simply responsible for producing the output:

    function wpse5422_display_prev_next($prevID=false, $nextID=false){
       if( empty($prevID) && empty($nextID) )
          return false;
   
       $html = '<div class="navigation">';
   
       if( !empty($prevID) ){
            $html .= '<div class="alignleft">';
            $html .= '<a href="'.get_permalink($prevID).'">Previous</a>';
            $html .= '</div>';
        }
   
       if( !empty($nextID) ){
            $html .= '<div class="alignright">';
            $html .= '<a href="'.get_permalink($nextID).'">Next</a>';
            $html .= '</div>';
        }
   
       $html .= '</div><!-- .navigation -->';
   
       return $html;
   }
   

   Where to put this code

   Ideally you should create a plug-in out of it. It will work in functions.php – but really, it shouldn’t be living there.

   Usage

   Inside the Loop, whether you want to display the page links: wpse5422_the_page_siblings();.

   Log in to Reply

4. You could use find the parent page of the current post using post->parent_page, then plug that into get_page_children,obtaining all siblings of the parent page, and then find the next and previous elements in the array that is returned.

   Log in to Reply

5. If you’re open to going the plugin route, which I personally am for this kind of thing, the plugin Ambrosite Next/Previous Page Link Plus is pretty awesome. It supports the functionality that you’re looking for, plus a lot more.

   Log in to Reply

6. To show next and previous links independent of whether or not any more pages are present you need to add some conditional statements:
   (edited the pointless elseif stuff)

   <div class="navigation">
   <?php if (!empty($prevID)) : ?>
   <div class="previous">
   <a href="<?php echo get_permalink($prevID); ?>" 
   title="<?php echo get_the_title($prevID); ?>">Previous</a>
   </div>
   <?php else : ?>
   <div class="previous disabled">
   <a href="#">Previous</a>
   </div>
   <?php endif; ?>
   <?php if (!empty($nextID)) : ?>
   <div class="next">
   <a href="<?php echo get_permalink($nextID); ?>" 
   title="<?php echo get_the_title($nextID); ?>">Next</a>
   </div>
   <?php else : ?>
   <div class="next disabled">
   <a href="#">Next</a>
   </div>
   <?php endif; ?>
   </div>
   

   Log in to Reply

7. The ‘wpse5422_the_page_siblings()‘ solution works great, I cannot comment as my rep is too low, but my only change is to make this line:

   'sort_column'=>'menu_order',
   

   To be this:

   'sort_column'=>'menu_order title',
   

   This way if the user leaves the sort order of every page as 0, it will default to sorting alphabetical by page title.

   Thanks!

   Log in to Reply