WordPress provides an inbuilt feature used to navigate through posts. Developers of themes can make use of numbered pagination of straightforward links to mark or distinguish the next page or the previous page in a sequence.
WordPress can be able to divide one post or multiple posts into various pages so that “paged” navigation can be enabled. The number of posts that will comprise each page on the Reading Screen can be set using:
Wp-admin > Settings > Reading
Except it is overridden by your theme, WordPress will make use of its default option to decide the number of blog posts present on one page. An example where WordPress might decide to override this value is when a custom query is being used.
WordPress makes use of pagination when:
- There are too many posts and all cannot fit on one page;
- Dividing longer posts manually by using <!–nextpage–>
This is the most popular use of pagination in WordPress sites. Long lists of posts are broken into different pages. Normally, WordPress can only show 10 posts per page and it doesn’t matter if you’re viewing an archive or a default index page. This, however, can be changed using:
Admin > Settings > Reading
Displaying Pagination Links
WordPress is blessed with different functions for showing links in various pages in your loop. However, some of these functions can only be used in unique contexts. Single post pages and archive pages possess different functions.
There are different methods available but one of the simplest is posts_nav_link(). All you have to do is place the function in your template immediately where the loop ends. This will create links to the next page and previous page (if applicable) of posts. This function is suitable for WordPress Theme Development with simple pagination requirements.
When multiple pages are present, it will be more-ideal to create a list of page numbers so it will be easy to navigate. With the list of page numbers, there won’t be any need to repeatedly click the next or previous posts. There are several functions provided for numerical pagination lists.
- a) For WordPress 4.1+
To ensure a more extensive pagination option, you can make use of the_posts_pagination() for WordPress 4.1 and all other higher versions. This will ensure that links to previous and next pages of posts are provided.
- b) For WordPress before the 4.1 Version
Use paginate_links() if you want your pagination to support WordPress versions before 4.1.
Pagination Between Single Posts
The previous functions are to be utilized on archive and index pages. To view a single blog post, you must make use of prev_post_link and next_post_link. You’ll have to place the below functions at the end of the loop on your single.php.
1 | previous_post_link();
2 | next_post_link();
Pagination Within a Post
WordPress makes a tag available. This tag can be placed in post content so that pagination for that post can be enabled.
If you’re making use of the tag in the content, you have to make sure that the wp_link_pages functions is arranged in your single.php template inside your loop.
1 | <?php if ( have_posts() ) : ?>
3 | <!– Start of the main loop. –>
4 | <?php while ( have_posts() ) : the_post(); ?>
6 | <?php the_content(); ?>
8 | <?php wp_link_pages(); ?>
10 | <?php endwhile; ?>
12 | <?php endif; ?>
Category Pagination in WordPress
Category pagination in WordPress can honestly be a bit dicey in its execution. In this post, we’ll assume that you’re establishing a custom category page (almost like category.php) in your theme file.
As we commence, we must establish the current category of the page. This would differ when considering the category the user clicked on to arrive on this page. To find out the current category, put the following code in your code editor:
1 | <?php
2 | $currCat = get_category(get_query_var(‘cat’));
3 | $cat_name = $currCat->name;
4 | $cat_id = get_cat_ID( $cat_name );
5 | ?>
We now have the current category saved in $cat_id. We’ll now start with the second part which entails establishing unique arguments for your loop and the real loop. It should be noted that putting an offset number into the loop will break it.
1 | <?php
2 | $paged = (get_query_var(‘paged’)) ? get_query_var(‘paged’) : 1;
3 | $temp = $wp_query;
4 | $wp_query = null;
5 | $wp_query = new WP_Query();
6 | $wp_query->query(‘showposts=10&post_type=post&paged=’.$paged.’&cat=’.$cat_id);
7 | while ($wp_query->have_posts()) : $wp_query->the_post();
8 | ?>
After the code, there should be an opening to put in your HTML for your loop’s output. It should be like this:
1 | <div class=”module-container”>;
2 | <div class=”content”>;
3 | <span class=”author”><?php the_author(); ?></span>
4 | <?php the_content(); ?>
5 | </div>
6 | </div>
The above is a random example of what your code might look like. It definitely will be more complex than the example.
End the loop once you’re done with the HTML/PHP.
1 | <?php endwhile; ?>
After ending the loop, the final step should be started. This step will bring everything together and ultimately insert the pagination links to the page. Wrapping this code in a div isn’t compulsory, but I decided to do it anyway. You can also change the prev_text and next_text to anything of your preference.
1 | <?php
2 | global $wp_query;
4 | $big = 999999999; // need an unlikely integer
5 | echo ‘<div class=”paginate-links”>’;
6 | echo paginate_links( array(
7 | ‘base’ => str_replace( $big, ‘%#%’, esc_url( get_pagenum_link( $big ) ) ),
8 | ‘format’ => ‘?paged=%#%’,
9 | ‘prev_text’ => __(‘<<‘),
10 | ‘next_text’ => __(‘>>’),
11 | ‘current’ => max( 1, get_query_var(‘paged’) ),
12 | ‘total’ => $wp_query->max_num_pages
13 | ) );
14 | echo ‘</div>’;
15 | ?>
With this, you’ve put pagination into your custom page.