[HELP] i want to add 2 items per row !!

New Member
2 0 0

Hello,

I use Brooklyn theme and i want to add 2 items per row on mobile.

How is look now:

https://prnt.sc/kd4w3w

How i can add 2 items/row ? On desktop i have 3 items/row but on mobile is just 1 item/row .

Thanks.

0 Likes
Shopify Partner
7 0 0

Hey Godja,

Go to 'edit code' section of your theme. Open the file: snippets/product-grid-item.liquid

On top change 'one-whole' class to 'one-half'

 

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

replace with

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

 

0 Likes
New Member
2 0 0

I don't have that in snippets/product-grid-item.liquid

0 Likes
Shopify Partner
7 0 0

Ah sorry Godja, I should have checked the link on your profile.

Not sure why but it's a bit different on your template, there's no "one-whole" in yours. So find this, must be the top 1st line:

<div class="grid__item grid-product medium--one-half large--one-third">

Change to:

<div class="grid__item grid-product one-half medium--one-half large--one-third">

 

For the logic:

one-half: set width 50% of the width of the screen on smallest to largest

medium--one-half: 50% on the tablets and larger (overrides the one on top when it's tablet or larger)

large--one-third: 33% on the desktop and larger (overrides the one on top when it's desktop or larger)

0 Likes
Tourist
5 0 0

I have the same problem. Mine had the « Product-grid-item.liquid » but not the same codeimage.jpg

 

0 Likes