Turn of the "Zoom image to fill space" in DAWN theme?

Hi,

I have various product images in different aspect ratios and file sizes. This is causing issue with the DAWN theme on the product pages where many thumbnails are cropped as there is a zoom to fill the space on.

Is there a way to turn this off so I do not get cropped and strange looking thumbnails?

Hi @GeeGos

Can you please provide your Store URL and Password too?

With Regards,

Dbuglab

I know in the ‘Impulse’ (payed theme) there is a setting you can toggle off and on called ’

Zoom image to fill space’ this is literally what I am trying to turn off. The auto “zoom fill” of the product thumbnails.

Hi @GeeGos ,

You can turn off zoom here

Hey, the Dawn theme does not seam to have the ‘Product information’ tab.. only ‘Product Cards’ where are you seeing “product Information” I cant see to find this?

Hi @GeeGos ,

Please go to Customize > Products > Default product.

This is the only place I can find ‘Default Product’ I click on that and not much happens… where should all the setting appear?

Kind Regards

Ok I see now what you mean. I was in Safari and it was just not showing me all the settings and options. It seams to be able to see the settings now in Chrome. It’s actually not the product zoom I am referring to… it’s the zoom or autofill that seams to be happening on the ‘Collections’ page… here allot of my products are showing cropped. Referring to the

‘Impulse’ theme (Not sure if you are familiar with this theme?) but there is a setting called ‘Zoom image to fill space’ if you toggle this off it seams to fix all of these issues on the Collections pages. But that’s not an option on the Dawn theme as far as I can see.

Hi @GeeGos ,

Please send me the link to the page you want to edit, I will check it

Hi @GeeGos ,

Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:

.product-card-wrapper .card--standard .card__inner {
	background: transparent !important;
}
.product-card-wrapper .card__media .media img {
    width: auto !important;
    right: 0;
    margin: auto;
}