How to Paginate Comments in WordPress
Few things can kill a website quite like poor loading times. As many as 10 percent of website visitors will leave if a page takes longer than two seconds to load, and as performance slows down, that number rises dramatically.
Paginating your WordPress pages is one possible solution. Pagination is, simply put, breaking content up into separate pages. This helps alleviate two key issues: slow page loads and difficult-to-read content.
In this article, we’ll explain why paginating WordPress posts and comments can be beneficial. Then we’ll show you exactly how to do it. Finally, we’ll go over some popular WordPress plugins to extend the platform’s default functionality. Let’s jump in!
Why Paginate Posts and Comments?
Most of the reasons to paginate WordPress posts and comments fall under one of two categories: page speed and user experience.
Posts that are exceptionally long or contain a lot of high-resolution images can take longer to load. A large number of comments can have a similar effect. Since page speed is an important factor in SEO, you’ll want to minimize it as much as possible. Pagination can help you do this, by moving excess content to separate pages.
Page speed is also an important part of the user experience on your website. Long content can be harder to consume, particularly on mobile devices. Pagination can help break up long posts into easily-digestible chunks for readers, and also makes it easier for users to jump to the parts of each post that they’re most interested in.
How to Paginate Posts
Paginating posts in WordPress is relatively simple. There’s no button in the editor to break a post into pages, but the task can be accomplished quickly by adding a simple bit of code with the HTML editor. You can then adjust the style of the pagination using CSS.
Step 1: Navigate to the HTML Editor
First, open up the post you want to paginate in the WordPress editor. Then switch over to the HTML view. If you’re using the Block Editor, click the three dots in the upper-right corner and select Code editor from the drop-down menu:
If you’re editing the post in the Classic Editor, simply click on the Text option on the upper-right corner of the editing area:
This option lets you directly edit the HTML code of your post.
Step 2: Add the <!–nextpage–> Code
Once you’re in the HTML editor, all you have to do is add the <!–nextpage–> code at the point you want to break the post into pages.
Here’s what that looks like in the code editor:
On the front end, here’s how our post appeared before adding the code:
After being paginated, our page looked like this:
If you want to add additional pages, just insert the code at each location.
At that point, you’re done – your post has been successfully paginated. However, there’s one more optional step you might want to consider.
Step 3: Style Pagination
Your theme most likely comes with styles for paginated navigation. If you want to adjust a default style (for example, to add some animations or a different color scheme) you can do that using custom CSS.
CSS can be added using the WordPress Customizer. Head to your WordPress dashboard and navigate to Appearance > Customize. Then click on the Additional CSS button in the sidebar:
There’s a lot you can do with CSS to customize the page navigation. For some examples, check out the W3Schools CSS tutorial and the WordPress Codex.
How to Paginate Comments
Paginating comments works the same way it does with posts, although the method used to add the pagination is a little different. However, it does have the advantage of being more configurable by default.
Step 1: Navigate to Discussions
To add pagination to your WordPress site’s comments sections, head to your dashboard and navigate to Settings > Discussion:
This page handles settings for comments across your entire website.
Step 2: Select Break Comments
The Discussion settings page lets you adjust a variety of options related to comments and conversations on your site. When it comes to pagination, there’s one setting in particular you’ll want to note. The line in question starts with “Break comments”:
This setting does exactly what it says: breaks comments into multiple pages based on the criteria you set. Here’s what your comments section might look like before enabling this setting:
Then, here’s what it would look like after breaking up comments and setting the maximum comments per page to two:
Two comments per page is probably too few for a real website, but our example showcases how much more readable this setting can make your pages. It should also result in them loading much faster, especially if you have hundreds of comments on each post.
Step 3: Adjust Pagination Settings
There are several other settings you can adjust to customize the behavior of your WordPress comment pagination. These include:
- The number of top-level comments per page. This setting controls how many comments appear on each page before the reader needs to navigate to another.
- Which page is displayed by default. Generally, you’d want the last page (and thus, the newest comments) to be displayed, but if not you can change this behavior here.
- Whether you want the oldest or newest comments displayed at the top of each page.
When you’re finished, don’t forget to click on Save Changes at the bottom of the settings page.
WordPress Pagination Plugins
Naturally, there are also several plugins available to handle pagination. Below, we’ll look at three of the most popular options.
Note that for all of these tools, you’ll still need to apply pagination using one of the methods above. Then, you’ll use the plugin for customizing the function and appearance of your pagination buttons and text.
WP-Paginate is a simple plugin that can paginate both posts and comments. It offers granular control over where you want pagination to appear, how you want the buttons and fonts to look, and how many pages you’ll include in the button navigation.
WP-Paginate also has a dedicated section for custom CSS, so if you don’t care for the included styles, you can use your own. The plugin itself is free, but there’s also a premium version that adds more button presets and support for WordPress multisite.
WP-PageNavi is a very simple plugin that replaces the default pagination navigation with a customized version. Compared to WP-Paginate, there are fewer options for customization, and there are no preset styles to choose from – you’ll have to create your own using CSS.
Although the plugin is simple, we wouldn’t necessarily call it user-friendly. It requires a lot more hands-on work than WP-Paginate. With that being said, it does its job well, and it’s completely free.
Pagination is the most robust of these three plugins, with a detailed settings panel that allows for direct customization of colors, borders, alignments, and more. This means you can apply quite a bit of customization without needing CSS code, which likely makes this a useful plugin for non-technical users.
Of course, you can add your own CSS if you wish. The Pagination plugin is free, but there’s a premium upgrade that allows for additional styles (including an infinite scroll option) and gets you faster support from the developer.
Ensure That Your Site Has a Great User Experience with WP Engine
We all want to provide our users with the best experience possible. Whether long loading times or impenetrable content is your problem, pagination is a simple solution that can help to fix both.
Of course, it’s also crucial not to neglect your site’s foundation. Fortunately, we have detailed developer resources and a range of WordPress hosting plans, to help you create an incredible digital experience for your users!