WooCommerce How To Change the Number of Products Per Row
Please note that this post is over a year old and may contain outdated information.
Here is how to change the number of products/columns per row on WooCommerce product pages. You should be using a child theme of the default Storefront theme that comes with WooCommerce and not editing the Storefront theme directly. If you're using a theme other than Storefront, I'm not sure if these instructions will work.
In your child theme's functions.php file, add these lines of code:
Change the 4 to the number of products you want per row.
Most guides on the Internet miss the storefront_loop_columns filter, which is required. Leaving it out will result in products being displayed in a very odd pattern.
In your child theme's functions.php file, add these lines of code:
// Change number of columns per row
add_filter('loop_shop_columns', 'change_loop_columns', 999);
add_filter('storefront_loop_columns', 'change_loop_columns', 999);
function change_loop_columns() {
return 4;
}
Change the 4 to the number of products you want per row.
Most guides on the Internet miss the storefront_loop_columns filter, which is required. Leaving it out will result in products being displayed in a very odd pattern.