How can I align product pictures in my collections?

[Alliance]

HI Guys,

I have few pics in collections that are not aligned as shown bellow, how can that be fixed!

Thank you

allianceautoproducts.com

[JHKCreate]

Hi @Alliance

The reason behind this stems from the fact that the misaligned image has different dimensions than the rest, hence the breakup.

You have two solutions here:

• Resize the image to match the others (cleanest way)
• Fix a specific image height across all images using code (could lead to more white padding/anomalies to make all images fit under one container)

[PageFly-Victor]

Hi @Alliance

This is Victor from PageFly - Landing Page Builder App.

You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.scss.css

#ProductCardImageWrapper-collection-template-4513008681100{
height: 250px;
}

Or on file theme.liquid

#ProductCardImageWrapper-collection-template-4513008681100{ height: 250px; }

Hope this answer helps.
Best regards,
Victor | PageFly

[Alliance]

Hi Victor,

I created a section using your app, but I was not able to show the discounted prices as well. How that can be fixed?

Thank you,

allianceautoproducts.com