How can I modify the product grid size without impacting pictures in home page

How can I modify the product grid size without impacting pictures in home page

57 0 8


Yesterday I posted a question for product grid size modification and I updated  the code. But I find it also impacted my picture in home page, it was square originally but now is rectangular after updating the code.

Can someone help me fix the issue? I want all pictures square

I attach the original code below I updated for the product grid size yesterday

and also attach the home page product picture below.


.card__inner.color-background-2.gradient.ratio {
max-height: 305px !important;






Replies 2 (2)

Shopify Partner
8566 1690 1700

Hi @jessica_0430 

Please remove that code and setup your product grid image in your Online store > Themes > Customize > Collections > Default collection > Product grid > change Image ratio setting to Square Screenshot 2023-10-19 at 09.46.24.png

- Helpful? Like and Accept solution!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

57 0 8

hi Dan,

Sorry that I should mention the background why I put this code.

The reason is the size of my product grids was not consistent and want all images can be square. But somehow it will change my photo in home page.

I removed the code now and remain as it was and the home page photo now is square. Do you have any suggestion to fix the issue?


Here is my store URL: