Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Change number of columns in MNM grid layout
* Change number of columns in grid layout
* @param int $columns
* @param obj $product
* @return int
function kia_change_mnm_columns( $columns, $product ) {
return 4;
add_filter( 'woocommerce_mnm_grid_layout_columns', 'kia_change_mnm_columns', 10, 2 );
Copy link

maddinq commented Jan 14, 2019

looks like this snipped isn't working anymore. The Grid view show always all in one row

Copy link

theloader commented Apr 7, 2020

Hi.- this code don't work anymore as it should, one row it get 4 product, on the next row it gets 5 product and so on, 4 and 5.

Copy link

helgatheviking commented Apr 7, 2020

This code appears to still work with TwentyTwenty. It adds a columns-4 class to the <ul> that determines the grid sizes, then a first class to the first item in the row and a last class to the last item. The woocommerce/assets/css/woocommerce-layout.css then handles all the layout.

.woocommerce ul.products li.last, .woocommerce-page ul.products li.last {
    margin-right: 0;

Especially important is the 0 margin on the .last item of the row. However, if your theme has overridden woocommerce-layout.css stylesheet then the styles may not work. Specifically without it, you're almost guaranteed to get the alternating 4/5/4/5 situation as some rows will have the width for 4 and some for 5 depending on where the theme is putting the 0 margin item.

Additionally, if your theme is interfering in the WooCommerce loop somehow or if your theme has a custom grid layout... it may also not work for those reasons.

If you have a license please submit a support ticket and while I can't support individual themes, I could probably at least diagnose the issue for you:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment