How to Set the Number of Products Per Page in WooCommerce: A Beginner’s Guide
So, you’ve built your WooCommerce store and are ready to start selling! Awesome! But maybe you’ve noticed that the default number of products displayed on each category or shop page isn’t quite right. Too few, and customers are forced to click “next page” repeatedly. Too many, and the page loads slowly and overwhelms visitors.
This article will walk you through how to set the number of products per page in WooCommerce – a simple tweak that can significantly improve your customer’s shopping experience and boost your sales.
Why Adjust the Number of Products Per Page?
Think about the last time you were online shopping. Did you enjoy scrolling endlessly through pages of products? Probably not. A well-organized shop makes it easier for customers to find what they’re looking for, leading to:
- Improved User Experience: A cleaner layout means less scrolling and faster browsing. It’s like organizing your physical store to be easily navigable.
- Increased Engagement: When customers can quickly see a variety of options without feeling overwhelmed, they’re more likely to browse and explore.
- Faster Loading Times: Showing fewer products per page can reduce the amount of data the browser needs to load, leading to a faster, more responsive website. A faster site equals happier customers (and better SEO!).
- Higher Conversion Rates: Ultimately, a better shopping experience leads to more sales! When your store is easy to use and enjoyable to browse, customers are more likely to complete a purchase.
Imagine you’re selling t-shirts. If you have a huge inventory of hundreds of designs, displaying only 8 shirts per page might be frustrating for customers who want to see a wider selection quickly. Conversely, if you sell high-resolution art prints with large images, displaying 30 per page might overwhelm the user with too much visual information. Finding the right balance is key!
Method 1: Using the WordPress Admin Panel (The Easiest Way!)
This is the most straightforward method and doesn’t require any coding.
1. Login to your WordPress Admin Panel.
2. Navigate to *Appearance > Customize*. This opens the WordPress Customizer.
3. Look for the ‘WooCommerce’ section. (It might be located under ‘Theme Settings’ depending on your theme).
4. Click on the ‘Product Catalog’ or ‘Product Archives’ option. (The exact wording can vary between themes.)
5. Find the “Products per page” setting. This is where you can set the desired number of products to display on your shop and category pages.
6. Enter the desired number of products. Experiment to find what looks best for your products and theme!
7. Click ‘Publish’ to save your changes.
Important: Not all themes support this method. If you don’t see a “Products per page” option in the Customizer, move on to the next methods.
Method 2: Using the WooCommerce Settings
While less common, some themes rely on WooCommerce settings itself.
1. Login to your WordPress Admin Panel.
2. Navigate to *WooCommerce > Settings*.
3. Click the ‘Products’ tab.
4. Look for a section that mentions “Products per page” or “Shop page display.”
5. If present, enter the desired number of products.
6. Click ‘Save changes’.
Method 3: Using the `woocommerce_catalog_page_size` Filter (Code Snippet)
This method requires adding a code snippet to your `functions.php` file or a code snippets plugin. Always back up your site before editing your `functions.php` file! Using a code snippets plugin is generally the safer option.
1. Install and activate a Code Snippets plugin (recommended) or access your theme’s `functions.php` file (Appearance > Theme Editor).
2. Add the following code snippet:
function change_products_per_page( $cols ) {
// $cols contains the current number of products per page based on the store settings
// You can also use 'shop' and 'product_cat' to be more specific with the filter
$cols = 12; // Set this to the number of products you want to display
return $cols;
}
add_filter( ‘loop_shop_per_page’, ‘change_products_per_page’, 20 );
3. Change the `$cols = 12;` line to reflect your desired number of products per page.
4. Save your changes.
Explanation of the Code:
- `loop_shop_per_page`: This is a WooCommerce filter that allows you to modify the number of products displayed per page.
- `change_products_per_page`: This is the function we’re creating to modify the default value.
- `$cols`: This variable holds the current number of products per page.
- `$cols = 12;`: This line sets the new number of products per page. Change `12` to your desired value.
- `add_filter(…)`: This line tells WordPress to use our function to modify the `loop_shop_per_page` filter. The `20` is the priority.
Real-Life Example:
Imagine you’re selling handmade jewelry. You want to showcase the intricate details of each piece, so you want to display fewer products per page with larger images. You might choose to display only 9 products per page. You’d use the code snippet and set `$cols = 9;`.
Important Considerations for the Code Method:
- Backup: Back up your site before making changes to `functions.php`.
- Testing: Test thoroughly after making changes.
- Child Theme: If you’re editing your theme’s `functions.php`, consider using a child theme to avoid losing your changes when the theme is updated.
- Specificity: For more targeted control, you can use conditional tags within the function to apply the change only to specific categories or the main shop page. For example:
function change_products_per_page( $cols ) {
if ( is_product_category( 'shoes' ) ) {
$cols = 6; // Show 6 products per page in the "shoes" category
} else {
$cols = 12; // Show 12 products per page everywhere else
}
return $cols;
}
add_filter( ‘loop_shop_per_page’, ‘change_products_per_page’, 20 );
Method 4: Using a Plugin
Several plugins can help you control the number of products per page and offer additional customization options. Search the WordPress plugin repository for “WooCommerce products per page” and choose a plugin with good reviews and active development. These plugins often provide a user-friendly interface to manage the setting without needing to code.
Example Plugins:
* WooCommerce Products Per Page: A simple and straightforward plugin.
* Custom Product Tabs for WooCommerce: While its primary function is for custom tabs, some versions also offer per-page customization options.
Choosing the Right Method
- Beginners: Start with Method 1 (Customizer) if your theme supports it. It’s the easiest and safest option.
- Intermediate Users: If the Customizer doesn’t work, try Method 3 (Code Snippet). Remember to back up your site!
- Advanced Users/Those Needing More Control: Consider Method 4 (Plugin) for more advanced features and granular control.
Conclusion
Adjusting the number of products per page is a simple but crucial step in optimizing your WooCommerce store for a better user experience and increased sales. By understanding these different methods, you can find the one that best suits your technical skills and needs. Remember to test your changes and experiment to find the perfect balance for your store! Good luck!
