Solved

how to show two products in a row for each collection mobile version? I use debut theme

holahome
Tourist
10 0 2

Hi, guys seems like i got little confusion here, my site desktop version is optimised with 3 products in a row, however its different with the mobile version it shows just one product per row and i do have around 20-30 products per collection. please let me know how to fix this. i am using debut theme at the moment

Accepted Solution (1)
KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@holahome 

Thanks for it

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

@media only screen and (max-width: 749px) {
.grid__item.grid__item--collection-template {
    width: 50% !important;
}
}

 

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

View solution in original post

Replies 14 (14)

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @holahome 

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

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 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
holahome
Tourist
10 0 2

www.crossmanhome.myshopify.com

password: taltau

here it is

KetanKumar
Shopify Partner
36839 3635 11972

@holahome 

Thanks for store URL.

sorry but i can't see grid view can you please show me

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
holahome
Tourist
10 0 2

hi! here's my store www.crossmanhome.com

KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@holahome 

Thanks for it

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

@media only screen and (max-width: 749px) {
.grid__item.grid__item--collection-template {
    width: 50% !important;
}
}

 

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
TheUrbanMiami
Visitor
1 0 0

Copied and pasted this as instructed and it did not work. 

Please advise on correct code / solution. 

Thank You

Beytibyarabesqu
Explorer
47 0 19

Hello @KetanKumar 

 

I'm using Debut Theme, and

 

  1. I have 2 collections per row on my desktop home page. However, I just have 1 collection per row displayed on the mobile version. I want them to be as in the desktop: to display two collections in a row on the  mobile version. I tried adding the code below, but I can't find: Asset->/theme.scss.liquid-> I just have  theme.css and theme.js under Assets
  2. I am trying to make the collection names on the home page, go underneath the photos, and not overlay as they do now. I don't want them on the photo, but underneath. How can I do?

 

Let me know how can I do,

 

Thanks,
M

KetanKumar
Shopify Partner
36839 3635 11972

@Beytibyarabesqu 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you 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 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
Beytibyarabesqu
Explorer
47 0 19
KetanKumar
Shopify Partner
36839 3635 11972

@Beytibyarabesqu 

yes please confirm

KetanKumar_0-1637096801098.png

 

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
Beytibyarabesqu
Explorer
47 0 19

@KetanKumar exactly i want them like this on the mobile version (as they are like this on desktop!)

 

Also, I am trying to make the collection names on the home page, go underneath the photos, and not overlay as they do now. I don't want them on the photo, but underneath. How can I do?

 

thankssss

KetanKumar
Shopify Partner
36839 3635 11972

@Beytibyarabesqu 

yes please try this code

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

.collection-grid .medium-up--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 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
Beytibyarabesqu
Explorer
47 0 19

@KetanKumar amazing it worked!!

i just need now to put the collection title on the home page only below the images instead of overlay. do u know how?

KetanKumar
Shopify Partner
36839 3635 11972

@Beytibyarabesqu 

yes please sent this section code so i will update

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