Solved

Debut Theme - Change Product Image Size on Collection Page

DearAbigael
Visitor
2 0 2

Hi there,

Our store is using Debut Theme and the Product Image Sizes on the Collection Pages are too small.

Our page is here: https://dearabigael.com/collections/dress-shop

There is another store using a very similar implementation of Shopify and they have the correct images here: https://www.marigoldmustang.com/collections/dresses

Screenshots

Current:

Screen Shot 2021-03-06 at 10.41.05 pm.png

Desired:

Screen Shot 2021-03-06 at 10.41.18 pm.png

 

I have fixed a similar problems on the homepage with the 'featured collection' section by using the steps outline in this support thread, but the same fix did not work for collections: https://community.shopify.com/c/Shopify-Design/Debut-Theme-Change-size-of-featured-collection-pictur...

Any help would be greatly appreciated 

Accepted Solution (1)

dmwwebartisan
Shopify Partner
12310 2550 3703

This is an accepted solution.

@DearAbigael 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.grid-view-item__image-wrapper {
max-width: 343px !important;
max-height: 540px !important;
}

#Collection .grid-view-item__image {
max-width: 343px !important;
max-height: 540px !important;
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 4 (4)

dmwwebartisan
Shopify Partner
12310 2550 3703

This is an accepted solution.

@DearAbigael 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.grid-view-item__image-wrapper {
max-width: 343px !important;
max-height: 540px !important;
}

#Collection .grid-view-item__image {
max-width: 343px !important;
max-height: 540px !important;
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
DearAbigael
Visitor
2 0 2

Perfect!

Many thanks @dmwwebartisan! That got it!

Cheers,

Dear Abigael

gertrudeseco
Shopify Partner
3 0 0

What if I also want to change the image size of the featured collection

 

lefteyes
Excursionist
39 0 7

Hi,

Thanks for the solution but how can I put the texts at the same level?

collection1.png