Shopify themes, liquid, logos, and UX
I've seen people post code in this forum that can be plugged into different sections of the Theme's code to get all of the photo aspect ratios the same. Unfortunately, the 'Trade' Theme has different code sections than the ones with instructions, so I was hoping someone could point me in the right direction.
Much appreciated!!
This is because you do not need any code.
In Customizer, when on collection page, open settings for "Product Grid" section.
Under "Product card" heading you can select your image aspect ratio options -- select Portrait or Square instead of default "Adapt..."
If necessary, you can then override aspect ratio by adding code to Custom CSS setting of this section like:
.card, .card__inner {
--ratio-percent: 66% !important;
}
Tim,
Thanks for your help! Unfortunately, I don't have 'Adapt to Image' as an option under Product Card (see image).
Alternatively, when I put the code you suggested into Custom CSS, it's cropping the photos as such:
Of course you can change the 66% aspect ratio to whatever suits your products.
And obviously, if images do not fit, they will be cropped either vertically or horizontally...
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025