Jump to content

Selling photos in different aspect ratios

Go to solution Solved by Ziggy,

Recommended Posts

I'm on the trial period, trying to set up a photography website. One of the services I want to offer is print sales, but I can't find a way to get the images to display properly in the store. The design template only allows for one aspect ratio which crops all images that don't match that aspect ratio. Online chat support suggested setting up a page with product blocks, but while they display ok there, once a customer clicks into the product, the detail page shows a cropped image. The page with blocks also looks very untidy.

As Squarespace is pushed so heavily on photography YouTube channels, I'm guessing I'm not the first to encounter this. Can anyone help?

Link to comment

No, you're not the first, try adding this custom CSS:

.ProductItem-gallery-slides-item-image {
  object-fit:contain !important;
}

Hope that helps!

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
🔌
 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 Did I help? Buy me a coffee?

Link to comment
Posted (edited)

That's great Ziggy! Thanks for your help. It works perfectly if I use a page with product blocks. Is there any code that would get images in the store to display without cropping also?

Edited by vinniemac
error
Link to comment
  • Solution

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
🔌
 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 Did I help? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.