Solved

Can I modify the mobile collection list grid in the Venture theme?

amit101297
Explorer
86 1 21

Hi,

i'm using in ventuer theme

How can i change the grid of the collection list in the mobile display, there is currently one image per line

I need to have at least 2 pictures in each row

my site: https://www.outfiteam.com/

צילום מסך 2020-08-22 ב-23.27.36.png

thank you!

Accepted Solutions (2)

KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

Hello, @amit101297 

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) {
#collection-list-grid .grid__item {
    width: 50%;
}
.featured-card--contain {
padding: 6px;
}
}

 

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

diego_ezfy
Shopify Partner
2934 562 883

This is an accepted solution.

@amit101297 here is how to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:



You can change the 0px to any value you want, it is the bottom spacing on mobile devices. Example: -40px or 40px



 

@media only screen and (max-width: 749px) {
#shopify-section-featured-collections .grid__item{
    width: 50% !important;
    margin-bottom: -00px;
}
}

 


Please let me know whether it works.

Kind regards,
Diego

 

◦ I can help you further! Top #4 Shopify Expert, 24h reply. Click here to hire me.
◦ Follow my blog & youtube for more free coding tips.
Download copy/paste code snippets that can replace most apps.

View solution in original post

Replies 12 (12)

KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

Hello, @amit101297 

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) {
#collection-list-grid .grid__item {
    width: 50%;
}
.featured-card--contain {
padding: 6px;
}
}

 

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

diego_ezfy
Shopify Partner
2934 562 883

This is an accepted solution.

@amit101297 here is how to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:



You can change the 0px to any value you want, it is the bottom spacing on mobile devices. Example: -40px or 40px



 

@media only screen and (max-width: 749px) {
#shopify-section-featured-collections .grid__item{
    width: 50% !important;
    margin-bottom: -00px;
}
}

 


Please let me know whether it works.

Kind regards,
Diego

 

◦ I can help you further! Top #4 Shopify Expert, 24h reply. Click here to hire me.
◦ Follow my blog & youtube for more free coding tips.
Download copy/paste code snippets that can replace most apps.

LowTides
Tourist
3 0 1

Do you know how to do this for the Venue theme?

KetanKumar
Shopify Partner
36839 3635 11972

@LowTides 

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

How to do this for the prestige theme on mobile view?

here is the link

https://finerfabric.com/

KetanKumar
Shopify Partner
36839 3635 11972

@Koustubh 

sorry for that issue but i can see its proper 

KetanKumar_0-1628558735021.png

 

@LowTides 

can you please provide screenshot where do you have change this?

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

On the home page. 

The collection List Right under the banner(slideshow).

I have to swipe for the next collection to appear. I want it in grid form and two In one row

 

123456.PNG

Koustubh
Tourist
4 0 1

In desktop view It shows two in a row but in mobile I have to swipe

Koustubh
Tourist
4 0 1
LowTides
Tourist
3 0 1
yodendaal
Excursionist
25 0 14

How can I accomplish this in the Atlantic theme please!!

KetanKumar
Shopify Partner
36839 3635 11972

@yodendaal 

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