WP-PageNavi is the most popular page navigation plugin for WordPress having been download more than 2 million times.
If you’re using a free WordPress theme like the default theme, Twenty Eleven, you may find the site & design options don’t offer pagination so thats where WP PageNavi comes in handy.
The WP PageNavi plugin provides the wp_pagenavi() template tag which generates fancy pagination links.
Simply install and activate the plugin, then go to the settings page to easily configure the plugin. You’ll then need to edit some PHP code.
Here’s a screenshot of the PageNavi Settings
Once you configure and save the settings, you’ll need to find the code in your theme’s files using cPanel or FTP which calls to next_posts_link() and previous_posts_link() and edit this code using a text editor like notepad++
In the Twenty Ten Theme for WordPress, the code will look like this:
<div><?php next_posts_link( __( ‘<span>←</span> Older posts’, ‘twentyten’ ) ); </code>
<code>?></div> <div><?php previous_posts_link( __( ‘Newer posts <span>→</span>’, ‘twentyten’ ) </code>
<code>); ?></div>
Replace the above code with this code:
<?php wp_pagenavi(); ?>
If you are using the latest default theme for WordPress, Twenty Eleven, you need to edit your themes functions.php file to use PageNavi.
You’re advised to create a child theme in this case and add the code into your child themes custom functions.php file. This way you won’t lose the changes when you update your theme.
If you don’t want to create a child theme, change the functions between line’s 427 to 436 with this code.
These line numbers maybe a little bit different in your Twenty Eleven theme depending on your existing custom functions.
function twentyeleven_content_nav( $nav_id ) {
global $wp_query;
if ( $wp_query->max_num_pages > 1 ) : ?>
<nav id=”<?php echo $nav_id; ?>”>
<h3><?php _e( ‘Post navigation’, ‘twentyeleven’ ); ?></h3>
<?php wp_pagenavi(); ?>
</nav><!– #nav-above –>
<?php endif;
}
All you need to do is replace this code
<div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts', 'twentyeleven' ) ); ?></div>
<div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentyeleven' ) ); ?></div>
With this code
<?php wp_pagenavi(); ?>
Read more about how to add previous and next post navigation in WordPress using code.
Creating Next & Previous Post Links in Thesis
Check out this article if you want to create post navigation links using the thesis theme for WordPress and want to create posts links.
Other WordPress themes may contain lines of PHP code that look something like this:
< ?php next_posts_link('Older Entries') ?>
< ?php previous_posts_link('Newer Entries') ?>
Replace the code with this:
< ?php wp_pagenavi(); ?>
Conclusion
If you are using a free theme which doesn’t offer built in page navigation, you could also install a premium pagination or page navigation plugin so you don’t need to edit any theme files with PHP code.
Brad Dalton
@wpsitesdotnet
Latest posts by Brad Dalton (see all)
- How To Make Your Nav Menu Sticky - May 21, 2013
- How To Change Author & Comment Box Gravatar/Avatar Image Size - May 21, 2013
- Create A Custom Meta Box For A Custom Field - May 18, 2013
Thanks for sharing this information!
I am wondering if it is possible to also use WP PageNavi for pagination with pages instead of posts.
To be specific: Show paginated results of all pages wich are subpages of page “x”. Or perhaps, show all pages with category “x”.
I think you can but am not sure. I know many themes already include page navigation for category archives and don’t forget you can add in the tags fairly easily to display pagination anywhere in your theme. The method for doing this is theme specific. This post includes a link to some code you can use to output page links http://wpsites.net/web-design/next-previous-post-links-genesis/
I’m working on the newest WP-version, and the RAZOR-theme from Themeforest.
I have just installed this plugin, and I just can’t figure out how to get it to work.
As far as I know, the RAZOR-theme doesn’t have any native navigation between posts, so I don’t think there is any code I need to overwrite. So I have just placed the suggested code in the single.php file, and THAT doesn’t work.
I need the navigation to only navigate in the current posts category. Like if I’m reading a post in “category X”, I can only go back and forth in this category.
I hope you have the time to help me…
I’d suggest you use a different theme. The best theme’s include pagination built in and good support. Does your theme provider offer good support?