How do I increase products per row on mobile in Brooklyn theme to 2?

Solved
Highlighted
Explorer
58 0 11

Hello,

 

How do I increase products per row on mobile in Brooklyn theme to 2?

 

At the moment it only shows 1 product per row on mobile.

 

currently this is how my product page looks likecurrently this is how my product page looks like

1 Like
Highlighted
Shopify Partner
7673 1056 2668

Hello, @jayboogie 

Thanks for post.

Please share your site URL,
So I will check and provide a solution here.

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
1 Like
Highlighted
Explorer
58 0 11

Thank you for your reply.

 

My shop link is up863477.myshopify.com

Password: above

 

I accidentally deleted the password background jpg so you will have to move your mouse around.

 

If you can help with that also, that would be great!

0 Likes
Highlighted
Shopify Partner
7673 1056 2668

This is an accepted solution.

@jayboogie 

Thanks for URL.

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

div#CollectionSection {
@media (max-width:767px) {
.medium--one-half {
    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
1 Like
Highlighted
Tourist
4 0 1

Hi Ketan, @KetanKumar 

I am wondering if you can help me here as well. I have the same concern, but I use a different theme. Here's the store's url: https://kinder-wunder.com

1 Like
Highlighted
Shopify Partner
7673 1056 2668

@muppal 

Yes, i can help you just let me know which section did you like the same way if possible to give me a screenshot so i will guide you

Thanks 

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
0 Likes
Highlighted
Tourist
4 0 1

Hi @KetanKumar 

On the collection pages, for example this one https://kinder-wunder.com/collections/boys-rompers in the mobile version. Currently there's one product per row.

 

Screenshot_20200914-134917_Chrome.jpg

0 Likes
Highlighted
Shopify Partner
7673 1056 2668

@muppal 

Thanks 

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

@media (max-width:767px) {
#custom-products .col-sm-12 {
    max-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
1 Like
Highlighted
Tourist
4 0 1

@KetanKumar you are amazing! thanks a lot, it works like a charm.

0 Likes
Highlighted
Tourist
4 0 1

@KetanKumar may I ask you if it is possible to show the tiles on the homepage also the same way? i.e. 2 in a row on the mobile?

 

0 Likes