Woocommerce store layout (rows & cols) not even

How do we get our store’s rows and columns evenly distributed?

See http://take.ms/TXfBR for how they appear most often.

Dear Matt,

Thank you for asking. In order to achieve such that objective, try adding the following function into the child theme’s functions.php file or you can use the Functionality plugin if you haven’t yet running a child theme or don’t want to use it.

 * Display 4 products per row 
function sydney_child_shop_columns() {
    return 4;
add_filter('loop_shop_columns', 'sydney_child_shop_columns', 90);

Then apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css.

@media only screen and (min-width:769px){
	.woocommerce .content-area ul.products li.product, 
	.woocommerce-page .content-area ul.products li.product {
		width: 22.05% !important;


The functionality plugin worked.

We had first tried the child theme route but that did not appear to work.

Question now is can we remove the child theme without reversing the ordered displays? If we keep the plugin.

If you haven’t done modifications other than what I’ve suggested, you can activate the parent theme then delete the child theme.