No grid view in mobile view (Brooklyn Theme)

DVNYA
New Member
2 0 0

Hello Shopify Community !

I am having trouble finding a solution to how I can show more than one column of products in mobile view using Brooklyn theme. 

As of now, products appear in one column and is really not appealing to the eye. Is there a bit of code I can add to my site to add a grid view in mobile view like there is in desktop view 

0 Likes
dmwwebartisan
Shopify Partner
4446 1000 1274

Hey @DVNYA,

To do so you'll have to change HTML of your product listing. By default, it shows a single product on the mobile view. 

Which page do you need this? 

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
DVNYA
New Member
2 0 0

Hello @dmwwebartisan ! 

Thank you for answering us ! I need this functionnality on my collections pages, as it only shows 1 column of products. Could you help us with the lines of code we would need to add ?

Thank you very much !!

0 Likes
dmwwebartisan
Shopify Partner
4446 1000 1274

Hey @DVNYA,

Please share your website URL. On the collection page from the setting what you are using? College or Grid?

Let me know.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
dmwwebartisan
Shopify Partner
4446 1000 1274

Hey @DVNYA,

Edit code of snippets/product-grid-item.liquid file.

Check this screenshot and add small--one-half after {{ grid_item_width }}

grid-item-mobile.jpg

Check the line number properly and code as well.

This will display 2 columns on the mobile view.

Hope this works for you. :)

 

Thanks!

 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
JNLLE
New Member
2 0 0

I'm having the same exact issue and so I tried this code, but it didn't change anything!

0 Likes