Woocommerce Column Grid
Hello,
In my online shop I have several product sections, but the theme options only allow me to choose grids with columns of 4 products. Is there any way of choosing a grid with 5 columns?
And isn't there a way to reduce the spacing between products in these same grids?
Can you help me?
Comments
Hi,
Please send a link to your website, and I will check if I can help you by preparing a custom CSS code for that.
Thanks
Hello!
Of course, it's this one: https://ps5digital.pt/
Please use the following CSS code:
@media only screen and (min-width:960px){ .woocommerce.columns-4 ul.products li.product:nth-child(4n+1){ clear: unset!important; } .woocommerce.columns-4 ul.products li.product:nth-child(5n+1){ clear: both!important; } .woocommerce.columns-4 ul.products li.product{ width: 18% !important; } }Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.
Best regards
Thank you! It worked and you got the 5 columns, but what about the spacing between the products?
Isn't there a way to reduce that too?
I added this property to your code and it worked:
padding: 0%!important;
But is this how it's done or is there another way via the theme options?
No, via theme options, there is no other way to achieve that, so only option to have 5 or more columns is to write a custom CSS code. The same for the padding value.
Best regards