The code so far

So now that we’ve gone through the basic concept behind creating pagination for multi-page posts in WordPress, we can move on to the next step of adding permalinks to our anchor tags as well as creating some additional navigation links. But before we proceed let’s take a look at the code we have already.

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

<?php endwhile; // end of the loop. ?>


Bear in mind that this code is placed inside the loop for single posts, which is most likely found in the “single.php” file inside the theme directory. I’ve left out the extra HTML and what-not so that the code is easier to read.

“Previous” and “Next” links

While it may seem pointless to make these, considering that WordPress can easily output them by calling the wp_link_pages() function, you might want more control in how they’re rendered. You could probably find where this function resides within the WordPress core and modify its output there, but that seems a bit extreme. Personally, I’d rather not mess about with those files. Besides, having the total page count and the current page number is enough information for us to create these on our own. By performing some conditional logic, we can easily figure out whether or not we need a “Previous” or “Next” link. Consider the following code.

// Create "Previous" & "Next" links
$link_p = false;
$link_n = false;
if($max_pages>1){
if($page_num==1){
// First page
$link_n = '<a>Next Page</a>';
} else if($page_num==$max_pages){
// Last page
$link_p = '<a>Previous Page</a>';
} else {
// Middle pages
$link_p = '<a>Previous Page</a>';
$link_n = '<a>Next Page</a>';
}
}
if($link_p){echo $link_p;}
if($link_n){echo $link_n;}


The first thing we do here is set two variables where we’ll store our anchor HTML, and set their default values to “false.” If there’s only one page, those values remain false and nothing is rendered. If, though, we are on a multi-page post then we proceed to build the anchors depending on what page we’re on. There’s no need to build a “Previous” link if we’re on the first page nor is there a need for a “Next” link if we’re on the last page. For the rest of the pages, however, we’ll need both. And that’s what the conditional statements are handling.

Creating the permalinks

In order to correctly build the permalinks for your anchor tags, we’ll need to add a little more conditional logic to our code. See the updated version below.

// Create "Previous" & "Next" links
$link_p = false;
$link_n = false;
if($max_pages>1){

if($page_num==1){
// First page
$p = $permalink . ($page_num + 1) . '/' ;
$link_n = '<a href="' . $p . '" >Next Page</a>';
} else if($page_num==$max_pages){
// Last page
$p = ($page_num == 2) ? $permalink : $permalink . ($page_num - 1) . '/' ;
$link_p = '<a href="' . $p . '" >Previous Page</a>';
} else {
// Middle pages
$p = ($page_num == 2) ? $permalink : $permalink . ($page_num - 1) . '/' ;
$link_p = '<a href="' . $p . '" >Previous Page</a>';
$p = $permalink . ($page_num + 1) . '/' ;
$link_n = '<a href="' . $p . '" >Next Page</a>';
}
}
if($link_p){echo $link_p;}
if($link_n){echo $link_n;}


The solution above assumes that you’re using a permalink structure other than the default which you should be doing already. If you aren’t you really should change it to a format that’s more search engine friendly. The second thing to note is that we stored the permalink for the current post into a variable because it’s a value that we end up using several times. Consequently, all we have to do now is either subtract or add 1 to the current page number and append it to the end of our permalink variable. Simple!

Also note that when constructing “Previous” links, we check to see if we’re on the second page. If we are, then we return the original permalink instead of a permalink with a “1″ added to the end. While this isn’t necessary as the latter example will still work, it’s important from an SEO perspective. You never want to have different links leading to the same content as that could very well hurt your search engine ranking.

Closing

How and where the links will be rendered is all up to you. Once the markup is complete, all you have to do is work some of that CSS magic and you’ll have some nicely-formatted pagination links for your multi-page posts. There should be more than enough information here to get you started, but if there isn’t, let me know. Also, if you have any questions or comments don’t hesitate to post them below. Additionally, if there are better ways to handle this issue please let us all know by chiming in. So there you have it, my first tutorial. Expect many more in the future as I have plenty more to learn. But until then, good day and happy paginating!