Changing collection image sizes in Brooklyn theme

Highlighted
New Member
23 0 0

Hello,

I have searched the forum and have found bits of information on how to change collection image sizes but still having trouble doing so.  I am using the Brooklyn theme and currently the products are in rows of three in the collection grid which is fine but the product images look really small.  Does it have something to do with the size I am saving the images at or, is there something I can do with code to make them larger.  

I tried looking in the collection-grid-collage.liquid section but was not sure what to change.

Would also like the images to move up closer to the product title...seems like a lot of white space there...

I am happy with the size of the prouct images when viewed on their individual pages...it's just the collection grid seems small....would like the product sizes to be at least 10% larger. 

Trying to attach an image - still figuring out how to do so.

Thank you for any help!
Anne

0 Likes
Highlighted
New Member
23 0 0

I figured it out!  I changed the product collage grid sizes in theme.scss.liquid and it worked great!

0 Likes
Highlighted
New Member
2 0 0

Anne8 or Shopify support

 

That did not work for me .   So I went to :

 

 

ASSETS

 

theme.scss.liquid

 

// Product Collage Grid
$collageImageXLarge: 670px;
$collageImageLarge: 520px;
$collageImageMedium: 310px;
$collageImageSmall: 230px;

 

I increase the pixels by about 90% for each size categories but all my product images remain the same on the grid page.  What am I missing?

 

 

 

0 Likes
New Member
1 0 0

So I have the opposite problem. The collections list for me is too big and displays one stacked on another. how do i change it to two collections lists per row?

0 Likes
Highlighted
Excursionist
18 0 3

Hi did anyone figure out how to do this? The theme is perfect for my store except for the very large collection images. I would also like to change the size of these and make them smaller.

--

Edit: Figured it out! Changed third to quarter :) 

0 Likes
Highlighted
New Member
2 0 0

Hi,

 

Could you please share what you edited and in which file? I have been trying to make the collection grid hold 4 products instead of 3 as currently. 

0 Likes
Highlighted
New Member
2 0 0

I never got it to work, I switched themes

0 Likes
Highlighted
Excursionist
18 0 3

I went to collection-template.liquid and found the code below and changed 'third' to 'quarter' like below:

 

<div class="grid-uniform">
{%- assign grid_item_width = 'medium--one-half large--one-quarter' -%}

1 Like
Highlighted
New Member
2 0 0

Thank you so much, it worked like a charm (and I have tried for so many days) :) 

0 Likes
Highlighted
New Member
1 0 0

It works on the collection page but it dosnt work on the home screen when i add the collection to the home screen, anyone know how to make it from 3 products per grid to 4 or 5 on the home page??


@shreeg wrote:

I went to collection-template.liquid and found the code below and changed 'third' to 'quarter' like below:

 

<div class="grid-uniform">
{%- assign grid_item_width = 'medium--one-half large--one-quarter' -%}


 

0 Likes