Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Working with extremely landscape and extremely portrait images

Recommended Posts

Site URL: https://fox-magnolia-xkg2.squarespace.com/

This site has some products images that are widescreen (very landscape) and also images that are very portrait (very narrow and tall).

I am managing to keep this issue in check using square thumbnails for the product listings but for individual products on mobile particularly some of the images are cropping really badly whereas they need to be shown in full.

Good examples of this extreme are: https://fox-magnolia-xkg2.squarespace.com/garden-birds/hungry%20brood (landsape)


https://fox-magnolia-xkg2.squarespace.com/garden-birds/spring%20willow (portrait).

I have tried all the aspect ratio settings for the images but none of them solves the problems in all cases.

What's the best way of solving this problem?




Share this post

Link to post

Thanks. Had a look at this but whatever I do within the Squarespace settings I can't get it to work.

I end up with the heavily cropped version I've attached which is obviously useless to the user looking at the site instead of the full image. 


Screenshot 2020-05-15 at 07.56.30.png


Share this post

Link to post

Is there no CSS hack to make this work? Otherwise I'm going to need to re-upload all the images as square with the corresponding background with the actual image sitting in the middle of it either horizontally or vertically.

Share this post

Link to post
Posted (edited)

This may sound a bit to simple, but with mobile sometimes it depends on which way the phone is turned. Some sites tell people to do just that, turn you phone to landscape to view a landscape and portrait to view a portrait. The site will adjust when the phone is turned. The images are larger this way also. A bit of text that gives a "for best viewing" hint or something to that effect could be added.   Just a thought. 


Edited by derricksrandomviews

Share this post

Link to post

But the images are cropping the same whether I turn the phone round or not. Squarespace (or the theme itself) seems to be cropping the images.

Share this post

Link to post

Create an account or sign in to comment

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

  • Create New...