NARRATIVE - how to show 2 rows of product on mobile?

Solved
Logicbomb
Excursionist
9 0 0

Hi guys i'm adding a "featured collection" section on my homepage but i'd like to have more than 1 product per row on mobile, is it possible to increase the value of the products per row in mobile view? :) thanks! 
here's a screenshot of the "featured collection" section i'm talking about: 

Schermata 2019-12-08 alle 21.52.44.png

0 Likes

Hello 

You are using narrative theme as there is default feature to show one product on mobile biew.

You need theme customization to display two images on mobile view.

 

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Jasoliya
Shopify Expert
4131 569 999

Hi @Logicbomb 

Add this css in Asset->theme.scss file at bottom:

@media only screen and (max-width: 767px) {
      .featured-collection .card:nth-child(2n+1) {  clear: both; }
      .featured-collection .card{width:50%;float: left;padding-left: 5px;}
    }
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Logicbomb
Excursionist
9 0 0

thank you @Jasoliya  i'm gonna try it as soon as i get home :)

0 Likes
Logicbomb
Excursionist
9 0 0

@Jasoliya  so apparently code has something wrong, this is how it looks on mobile lol


WhatsApp Image 2019-12-09 at 21.22.50.jpeg

0 Likes
Jasoliya
Shopify Expert
4131 569 999

Send me your store url

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Logicbomb
Excursionist
9 0 0
Jasoliya
Shopify Expert
4131 569 999

Add this css:

#shopify-section-1575635968868 .collection-list{ padding: 0;}
#shopify-section-1575635148682 .collection-list{ padding-bottom: 0;}

Note: this css only work for you and if you add and remove section the id will change 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Logicbomb
Excursionist
9 0 0

@Jasoliya so i'm adding this to theme.scss at the bottom and then i put the featured collection section on my homepage? 

0 Likes
Jasoliya
Shopify Expert
4131 569 999

No just add this css in theme.scss file at bottom. section already added on you store

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes