How To Change The Previous Post On Word Press Blog

How to add next and previous links to your WordPress site

Created October 26, 2021
Category Getting Started with WordPress

In this article, we'll show you how to add and customize the next and previous links on WordPress. As with most customizations, the way you customize your navigation links depends on your WordPress version and theme. The examples in this article are using WordPress version 4.8 with the Classic theme.

Note : Some of the customizations explained in this article require you to edit WordPress configuration files. Always make backup copies of files before editing.

It's also best practice to only make one change before each test of your site, so if an error occurs, you'll know the most recent change likely caused it. There are three methods you can use to edit files:

Some files can be edited directly in WordPress. Log in to WordPress via the HostPapa Dashboard. Go to Appearance > Editor . Locate the file, then click the file name to open it in the editor.
If the file you need to edit isn't available in the WordPress dashboard, you can download it using an FTP client , then edit it with your preferred text editor. When you've made the changes in the file, save and upload it.
You can also edit the file in the cPanel File Manager .

About WordPress next and previous post links

Next and previous post links are WordPress navigation features that help your site visitors find content. Most themes include these links by default, and they're usually located near the bottom or top of individual posts and non-single posts. We'll show you how to customize these links by editing the templates and template tags used to create them.

There are two types of next and previous links generated by template tags:

posts_nav_link() – This template tag displays links to the next and previous pages on non-single and non-permalink posts. These links are displayed on the index page (or posts home page), archives, categories, and search results pages.
previous_post_link() and next_post_link() – These template tags display links to the next and previous posts on single and permalink posts. Next and Previous refer to the chronological order in which the posts were published.

posts_nav_link()

The template tag posts_nav_link() generates links on non-single/non-permalink pages, such as categories, archives, searches, and the index page. This tag creates two links at the bottom of the page within the WordPress Loop to display the next and previous pages in chronological order.

The posts_nav_link() template tag takes three parameters: $sep , $prelabel , and $nxtlabel . In our example, the posts_nav_link() template tag is found in our theme's index.php and looks like this:

<?php posts_nav_link(' — ', __('&laquo; Newer Posts'), __('Older Posts &raquo;')); ?>

The parameters used are:

sep – The separator character displayed between the previous posts link and the next post's link. In this example, the separator character is an em dash, and the decimal code for an em dash is the parameter.
prelabel – The text displayed with the previous post's link. In this example, it is a double left angle quote (<<), also called a chevron or guillemet, and the text Newer Posts .
nxtlabel – This is the text displayed with the next post's link. In this example, it is the text Older Posts and a double right angle quote (>>).

The links created by this template tag are shown below:

Let's change the text and separator character.

<?php posts_nav_link(' · ', __('after'), __('before')); ?>

The new parameters are:

sep – The separator character is now a middle dot.
prelabel – The previous post link text is after .
nxtlabel – The next post link text is before .

Here are the links created by the updated template tag parameters:

previous_post_link() and next_post_link()

Use the previous_post_link and next_post_link template tags to display links on single and permalink posts. These links help your site visitors move through individual posts in chronological or reverse-chronological order.

The default usage without parameters displays the post titles as the link text with double left angle quotes ( << ) with the previous post link and double right angle quotes ( >> ) with the next post link.

The default template tags look like this:

<?php previous_post_link(); ?> <?php next_post_link(); ?>

And this is how the links are displayed on our example site:

The previous_post_link() and next_post_link() template tags take four optional parameters:

format – This is the text displayed before or after the link. The default value is '« %link.'
link – This is the link text. The default value is the post title ( %title ).
in_same_term – This Boolean (true/false) parameter indicates whether the linked post must be in the same taxonomy as the current post. For example, if this parameter is true and the current post is in the how to category, the linked posts will be the previous and next posts in the how to category. A link won't be displayed if there isn't a previous or next post in the category. The default value is false .
taxonomy – This is the specified taxonomy if in_same_term is true . The default value is category .

Let's make some changes to our previous and next links. First, we'll assume that visitors interested in technical how-to articles aren't at our site to read about recipes or dog grooming, so let's change in_same_term to true .

Since the default value for taxonomy is category, we can leave that as is. We'll also add some space between the two links and a vertical separator character. Our updated template tags look like this:

<?php previous_post_link( '&laquo; %link', '%title', true ); ?> |  <?php next_post_link( '%link &raquo;', '%title', true ); ?>

This is how the links generated by the updated code are displayed on our site:

For more information, see previous_post_link and next_post_link in WordPress' documentation.

Next and previous page links

The next_post_link and previous_post_link template tags can't be used in WordPress pages. There are plugins that create next and previous page links, but you can also create these links by adding the following code to your page template (usually page.php or single-page.php ):

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

More information

How to create good navigation links in WordPress
How to create horizontal menus in WordPress

If you need help with your HostPapa account, please open a support ticket from your dashboard.