Edit Product Grid Layout (Brooklyn)

New Member
3 0 0

I would love to edit my product collection images to be large like the images on www.justjoyclothing.com
How do I go about doing this?
My website is www.OtisandEllie.com

0 Likes
Shopify Expert
665 170 199

Hi, @amyandell ,

This is Evita from On The Map.

 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code at the bottom of the file.

 

@media screen and (min-width: 591px) {
  #CollectionSection .wrapper {
    padding: 0!important;
    max-width: 100%!important;
  }
}

 

Best,
Evita

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
New Member
3 0 0

Thank you so much Evita!!! That worked! 
How do I get in to apply to the rest of my site and not just the homepage?

 

Amy

0 Likes
Shopify Expert
665 170 199

Add this code:

@media screen and (min-width: 591px) {
 .wrapper {
    padding: 0!important;
    max-width: 100%!important;
  }
}
On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Tourist
4 0 0

Hi OTM,

 

When I try this, it affects my entire site, inclusive of the headers and footers, touching the outer edges of the screen.

 

Is there any way to maintain the head and footers as they were, but allow the products to display big like this?

 

Thanks!

Joppie

0 Likes
New Member
3 0 0
I tried the first code and it only works for the homepage. Then I tried the second code but it changed the headers and collection images as well. Is there a way to get it to apply to just the product images?
0 Likes