Jump to content

Changing Aspect Ratio For Product Image Only On Mobile

By cooriestudio, in Fonts, colors and images

Go to solution Solved by Lesum,

Recommended Posts

cooriestudio Level 2

cooriestudio

Posted
Posted

Hello,

We were interested in seeking guidance in how to change the aspect ratio of our images on mobile to square, they seem to be locked into 3:2 on mobile, but our desktop version seems to dynamically or auto select aspect ratios for our images.

We would like to retain our desktop version to auto display images, whilst unlocking our mobile images to dynamic or fix as square - 1:1 images.

Website is :https://coorie.studio/

Thanks for your help!

Link to comment
  • Replies 2
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

Lesum
Lesum

Hi, 1:1 aspect ratio will crop images on mobile view. Here's a code snippet to display product images dynamically.  img.ProductItem-gallery-slides-item-image { object-fit: contain !important; }

  • Solution
Lesum Level 9

Lesum

Posted
  • Solution
Posted

Hi, 1:1 aspect ratio will crop images on mobile view. Here's a code snippet to display product images dynamically.  

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

Let me know if that works. Thanks! 

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer
☕ Did you find my contribution helpful? Buy me a coffee?

Link to comment
  • 3 weeks later...

Create an account or sign in to comment

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

Sign Up / Login
Go to topic listing
×
×
  • Create New...

Squarespace Webinars

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

Upcoming Webinars →

Hire a Designer

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

Get Matched →

Support

Community

Developers

Resources