add next and previous buttons to learn pages

Author: johnkpaul

themes/learn.jquery.com/functions.php

@@ -10,3 +10,35 @@ function is_subpage() {
         return false;                          // ... the answer to the question is false
     }
 }
+
+if ( version_compare( $wp_version, '3.5-alpha', '<' ) ) :
+    add_filter( 'posts_where_paged', function( $where, $query ) {
+        global $wpdb;
+        if ( $menu_order = absint( $query->get( 'menu_order' ) ) )
+            $where .= " AND $wpdb->posts.menu_order = " . $menu_order;
+        return $where;
+    }, 10, 2 );
+endif;
+
+function get_next_prev_post() {
+    global $post;
+    $menu_order_prev = $post->menu_order - 1;
+    $menu_order_next = $post->menu_order + 1;
+
+    $posts_prev= new WP_Query( array(
+        'post_type' => 'page',
+        'post_status' => 'publish',
+        'menu_order' => $menu_order_prev
+    ) );
+
+    $posts_next= new WP_Query( array(
+        'post_type' => 'page',
+        'post_status' => 'publish',
+        'menu_order' => $menu_order_next
+    ) );
+
+    return array(
+        'prev' => count($posts_prev->posts) ? $posts_prev->posts[0] : NULL,
+        'next' => count($posts_next->posts) ? $posts_next->posts[0] : NULL
+    );
+}

themes/learn.jquery.com/page.php

@@ -1,5 +1,6 @@
 <?php get_header(); ?>
-		
+<?php $next_prev_arr = get_next_prev_post(); ?>
+
   <!-- body -->
   <?php global $sidebar; ?>
   <div id="body" class="clearfix <?php echo $sidebar; ?>">
@@ -14,6 +15,25 @@
 				<h2>Suggestions, Problems, Feedback</h2>
 				<a class="btn" href="<?php echo jq_get_github_url(); ?>"><i class="icon-github"></i>  Open an Issue or Submit a Pull Request on GitHub</a>
 
+
+        <div class='bottom-links'>
+            <?php if (isset($next_prev_arr['prev'])): ?>
+                   <div class='prev'>
+                       <a href="<?php echo $next_prev_arr['prev']->guid; ?>">
+                           <i class="icon-chevron-left"></i>
+                           <?php echo $next_prev_arr['prev']->post_title; ?>
+                       </a>
+                   </div>
+            <?php endif; ?>
+            <?php if (isset($next_prev_arr['next'])): ?>
+                   <div class='next'>
+                       <a href="<?php echo $next_prev_arr['next']->guid; ?>">
+                           <?php echo $next_prev_arr['next']->post_title; ?>
+                           <i class="icon-chevron-right"></i>
+                       </a>
+                   </div>
+            <?php endif; ?>
+        </div>
     </div>
     <!-- /inner -->
 

themes/learn.jquery.com/style.css

@@ -63,3 +63,25 @@ Template: jquery
 #body .inner .icon-github {
         color:#30b9f8;
 }
+#body .inner .bottom-links {
+        background:lightGray;
+        overflow:auto;
+        padding:0px 20px;
+        clear:left;
+}
+#body .inner .bottom-links i{
+}
+#body .inner .bottom-links a{
+        text-decoration:none;
+}
+#body .inner .bottom-links .prev, #body .inner .bottom-links .next  {
+        color:gray;
+        font-size:1.5em;
+        line-height:2em;
+}
+#body .inner .bottom-links .prev {
+        float:left;
+}
+#body .inner .bottom-links .next  {
+        float:right;
+}