Change Amount of WooCommerce Products Displayed on Shop Page

WooCommerce displays by default 4 columns and 10 products per page in the shop or archive page – the products per page is based off the amount of post set to display in the WP Admin Dashboard > Reading – Blog pages show at most setting.

Change the Amount of Products

You can edit this by adding to your functions.php

add_filter( 'loop_shop_per_page', create_function( '$cols', 'return 28;' ), 20 );

Change the ‘return 28:’ value to the number of products you need to display.

Change the Amount of Rows

By default WooCommerce displays in 4 rows set to 22.05% wide and controls the layout with first and last classes assigned to the <li> element.

add_filter( 'loop_shop_columns', create_function(  '$columns','return 3;' ) );

Change the ‘return 3:’ value to the number of rows you need to display.

Also you will need to change the CSS for the width percentage of the row – so for our example above using 3 rows in your style.css add…

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
width: 29.5%;
}

You may to tweak the % amount to fit your page layout.

You can also express the row filter an alternate way.

Leave a Comment





%d bloggers like this: