WooCommerce Pagination is one of the must having features of any online store. It lets users explore the products of the shop and archive pages with ease.
As we know that the best-recommended theme for WooCommerse is storefront and it has default pagination. However, it is not up to the mark and doesn’t provide any WooCommerce pagination setting.
So, it is totally okay if you want to change it. But the question is how we can change the WooCommerce Pagination of Storefront theme?
If you want to change to the default WooCommerce pagination of the storefront you can use the ProductX plugin and follow a few simple steps. Here’s how:
Step – 1. Install ProductX Plugin.
Step – 2. Create Custom Shop Page Template
Step -3. Turn on WooCommerge Pagination from the General setting
Step – 4. Choose from two types of Pagination. That’s all.
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 two types of WooCommerce pagination available which 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 its dedicated setting options. Because most of the store owners who want to change the default pagination are actually looking for the WooCommerce pagination setting options.
So without any doubt, you can replace the default pagination of the storefront theme with the Ajax pagination of the ProductX plugin.
How to Add Pagination to WooCommerce Shop Page
As pagination is one of the must-having features for the WooComerce shop page most of the WooCommerce compatible theme comes with it.
However, a few of the themes would not provide it. Another notable theme is not a theme that comes with default pagination like storefront does not provide any customization.
So, whether you want to change or add the pagination, ProductX is there for you. Not only pagination you can change the full shop page itself by creating a new shop page template from scratch. For that, you just need to follow the below steps.
First of all, you need the install the ProductX plugin. For that, go to the plugin section of your site and click on the add new button. Now search for the ProductX plugin and click on the install button. After installing it, you need to activate it by clicking on the activation button.
Get ProductX Pro to unlock all conversation-focused features and skyrocket your sales!
Turn on WooCommerce Builder Addon
Then you have to turn on the Builder addon for creating custom templates. For that:
- Navigate to the ProductX section.
- Click on Addons.
- Turn on Builder Addon.
Create a Custom Shop Page Template
After Turning the Addon you will see a Builder section added along with all other sections of ProductX. Now:
- Click on Builder.
- Then click on Add New Template.
- Select Shop as Template type.
- Save and Start editing the template.
Then you have to customize it according to it by using product blocks and starter packs from the block library.
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. Which are a load more and numeric pagination. Choose any one of them and it will be shown on the page.
2 Types of WooCommerce Pagination
ProductX allows two 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. 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.
Play with WooCommerce Pagination Setting
After implementing the pagination feature to the shop page you can customize it according to your need by using the setting options. Below are the main customization options available for the WooCommerece pagination setting.
Pagination Type: ProductX offers two types of pagination which are Load More and Numeric Pagination.
Pagination Alignment: You can adjust the pagination alignment by choosing Left, Right, or Center alignment.
Ajax / Normal Pagination: If you don’t like the Ajax pagination for WooComerce, turn it off to implement the normal pagination.
Typography: The product offers full typography control for the pagination feature.
Pagination Color: You can choose your desired normal and hover color 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 from two types of pagination and customize them as well.
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 numerous and multiple types of products then you should go for the Numeric Pagination.
Why Should you use ProductX?
ProductX is an all-in-one WooCoomerce 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 doesnt 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 design 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.
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.