AmidNature Posted June 26, 2020 Share Posted June 26, 2020 Any ideas on how to individually resize the images on my product page? For whatever reason Squarespace will only allow the user to select 1 specific aspect ratio, for all products. I'm trying to develop a website for selling photos, and photos come in all shapes and sizes. Picking one aspect ratio results in some images/products being cropped. I've already setup my "Store" using the product photo option (which allows for custom aspect ratios), and then unlinking my official product page. However, when the customer clicks on the photo they want to buy, the page updates to the official product page photo, which is cropped to the wrong aspect ratio. It appears my only option is to inject CSS code (per Squarespace IT), which I know nothing about. However, when I look at the FAQs on that potential solution, it specifically says to NOT use CSS to change image sizing. If I cannot fix this issue, it's a dealbreaker for me to use Squarespace as my web host. Hoping someone has an idea on how I can move forward. Thanks, Max Link to comment
jonnyhambone Posted August 25, 2020 Share Posted August 25, 2020 I've got the exact same issue and am very new to Squarespace. Link to comment
PhilCorleyPhoto Posted August 26, 2020 Share Posted August 26, 2020 Same problem here. Only workaround I have found so far, is to add a border around all my images so they are the same aspect ratio. Problem with this is, the layout of the product page is not optimum and when opened in the light box, the image is small. For example - a 16x9 image in a 4x3 frame Would love a proper solution. Link to comment
tuanphan Posted August 27, 2020 Share Posted August 27, 2020 Can you share link to product? We can help easier. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Maximumred Posted September 13, 2020 Share Posted September 13, 2020 Im trying to sell art work and i have the same problem some of my art is landscape and some isnt but there are no options that allow you to apply an aspect ratio to one product without applying it to ALL prodcuts. Link to comment
Lauri Posted September 13, 2020 Share Posted September 13, 2020 Having the same problem. I sell jewelry and my earrings are long and so are my necklaces. Everything on those pages keep cutting off. Help please. Link to comment
Guest Posted October 10, 2020 Share Posted October 10, 2020 Same issue here—it's so frustrating to only be able to choose one aspect ratio, and have that applied to every single art print on the entire site, regardless of whether the print itself is landscape or portrait. Is there any way for this to be adjusted? Can the aspect ratio cropping be turned off entirely, so that the images are displayed at their actual aspect ratio? It's driving me insane. Link to comment
Greystoke Posted November 1, 2020 Share Posted November 1, 2020 Using 7.1 and have same problem with mixing horizontal and vertical images in my store. It’s either or as I understand it or have I missed something? I have no knowledge in CSS so the only solution I can see right now is to set up two stores - one for vertical pics and one for horizontal. So many YouTube photographers promoting Squarespace but they don’t seem to use the service for selling pics online. …. Link to comment
tg605 Posted January 10, 2021 Share Posted January 10, 2021 I have been setting up my print store and thinking I was an idiot. Found this thread and couldn't be more disappointed to see that there really isn't a way to display my prints in the correct aspect ratio. Link to comment
flavienabbate Posted January 14, 2021 Share Posted January 14, 2021 Hello everyone, Same problem here ! It drives me mad and I'm so disappointed by SquareSpace right now, like how such an easy option is not even available on a professional website !!?? If someone knows any CSS to fix this please help ! And if someone from SS lands here please make something about it ! Link to comment
tuanphan Posted January 17, 2021 Share Posted January 17, 2021 On 1/14/2021 at 7:39 PM, flavienabbate said: Hello everyone, Same problem here ! It drives me mad and I'm so disappointed by SquareSpace right now, like how such an easy option is not even available on a professional website !!?? If someone knows any CSS to fix this please help ! And if someone from SS lands here please make something about it ! If you share link to page where you has problem, we can help easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
flavienabbate Posted January 23, 2021 Share Posted January 23, 2021 On 1/17/2021 at 12:32 PM, tuanphan said: If you share link to page where you has problem, we can help easier Hello tuanphan, thank you for your help ! My page is flaviotaneli.com, go to the "tirages" page 😉 Thank you ! Link to comment
tuanphan Posted January 24, 2021 Share Posted January 24, 2021 18 hours ago, flavienabbate said: Hello tuanphan, thank you for your help ! My page is flaviotaneli.com, go to the "tirages" page 😉 Thank you ! Add to Design > Custom CSS img.ProductItem-gallery-slides-item-image { object-fit: contain !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
flavienabbate Posted January 24, 2021 Share Posted January 24, 2021 5 hours ago, tuanphan said: Add to Design > Custom CSS img.ProductItem-gallery-slides-item-image { object-fit: contain !important; } Thank you !! It works for when you are on the page of the specific product, after clicking on it, but on the "tirage" page all products are still shown at the same aspect ratio. If you have the code for this one as well it would be awesome !! Thank you so so much ! Link to comment
flavienabbate Posted January 24, 2021 Share Posted January 24, 2021 I just got the solution ! img. { object-fit: contain !important; } That simple ! So now every image on the site is displayed on its original ratio ! Thanks a lot tuanphan ! Cheers from France ! Link to comment
Paddy34 Posted January 31, 2021 Share Posted January 31, 2021 Hi, Can you please explain to me how you go this to work? I'm struggling with having two different aspect ratios anywhere within the store products and it's pretty unbelievable how difficult it is to find answers to this issue... Site is - tonycrossephotography.com password is Snake I have even tried setting up two different pages like the posters above, and still can't get the custom CSS to work as it should... please help? Link to comment
creedon Posted January 31, 2021 Share Posted January 31, 2021 2 hours ago, Paddy34 said: I'm struggling with having two different aspect ratios anywhere within the store products As far as I can tell your images have been uploaded with a 3:2 aspect ration so code meant to prevent cropping is not going to work. Having everything in the same aspect is a good thing usually. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
EdCardwell Posted June 1, 2021 Share Posted June 1, 2021 On 1/24/2021 at 6:47 PM, flavienabbate said: I just got the solution ! img. { object-fit: contain !important; } That simple ! So now every image on the site is displayed on its original ratio ! Thanks a lot tuanphan ! Cheers from France ! I have added this to the Custom CSS but unsuccessful, Link to comment
EdCardwell Posted June 1, 2021 Share Posted June 1, 2021 On 1/24/2021 at 5:50 PM, flavienabbate said: Thank you !! It works for when you are on the page of the specific product, after clicking on it, but on the "tirage" page all products are still shown at the same aspect ratio. If you have the code for this one as well it would be awesome !! Thank you so so much ! Can you explain further please? It has not worked on my site Link to comment
photogjimi Posted June 8, 2021 Share Posted June 8, 2021 On 1/31/2021 at 12:29 PM, Paddy34 said: Hi, Can you please explain to me how you go this to work? I'm struggling with having two different aspect ratios anywhere within the store products and it's pretty unbelievable how difficult it is to find answers to this issue... Site is - tonycrossephotography.com password is Snake I have even tried setting up two different pages like the posters above, and still can't get the custom CSS to work as it should... please help? Bumping this because I am having the same issue on my storefront page. And agree, it should NOT be this difficult to AUTO the aspect ratios of product images on the store page! Link to comment
tuanphan Posted June 10, 2021 Share Posted June 10, 2021 On 6/9/2021 at 12:27 AM, photogjimi said: Bumping this because I am having the same issue on my storefront page. And agree, it should NOT be this difficult to AUTO the aspect ratios of product images on the store page! Can you share link to store page? We can take a look Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
photogjimi Posted June 10, 2021 Share Posted June 10, 2021 13 hours ago, tuanphan said: Can you share link to store page? We can take a look Thanks Tuan, you helped me with this via email! Thank you! Link to comment
ElaynaClair Posted October 21, 2021 Share Posted October 21, 2021 I am having the same issue as well, @tuanphan could you help? Link to comment
tuanphan Posted October 22, 2021 Share Posted October 22, 2021 On 10/21/2021 at 10:37 AM, ElaynaClair said: I am having the same issue as well, @tuanphan could you help? Can you share link to product page? We can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
paul2009 Posted February 14 Share Posted February 14 On 6/26/2020 at 8:44 PM, AmidNature said: Squarespace will only allow the user to select 1 specific aspect ratio, for all products. I'm trying to develop a website for selling photos, and photos come in all shapes and sizes. Picking one aspect ratio results in some images/products being cropped. Please take a look at the guide I wrote here: Product image aspect ratios on Squarespace 7.1 If anyone experiences an issue getting this to work on your Squarespace 7.1 website (this is for v7.1 sites only) please post back with details of your site - including a link to the page, and a screenshot. Did this help? Please give feedback by clicking an icon below ⬇️ adrianafo, DLM and ccpjames 2 1 About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥. Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. Content: Links in my posts may refer to SF Digital products or may be affiliate links. If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too. Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment