Urgent - Theme Motion: Featured collection on Home Page - 2 products per row

Solved
MaxCosta
Trailblazer
166 0 53

Hello all,

 

This is my first post on this forum because I have an urgent problem with a Shopify store using the Motion theme.

I want to add a Featured Collection on my home page with 2 products per line and 3 product lines. As on this site: https://www.eliou-eliou.com/

When I add the "Featured collection" Section, the layout is perfect on computer, but on mobile, it looks like a "switcher" or "slider" form, and it doesn't suit me at all ...

Like on the site I sent you, I would like to have 2 products per line on mobile and keep this layout on my desktop.

The strangest thing is that on my Collection Page on Mobile, I have 2 products per line and it's perfect. But this change should only apply to the home page.

I tried a lot of things but can't find any solution ... you would save me if you could help me ..!

Here is a preview link of my site which is not yet live : https://v0b1y1qikmo74hph-47455862950.shopifypreview.com

 

Thank you in advance...

Max C.

Replies 29 (29)
KetanKumar
Shopify Partner
24919 2496 9029

@MaxCosta 

thanks for it 

sorry your link doesn't work now 

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
MaxCosta
Trailblazer
166 0 53
KetanKumar
Shopify Partner
24919 2496 9029

This is an accepted solution.

@MaxCosta 

Thanks for the update, yes please add this code

.color-swatch--small:before, .color-swatch--small {border-radius: 100px;}
.grid-product__colors{justify-content:  center;}
@media only screen and (max-width: 589px) {
#shopify-section-16193798554af94825 .grid-overflow-wrapper .grid__item:first-child {margin-bottom: 30px;}
}
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

MaxCosta
Trailblazer
166 0 53
MaxCosta
Trailblazer
166 0 53

@KetanKumar iam sorry to come back...

C7E08728-D813-49D3-A24B-D14AE9591EDD.png

 A lot of times on mobile when I launch the store, the color variants are not displayed. Although they are visible in my « customize theme » section... but when I go to « preview » with my mobile, we do not see...

 

What do you think about that ?

 

max 

KetanKumar
Shopify Partner
24919 2496 9029

can you please share page url for  this issue 

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

Hello! I am needing help with my homepage. The section is .home_collection_section and I would like for there to be the three collections in a row and currently it is showing two collections in a row with the third underneath aligned to the left. https://originalsprout.com/

 

Here is the code I found in theme.scss.liquid

.home_collection_section {
width: 50%;
float: left;
margin: 30px 0px;
text-align: center;
.caption_text_collection{
font-size: 48px;
font-style: italic;
text-transform: capitalize;
font-family: 'Bodoni-BookItalic';
color: #666666;
text-shadow: none;
position: relative;
}

KetanKumar
Shopify Partner
24919 2496 9029

@breeziecee 

do you have like this look pleas confirm

KetanKumar_0-1635390289583.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
breeziecee
Tourist
10 0 2

Thats what I want it to look like right now it looks like this:

Capture.JPG