Previous and next post links are super useful especially when you have to display posts or portfolio items in a loop. By loop I mean once the user lands on the last portfolio item then the next link should be that of the first portfolio item. WordPress by default does not include an option to add previous and next post links. But it does provide us methods to fetch previous and next post which we will utilize to the fullest.
Previous Post Link in WordPress
To get previous post link we need to first check whether there exists a previous post or not. We can check that by using the below code:
get_adjacent_post(false, "", false);Through get_adjacent_post we can get either the previous or the next post. So, if there exists a previous post then it is very easy to fetch the previous post link.
$link = get_permalink( get_adjacent_post( false, "", false ) );But what if there is no previous post? It means we are on the very first post. In this case we need to redirect our user to the last post. To achieve that we need to use WP_Query.
$args = array(
'post_type' => get_post_type( get_the_ID() ),
'posts_per_page' => 1,
'order' => 'ASC'
);
$last = new WP_Query($args);
if ( $last->have_posts() ) {
while ( $last->have_posts() ){
$last->the_post();
$link = get_permalink();
}
}
wp_reset_query();
The above code works for normal posts as well as any custom post type provided the code is added on the single post page or single custom post type page.
Next Post Link in WordPress
Here we need to first check whether there exists a next post or not. We can check that by using the below code:
get_adjacent_post(false, "", true);If there exists a next post then we can get the next post link easily using the below code.
$link = get_permalink( get_adjacent_post( false, "", true ) );But what if this is the last post? In this case we need to redirect our user to the very first post to complete the loop. To achieve that we will use the below code.
$args = array(
'post_type' => get_post_type( get_the_ID() ),
'posts_per_page' => 1,
'order' => 'DESC' // removing order parameter will work too
);
$first = new WP_Query($args);
if ( $first->have_posts() ) {
while ( $first->have_posts() ){
$first->the_post();
$link = get_permalink();
}
}
wp_reset_query();
The above code is similar to the code we used for previous post link with only difference being the order in which the results are extracted from the database.
Using Previous and Next Post Links in a Theme
The above code should be added in single.php file that comes with your theme. Since the above code only provides a link so you will have to make sure that you use the link with an anchor tag so that it appears as a button.
<a href='. $link .'>Next Post</a>The complete code will look like this.
$previous_post = get_adjacent_post(false, '', false);
if( $previous_post ) {
$previous_post_link = get_permalink( $previous_post );
} else {
$args = array(
'post_type' => get_post_type( get_the_ID() ),
'posts_per_page' => 1,
'order' => 'ASC'
);
$last = new WP_Query($args);
if ( $last->have_posts() ) {
while ( $last->have_posts() ){
$last->the_post();
$previous_post_link = get_permalink();
}
}
wp_reset_query();
}
$next_post = get_adjacent_post(false, '', true);
if( $next_post ) {
$next_post_link = get_permalink( $next_post );
} else {
$args = array(
'post_type' => get_post_type( get_the_ID() ),
'posts_per_page' => 1,
'order' => 'ASC'
);
$first = new WP_Query($args);
if ( $first->have_posts() ) {
while ( $first->have_posts() ){
$first->the_post();
$next_post_link = get_permalink();
}
}
wp_reset_query();
}
Now you can simply use $previous_post_link and $next_post_link with in an anchor tag to display previous and next post links.
