4 Methods to Change the Number of WooCommerce Products Displayed Per Page (with Video)

Change Number WooCommerce Products Per Page | LearnWoo Banner

Last updated - July 29, 2019

The default number of products in a WooCommerce shop page is 16, which is spread across 4Rows*4Columns. If you have a lot of products in your WooCommerce store, you might be looking to customize the number of products to be displayed on the shop page. This could be because of image sizes, widgets, or other design aspects of your site.

Nevertheless, in this article, we will discuss 4 easy methods to set the number of products displayed per page in WooCommerce.

4 Methods to Change the Number of WooCommerce Products Displayed Per Page

You can use any of the following four methods:

  1. Default WooCommerce Theme Settings
  2. Third-Party Theme Settings
  3. Code Snippet
  4. Free WordPress Plugin

Let us understand each method in detail.

1. Default WooCommerce Theme Settings

If you are using default themes of WooCommerce like Twenty Seventeen, Twenty Nineteen, etc, you can change the number of products in the “WooCommerce” settings of the theme.

To do this, click on the “Customize” setting on the top header menu of WordPress, as shown in the screenshot below.

Change Number of WooCommerce Products Per Page | Customize Theme
Customize Theme

This setting can also be accessed from Appearance > Customize.

Next, click on the “WooCommerce” settings in the left sidebar, and go to “Product Catalog”. You can then scroll down the left sidebar to see the “Products per row” setting and set the number of products in each row. Additionally, you can specify the number of rows on each page with the “Rows per page” setting. These settings will help you set up the desired number of products on each page.

Change Number of WooCommerce Products Per Page | WooCommerce Product Catalog Settings
WooCommerce Product Catalog Settings

2. Third-Party Theme Settings

If you install other third-party themes, the default WooCommerce settings discussed above may or may not be available to your theme. This is because some themes provide their own settings for changing the number of products per page.

For example, the OceanWP theme provides this setting under WooCommerce > Archives > Shop Posts Per Page setting, as shown below.

Change Number of WooCommerce Products Per Page | OceanWP Product Catalog Settings
OceanWP Product Catalog Settings

Not just this, these third-party themes provide additional settings for deeper customization.

3. Code Snippet

If your theme neither shows the default WooCommerce setting nor provides a custom setting for changing the number of products, you can make use of a simple code snippet and add it to the Theme Functions (functions.php) file of your activated website theme.

If you are unsure of how to update code snippets to this file, refer our article for help.

Copy the below code snippet and paste it at the end of the functions.php file.

// Change the Number of WooCommerce Products Displayed Per Page
add_filter( 'loop_shop_per_page', 'lw_loop_shop_per_page', 30 );

function lw_loop_shop_per_page( $products ) {
 $products = 12;
 return $products;
}

In the above code snippet, replace the value 12 with the value of your choice.

If the above snippet does not work for you, you can use the following code snippet.

// Change the Number of WooCommerce Products Displayed Per Page
add_filter( 'loop_shop_per_page', create_function( '$products', 'return 12;' ), 30 );

In the above code snippet, replace the value 12 with the desired number of products.

Changing the number of columns per page

Although the code snippets discussed in the above sections change the number of products, it will display in the default number of columns (3) in the shop page. If you wish to change this, you can add the below code snippet in the functions.php file.

// Change the Number of Columns Displayed Per Page
add_filter( 'loop_shop_columns', 'lw_loop_shop_columns' );

function lw_loop_shop_columns( $columns ) {
 $columns = 5;
 return $columns;
}

In the above code snippet, replace the value with the desired number of columns.

For demonstration, if we use any one of the code snippets for changing the number of products (12) discussed in the above sections and the above code snippet to change the number of columns (5) per page, we get a shop page as shown in the screenshot below.

Change Number of WooCommerce Products Per Page | Code Snippet Applied for Product Catalog
Code Snippet Applied for Product Catalog

4. Free WordPress Plugin

One such plugin used for WooCommerce customization is the Woo Shortcodes Kit.

Change Number of WooCommerce Products Per Page | Woo Shortcodes Kit plugin
Woo Shortcodes Kit plugin

This plugin provides more than 60 functions and shortcodes to customize various aspects of your WooCommerce site like the menu, shop page, account page, user accounts, access, restrictions, checkout experience, and so on.

To change the number of products per page with this plugin, download & install the plugin, and move to the “Settings” dashboard to get started, as shown in the below screenshot.

Change Number of WooCommerce Products Per Page | Woo Shortcodes Kit Settings
Woo Shortcodes Kit Settings
  • Scroll down to find the “CUSTOMIZE OR BUILD YOUR SHOP PAGE” settings. Click on it to reveal further sub-settings.
  • Toggle the setting “Enable Products per page Manager”.
  • Next, click on the “Show Advanced Options” on the bottom right corner of the respective setting to reveal further settings.
  • Set the number of products per page in the given text field.

A screenshot of the sample settings is shown below.

Change Number of WooCommerce Products Per Page | Changing Number of Products Per Page
Changing Number of Products Per Page with Woo Shortcodes Kit plugin

In the above screenshot, the number of products per page is set to 12. You can change to the desired value. If you set the value as -1, all the products will be shown on the same page by removing the pagination.

You can also watch the below video tutorial.

Conclusion

If you do not want to touch your files or are not comfortable with code snippets, you can use a plugin to do the job. Although plugin can help you with the customization, it is not a suitable option if you already have long list plugins activated in your site. Hence, you should use plugins only if you want more customization than just changing the number of WooCommerce products displayed per page. For the former case, I advise you to choose the code snippet method.

If you have found any other solution, code snippet, or plugin that has worked best for you, share with us in the comment. Although I have tested all the discussed methods, I am curious to know if it has worked for you. Do let me know in the comment section.

 

Suggested reading:


You can check out blog articles on WordPress BasicsWordPress Security & Performance, or WooCommerce customizations for learning about different aspects of WordPress and WooCommerce.

Or continue exploring LearnWoo for more amazing articles.

LEAVE A REPLY