WooCommerce Pagination is one of the must have features of any online store. It lets users explore the products in the shop and archive pages with ease.
We know that the best-recommended theme for WooCommerce is storefront. Fortunately, it has default pagination. However, it is not up to the mark and doesn’t provide any WooCommerce pagination setting.
So, it is completely fine if you want to change it.
But the question is how can we change the WooCommerce Pagination without changing the theme?
If you want to change to the default WooCommerce pagination you can use the ProductX plugin and follow a few simple steps. You don’t have to make any special changes to the storefront theme you’re using with your WordPress installation.
Here’s how to use the ProductX WooCommerce AJAX pagination :
- Install ProductX Plugin.
- Create Custom Shop Page Template
- Turn on WooCommerce Pagination from the General setting
- Choose from 2 types of Pagination.
Introducing WooCommerce Ajax Pagination feature of ProductX
The ProductX Gutenberg WooCommerce Product Blocks is an all-in-one solution for creating WooCommerce stores. With numerous features and multiple pro add-ons, it also offers Ajax Powered Pagination for WooCommerce.
Currently, there are 2 types of WooCommerce pagination options available
These are: “Load More” and “Numeric Pagination”. Both of these two types of pagination can be added to the Shop page and Archive pages as well.
But the main attraction of the Ajax Pagination feature of ProductX is the dedicated setting options. It’s simple and doesn’t require any additional knowledge to use it on a shop page. And, it’s a favourite among online store owners.
Why is that you think:
Most pagination options do not offer the proper customization features. Also, they are not very user-friendly. Users are looking for something they can use without too much hassle.
And the ProductX pagination feature can offer you that!
How to Add Pagination to WooCommerce Shop Page
There is no denying the fact that pagination is super important for an online store. So, it is only natural to expect the feature to be compatible with various WooCommerce themes.
But the problem is, many plugins do not have the right support for the wide variety of themes available for WooCommerce. They don’t even have proper customization support.
The same is true for the Storefront theme as well. Although it allows you to use pagination, there is a lack of proper customization options.
Fortunately, ProductX supports most popular WooCommerce themes. Also, it comes with granular-level controls, allowing the site admin to make changes just the way they like it.
Just follow the steps below to create pagination for your WooCommerce store.
Install ProductX
First of all, you need the install the ProductX plugin. To do this:
- Go to Plugins > Add New.
- Search for the ProductX WooCommerce Builder plugin.
- Finally, install and activate the plugin.
Get ProductX Pro to unlock all conversation-focused features and skyrocket your sales!
If you want to use the pro version of ProductX (basically you unlock all the goodness of ProductX!) , make sure to check out the installation documentation.
Turn on WooCommerce Builder Addon
Then you have to turn on the WooCommerce Builder addon for creating custom templates. For that:
- Navigate to ProductX > Addons from your WordPress dashboard.
- Enable the WooCommerce builder addon.
Create a Custom Shop Page Template
After enabling the addon you will see the builder setting added along with all other options of ProductX. The first thing to do is to go to the ProductX WooCommerce builder and select “Shop“. Here, you can choose to create a shop page from scratch or choose one of the pre-made templates.
If you “import” the template, you will be taken to the shop template page editor. From here, you will be able to change the settings of various blocks (including the pagination which we will cover in the later section) – add new sections or delete existing sections.
You can also edit the shop page from scratch – add elements and change their settings. You may want to take a look at the following article to learn more.
Learn More: How to Customize WooCommerce Shop Page Template.
Turn on WooCommerce Pagination
After turning on the pagination feature you will get two options to choose from – there are “Load More” and Numeric Pagination. Choose any one of them and it will be shown on the page. Also, you can enable or disable them directly from the settings panel.
2 Types of WooCommerce Pagination
ProductX allows 2 types of pagination options to choose from. You can find more details below.
- Load More
It is a basic type of pagination where your online store can be paginated with a single button (the load more button). So, the user can just click on the load more button to explore more products in the WooCommerce store.
- Numeric Pagination
Numeric pagination is the most commonly used pagination type.
It comes with lots of customization options. Usually, it represents previous and next options along with multiple page numbers. So that, the users can navigate from the previous to the next pages to explore more products.
Also, the you have the AJAX pagination available in this settings.
Play with WooCommerce Pagination Setting
After implementing the pagination feature to the shop page, you can customize it according to your need. Below are the main customization options available for the WooCommerce pagination setting.
- Pagination Alignment: You can adjust the pagination alignment by choosing Left, Right, or Centre alignment.
- Ajax / Normal Pagination: If you don’t like the Ajax pagination for WooCommerce, turn it off to implement the normal pagination.
- Typography: The feature offers full typography control for the pagination feature.
- Pagination Color: You can choose your desired normal state and hover state colors for the text and background of the pagination.
- Border, Radius, Margin, and Padding: Adjust Border, Radius, Margin, and Padding according to your need.
Which type of Pagination should you use?
The type of pagination depends on the layout of your site and your personal preference. ProductX allows you to choose 2 pagination types.
You need to decide which one suits better with the layout of your online store.
However, my recommendation is that you should choose the pagination according to the quantity of the products page. If your online store has only a few products pages you can go for Load More Pagination.
But if your store has multiple types of products then you should go for the Numeric Pagination.
Why Should you use ProductX?
ProductX is an all-in-one WooCommerce solution to create an amazing online store with ease. So, you can use some effective features along with the pagination feature. Let me explain the reasons to choose the Plugin.
- No coding language is required to add pagination to your site. If your current WordPress doesn’t have pagination by default then you can use ProductX. Not only that, You can create the complete WooCommerce store without knowing any coding or technical knowledge.
- You can add pagination to multiple blocks of a single page. ProductX comes with the Ajax pagination option that lets you paginate multiple blocks. So, visitors can navigate through multiple products categories without reloading the whole page.
- One of the most important features is product comparison. It lets the users compare similar types of products side by side before adding them to the cart.
- You can use the block library sections to import the full-page layout from the starter pack sections. There is numerous ready-made designs available for you to choose from and build a full WooCommerce store with a few clicks.
- The ProductX plugin is built with SEO-optimized coding. The blocks load with a limited number of codes. So, there will be no technical SEO or load time issues to your site.
Conclusion
That was all about the WooCommerce pagination. If you face any difficulties while paginating your site or have any questions in mind then leave a comment below.
The WPXPO team will be happy to help you. Cheers!
👉 Get ProductX Pro to unlock all conversation-focused features and skyrocket your sales!
