Archive
This post is archived and may contain outdated information. It has been set to 'noindex' and should stop showing up in search results.
This post is archived and may contain outdated information. It has been set to 'noindex' and should stop showing up in search results.
WooCommerce How To Change the Number of Products Per Row
Oct 16, 2017Web DevelopmentComments (2)
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.