Arranging the Featured Products in two columns: Brooklyn Theme

Solved
Highlighted
Excursionist
31 0 6

Hey @diego_ezfy

How to arrange my featured products in two columns instead of a single column which will shorten my website both in mobile & desktop view.

Thanks

1 Like
Highlighted
Shopify Partner
8504 1134 2978

@souravroy 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Highlighted
Shopify Partner
8504 1134 2978

This is an accepted solution.

@souravroy 

Thanks 

Desktop view is ok for this code mobile view not look good so i will provide this better look this 

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 (min-width: 769px) {
#shopify-section-1594409313917, #shopify-section-1597170504378, #shopify-section-featured-product, #shopify-section-1597170967873 {
    float: left;
    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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Excursionist
31 0 6

Hey!

It changed the desktop view as required. Thank you so much for the magic code.

Do you have any solution for mobile view!

Thanks

 

0 Likes
Highlighted
Shopify Partner
8504 1134 2978

This is an accepted solution.

@souravroy 

Yes, if you need mobile 2 per row so remove fist code and add this code 

#shopify-section-1594409313917, #shopify-section-1597170504378, #shopify-section-featured-product, #shopify-section-1597170967873 {
    float: left;
    width: 50%;
}


u thinks mobile no more spacing so it's proper to 1 you add this code then check  

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Excursionist
31 0 6

Thanks @KetanKumar !

As you said for mobile view it's better to have single column I tried the code but I feel it's better to keep the single column.

 

0 Likes
Highlighted
Shopify Partner
8504 1134 2978

@souravroy 

Yes, right single product per row look much better on mobile 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
New Member
2 0 1

hey, i can add featured product to my collection, but not the featured products. not sure why, could you help pl. i want two featured products in two columns on my home page.

 

I am using the brooklyn theme

1 Like
Highlighted
Shopify Partner
8504 1134 2978

Hello, @theonlinestore 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes