How to setup two different views on collection page?

Store Design
, , ,
1

Hi,

We would like to have the grid view on desktop and list view on mobile for the collection page.

Do you how we can do this?

Thanks

2

Hello @Thomas-Aus ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Sections → collection.liquid file

Add this following code:

.collection-grid {
}

@media (max-width: 767px) {
    .collection-list {
    }
}

Save and preview

Hope this can help.

Transcy

3

thanks a lot @Transcy but it’s what I want :slightly_smiling_face: I was talking about the product grid. Grid view on desktop and list view on mobile.

Thanks