How to Create Page Numbers with WP-Pagenavi in WordPress – This tutorial will discuss how to add a page number or Page Number in a WordPress theme. Adding the page number feature on your WordPress site aims to make it easier for readers to navigate your site when they want to move from the First page to the second page or even jump directly to the page they want.
The page number feature is usually already installed on a particular theme, but there are still a lot of WordPress templates that still don’t have a page number feature and what is displayed is a built-in feature such as’Older Post and Previous Post ‘.
If you currently have a WordPress site and your theme doesn’t yet support the page number feature, in this article I will provide the easiest way for you to add the page number feature to your WordPress theme with the WP-PageNavi plugin.
How to Create a Page Number with WP-PageNavi
To create a Page number in WordPress, the first thing you need to do is install and activate the plugin WP-PageNavi. After activating the plugin, please go to Settings »PageNavi to configure plugin settings.
On the plugin’s ‘PageNavi Settings’ settings page you can change the text default and numeric pagination settings according to what you want in the column provided.
In the next step, you need to add a php tag script to the template your WordPress theme. Please find the file index.php and archive.php in the template folder you are using. Add the following tags to your theme to replace the script previous_posts_link and next_posts_link.
For example in the Twentytheme theme, the code you need to replace is as follows:
<div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts', 'twentyten' ) ); ?></div> <div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentyten' ) ); ?></div>
And please delete the code as above and replace it with the code below.
<?php wp_pagenavi(); ?>
In addition, you can also make the appearance of page numbers according to your wishes by taking advantage of custom CSS settings that you can change. To do this, you can copy the pagenavi-css.css file from the plugins directory to your theme directory and make modifications there. This way, you won’t lose your changes while updating or updating plugins.
Please enter the menu Plugins »Editor» select the drop down menu and select ‘Wp-Pagenavi’ and please click the ‘Select’ button. do the css changes according to what you want in the file ‘wp-pagenavi / pagenavi-css.css’.
Alternatively, you can uncheck the “Use pagenavi.css?” Option. From the settings page and add styles to your theme’s style.css file directly.
And that’s an easy way to add the page number feature in your WordPress theme with the WP-PageNavi plugin, I hope this article is useful for you and good luck. 🙂