By default, WooCommerce displays a set number of products per page on the shop page. Which may not be adjustable with your theme.
So, at this point, you might want to customize this number of products per page based on your specific requirements, such as the layout of your shop or the browsing experience you want to offer to your customers.
Also Read: WooCommerce Action Hooks: Shop / Archive / Category Pages
Let’s see the examples to demonstrate how you can customize the number of WooCommerce products displayed per page.
Example 1: Display 24 Products per Page
Add the following code to your theme’s functions.php
file to change the number of WooCommerce products displayed per page. I recommend using a child theme for customization.
add_filter( 'loop_shop_per_page', 'custom_products_per_page', 20 ); function custom_products_per_page( $cols ) { return 24; // Change this number to your desired number of products per page }
In this example, we’re using the loop_shop_per_page
filter to modify the number of products displayed per page. We define a custom function custom_products_per_page
that returns the desired number of products per page. In this case, we’re setting it to 24. You can change this number to any value you prefer.
Also Read: How to Change Default Product Sorting in WooCommerce?
Example 2: Display 10 Products per Page
Add the following code to your theme’s functions.php
file to set the display product per page limit to 10.
add_filter( 'loop_shop_per_page', 'custom_products_per_page', 20 ); function custom_products_per_page( $cols ) { return 10; // Change this number to your desired number of products per page }
More Tricks
FAQs
You can customize the number of products per page by adding code to your theme’s functions.php
file using the loop_shop_per_page
filter. Simply define a custom function that returns the desired number of products per page.
Yes, you can set different numbers of products per page based on your requirements. By modifying the custom_products_per_page
function in the code snippet, you can specify different numbers for different sections of your shop, providing a tailored browsing experience.
While increasing the number of products per page may lead to longer page load times, it generally shouldn’t significantly impact performance. However, it’s essential to consider factors such as server resources and user experience when determining the optimal number of products to display per page.