Show collections in grid view on mobile

Solved
MaxxVE
Excursionist
20 0 2

Hi,

 

I am using the Brooklyn theme and I would like to show my “Shop Lash Styles” collection in a grid instead of a straight line.

 

Here is my website: www.vanityeyz.com. Thank you in advance.

KetanKumar
Shopify Partner
16953 1838 6344

This is an accepted solution.

Hello, @MaxxVE 

Welcome to the Shopify community!
and Thanks for your question.

1. Go to Online Store->Theme->Edit code
2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.

@media screen and (max-width: 768px) {
#CollectionSection {
.grid-product {
    width: 50%;
}
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
MaxxVE
Excursionist
20 0 2

Its PERFECT!!!! Thank you!

KetanKumar
Shopify Partner
16953 1838 6344

@MaxxVE 

Thanks for update and your complimets

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
SugarAnt
New Member
2 0 2

I have Brooklyn theme and here is my url https://sugarantssweetapparel.com/ I want to have the products shown in grid mode while being in mobile please help!

KetanKumar
Shopify Partner
16953 1838 6344

@SugarAnt 

thanks for the post and details 

1. Go to Online Store->Theme->Edit code
2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.

@media screen and (max-width: 768px) {
#CollectionSection .grid-uniform {
    display: flex;
    flex-wrap: wrap;
}
#CollectionSection .grid__item {
    width: 50%;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
SugarAnt
New Member
2 0 2

Worked like a charm! Thank you so much!!!!!

KetanKumar
Shopify Partner
16953 1838 6344

@SugarAnt 

it's my pleasure to help us

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing