Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Am I being daft, or is there no way to crop around my focal point? I've read a lot of articles and I can't see how to do this.
Quick summary of my situation. I'm using an image added by my client when customising a page as a header background. I take the input and use inline CSS and the img_url filter to add it as a background.
If the image is a big square, for example, and I need a letterbox I can set img_url: '750x300' to save downloading more of the image than I need. However if I set no crop value it is actually giving me an image sized at 417x300 (which is then grainy above 417px screenwidth) or, I set a crop, but only have access to the left, right, top, bottom, center keywords. It feels like there should be a way to crop to the set size around the focal point.
Would really appreciate anyone's help. Thank you.
Wes
Also looking for this, since for our CMS editors, they perceive changing the "focal" point as the "center".
It'd be awesome to have "focal" as a separate crop option
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025