Wordpress Howto: Add Previous and Next Post Links to Blog Pages

HowTo: add Previous and Next Post buttons to your Wordpress blog.

Here's a tip: Want people to view more than one page of your site?

Give them an easy way to do that.

This might seem blatantly obvious but you'd be surprised how many sites don't have simple "Next" and "Previous" links on all pages that should.

You probably don't even notice, you just leave when you're done reading that article, probably without bookmarking or subscribing either (hint hint). You can literally double your "average time on site" in about 10 minutes with this simple trick.

Why is this key? Well, if more people visit more pages, and spend more time on your site, you will rank better. Even better, they'll be presented multiple opportunities to buy things or sign up or whatever your goal is that visitors should be doing.

Fun fact: time visitors spend on your site is also called "engagement" and Facebook is way out in front as the worldwide leader for this metric. In other words people spend more time on Facebook than they do on Twitter, Google+, etc.

I also show you how to change the links to say whatever you want, including how to add the post title to next / previous links. This is not only good for users, but also great for blog SEO. All bloggers should consider doing it this way, as internal linking is very important for search visibility.

How to add Next / Previous links to Wordpress post pages

We're going to edit your theme's Single Post template which is usually the single.php file.

Note: I recommend making a backup of the site before attempting any changes. If you have cPanel this is as easy as clicking Backup from the main cPanel page (most hosts), or you can use various Wordpress plugins, or simply copy the files somewhere safe on your local computer (like C:\Backup or /backup) before you edit them. 

Let's get started:

In your Wordpress dashboard, click Appearance->Themes->Editor 

In the right sidebar, click single.php 

Find the line:

<?php comments_template ?>

Hint: if your file is large, search for (Ctrl+F) the text comments_template

Go to the line AFTER that line by placing the cursor after ?> and pressing Enter

(I usually press Enter 2 or 3 times to give myself some space)

Add this block of code on the next line:

<div>
<h3>
<span style="text-align: center;">Where next?</span></h3>
<span><?php previous_post_link(); ?></span> <span style="float: right;"><?php next_post_link();
?></span>
</div>

That should get you started - you can use it as is or add custom styles with a bit of CSS.

*Note if you have multiple or custom post types - for example "Recipes" or similar - you will also have to find the .php files that generate those pages and change the Next and Previous links there as well. In most cases they should have the word "single" in the file name, like singlerecipes.php. Add the code above in the same place (new line after comments_template ?>)

Customizing Previous and Next Post link

You can add options by calling next_post_link and previous_post_link with options (add inside of the parentheses):

next_post_link('format', 'link', 'in_same_cat', 'excluded_categories');

So for example, to only pull items from the same category, exclude category number 2, and to always use "Next->" and the post title in bold for the text of the link, you would use:

next_post_link('%link', 'Next-><strong>%link</strong>', TRUE, '2');

in place of next_post_link();

You can even use an image for the Next post link in Wordpress although I generally recommend text links for SEO (if you use images, make sure you generate alt tags).

Save the file (you've backed it up, right?) and refresh your site. You may need to press Ctrl+Shift+Delete in your browser to clear the cache or just press Ctrl+F5 to refresh the page. If you don't like it or you broke the site, don't panic, just restore the backed up file, site, database, or cPanel backup that you made before making the changes.

If you need help, Call a developer

Further Reading -> Wordpress Customization: