Shop Columns

[Tobaunta]

I want the number of products per row in store and category archive to show 5 on pc and 2 on phones. Is this possible to change with css to overrule the options? In the options you can only change up to 4 per row.

[jade]

Hi there,

You can display 5 products per row through custom CSS.

Please try this code:

.woocommerce .products li.product {
    width: 16.8%;
    margin-right: 4%;
}

.woocommerce li.product.first {
    clear: none;
}

.woocommerce .products li.product:nth-child(5n+5) {
    margin-right: 0;
}

@media (max-width: 480px) {
    .woocommerce .products li.product {
        width: 48%;
        margin-right: 4%;
    }

    .woocommerce .products li.product:nth-child(2n) {
        margin-right: 0;
    }
}

Hope this helps.

[Tobaunta]

This worked perfect. Thanks

[friech]

You’re more than welcome, glad we could help.

Cheers!