Changing Product column number on Mobile Site

goldvintagechai
Tourist
6 0 2

Ive been struggling with trying to change the number of product columns on my shopify store on my mobile site. My desktop site has 3 product columns and my mobile site only has 1 when I browse products. Please help on how to change the number of columns on the mobile site. Thank you!

0 Likes
Natztech
Shopify Partner
1897 492 1173

hello @goldvintagechai 

Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.

Want to theme customize contact us E-mail : natztech2312@gmail.com | Whatsapp
PageFly Advanced Page Builder visit pagefly
goldvintagechai
Tourist
6 0 2
goldvintagechains.com ! Thank you!
0 Likes
KetanKumar
Shopify Partner
22532 2281 8384

@goldvintagechai 

thanks for store url can you please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/index.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

@media (max-width: 38em) {
grid-template-columns: repeat(2,1fr);
}

 

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 Partner | 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
goldvintagechai
Tourist
6 0 2

Hi, It didn't work when I tried that. 

KetanKumar
Shopify Partner
22532 2281 8384

@goldvintagechai 

can you please let me know where did you add this code?

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 Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Natztech
Shopify Partner
1897 492 1173

hello @goldvintagechai 

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

 

@media (max-width: 38em){
.template-collection #shopify-section-collection--template .collection__products .grid-display {
    grid-template-columns: repeat(3,1fr);
}
}

 

 

Want to theme customize contact us E-mail : natztech2312@gmail.com | Whatsapp
PageFly Advanced Page Builder visit pagefly