X

WordPress

Step by Step Guide for Category Pagination in WordPress

WordPress provides an inbuilt feature used to navigate through posts. Developers of themes can make use of numbered pagination of straightforward links...

Pagination in Wordpress

Image Credits: pixabay

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

Image Credits: Screenshot taken from the website

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–>
Image Credits: Screenshot taken from the website

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

Image Credits: Screenshot taken from the website

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.

Simple Pagination

Image Credits: Screenshot taken from the website

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.

Numerical Pagination

Image Credits: Screenshot taken from the website

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.

Suggested:

Why Use WordPress for your Website?

And

How Secure is WordPress?

  1. 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.

  1. 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

Image Credits: Screenshot taken from the website

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.

1<!–nextpage–>

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() ) : ?>

2 |

3 |   <!– Start of the main loop. –>

4 |   <?php while ( have_posts() ) : the_post(); ?>

5 |

6 |       <?php the_content(); ?>

7 |

8 |     <?php wp_link_pages(); ?>

9 |

10 |    <?php endwhile; ?>

11 |

12 | <?php endif; ?>

 

Category Pagination in WordPress

Image Credits: Screenshot taken from the website

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;

3 |

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.

Written by Nathan Beers
Nathan Beers is a former professional poker player turned developer. He is currently living in Tampa, FL and working as a full-stack web developer. He is really very fascinated by learning new technologies and love to write about them. He intensely believes in a decentralized internet with no government involvement and enjoys trading cryptocurrencies.
Profile  

4 Replies to “Step by Step Guide for Category Pagination in WordPress”

  1. Hey Nathan Beers
    Why do you store the query inside the $temp when you never use it again?
    I guess you forgot to assign the query back to it’s default value?

    Then why do you do this:

    $wp_query = null;
    $wp_query = new WP_Query();

    Shoudn’t the second line do all the work?

    Best regards

  2. hey,
    i read your post on pagination on WordPress. I have to say, I’m very impressed with your perspectives and opinions. keep sharing your valuable thoughts.
    Thanks-

Leave a Reply

Your email address will not be published. Required fields are marked *

Discover more from Tricky Enough

Subscribe now to keep reading and get access to the full archive.

Continue reading