How to view two products per row on mobile view on collection page/ product grid?

4 0 2

Hey guys! 


I'm wanting to show about 4 products at a time on mobile view, with two products per row instead of one. I think it will make my collection pages look so much more professional! I've tried so many troubleshooting suggestions and I just can't figure out how to do it. I'm currently using Monaco theme

Screenshot 2023-11-11 at 8.23.51 AM.png

Reply 1 (1)
Shopify Partner
1003 201 216

Hi @peytonbucher ,


Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code just above </body> tag


@media only screen and (max-width: 750px) {
    .collection-product-list {
        grid-template-columns: 1fr 1fr!important;




If you require further help to optimize your store, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!


Best Regards,


Buy me a coffee

For quick response - Message Me

Increase Xmas sales with BOGO+ Easy Free Gift Upsell. Get 30% OFF for 3 months with code "BFWIZZ30".