want 2 products per row in mobile- Brooklyn theme

Excursionist
28 0 1

I want to display 2 products per row instead of 1 for mobile view in Brooklyn theme.

0 Likes
Tourist
41 0 2

Hi,

Change grid class from one-whole to one-half

http://prntscr.com/ijip08

 

Best regards

theme and app developer
0 Likes
Excursionist
28 0 1

I could not found "one-whole" code line in featured-products.liquid

 

Thank you

0 Likes

You're looking to modify this part of the product loop.

<div class="grid__item grid-product grid__item--large one-whole medium--two-thirds large--two-thirds">

the "one-whole" portion is what you're seeing on mobile.  Change it to one-half.

Look for other liquid file includes in the featured-products.liquid.  I don't have the theme code on hand, but I'd guess that it's part of a product-grid related snippet that's included in featured-products.  May have to create a duplicate of that product loop snippet for use in your featured products.

Conspire Agency //
Los Angeles, California //
https://conspireagency.com
0 Likes
Tourist
41 0 2

Thank you, Daniel :)

theme and app developer
0 Likes
New Member
1 0 0
Hi.. I edited the code and it worked but now my products are not align with each other.. could u please help? On desktop its still okay but not on mobile..
0 Likes

Without looking at the code I couldn't tell you, but this will likely require minor updates to css wrapped in a media query for mobile devices.

 

May want to start here with the centering for images / block level elements.

https://www.w3.org/Style/Examples/007/center.en.html

 

Cheers

Conspire Agency //
Los Angeles, California //
https://conspireagency.com
0 Likes
Tourist
9 1 0

none of these codes are helping me, I can't find them in my Brooklyn theme at all... can you please look over the code before


@ConspireAgency wrote:

Without looking at the code I couldn't tell you, but this will likely require minor updates to css wrapped in a media query for mobile devices.

 

May want to start here with the centering for images / block level elements.

https://www.w3.org/Style/Examples/007/center.en.html

 

Cheers



if you're going to help?

0 Likes