Change number of products per row on Mobile Venture theme

[ohmar]

On the collections page of Venture's theme, it only shows 1 product per row on mobile. Is it possible to change it to 2 a row? Any help would be appreciated

[Jasoliya · Accepted solution]

Hi @ohmar 

Follow this:

1. Go to Online Store->Theme->Edit code
2. Template->collection.liquid->find {% for product in collection.products %} and change "small--one-hal" class in this loop to small--one-half

so it look like:

<div class="grid__item medium-up--one-third small--one-half">
   {% include 'product-card', product: product %}
 </div>

[ohmar]

thanks for the help! it worked

[EMWA]

Hi , I am having the same problem but I am using the Narrative Theme. When i look at the  .collection.liquid it only says {% section 'collection-template' %}

Thank you. My site is https://sh-t-we-made.myshopify.com/

[Jasoliya]

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css->paste bellow code in bottom of file

@media screen and (max-width: 769px){
    .collection-template .card{width:50%;float:left;}
}

[EMWA]

Hi! Thank you so much that was so helpful. Since this worked so well i was wondering if you could help me with another mobile issues.

When I load my site on mobile the first gallery section on my homepage is always cut off. Can you help me re-size this home page gallery for mobile?

[EMWA]

Also Is it possible to organise the pictures in collage style on the mobile and grid style on web? thanks! 

[Jasoliya]

Send me store password 

[EMWA]

shtwmd

[Jasoliya]

Do you want to change this section?

[EMWA]

Click to expand...

I would like the change the section above so it looks the same in mobile view (currently 1 in a row) as it does on website view (3 in a row) I would like it to look something like this on mobile view only 

 

[Jasoliya]

Follow  this 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css->paste bellow code in bottom of file

@media only screen and (max-width: 767px) {
             .card-list__column .card{width: 33.33%;float: left;}
}

[EMWA]

Thank you so much it worked! - it looks great now! 

[DorisPetty]

Hi, I made the same adjustment on Brooklyn, but nothing happened. Do you know how to modify it on Brooklyn to make it shows 2 products per row on mobile view?

[Jasoliya]

send store url

[DorisPetty]

Solved, thanks!

[LowTides]

I am attempting to change the mobile product grid on the Venue theme, any help?

[ojazdowski]

Thank you for this solution.
I am also using the venture theme and I am also trying to change the number of items in a row for my Featured Collection on the homepage.
On desktop I have five items per row. I would like to change this to 4.
On mobile, I have two items per row. I would like to change this to 1.
Thank you for your time