Add crop functionality to the resize_image_url function.

[tstrack]

The resize_image_url function is quite handy for preventing users from adding images of an obscene size and reducing page weight. One idea to take it to the next level would be adding a crop parameter. Something like:

{{ resize_image_url("http://your.hubspot.site/hubfs/img.jpg", 300, 300, 300, crop=true) }}

would generate an image that's 300x300px.

[jmclaren]

Question - would you want the crop parameter to just crop to the dimensions you specified or for you to be able to control the cropping in some way?

[kierana]

To chime in here - I enjoyed working with Shopify's img_url filter. It was super straight forward.

https://www.shopify.co.uk/partners/blog/img-url-filter

Cropping:

{{ product.featured_image | img_url: '450x450', crop: 'center' }}

Additionally a pretty cool piece of functionality is the scale property (especialy for retina images)

{{ product.featured_image | img_url: '450x450', crop: 'center', scale: 2 }}

Thanks

Kieran

[tstrack]

A crop position would be great. X could get left, center, or right. Y could get top, center, or bottom. And defaulting to the center seems appropriate.

[M0zz0]

Yes! +1 on this, on how this should work, as an example, in Dato CMS, when you upload an image you can select the "focal point" so when you crop the image, the image is cropped automatically based on that focal point

[HaavardB]

Why isn't this standard functionality?

[SvN]

+10 Even of you're not making crops. This is very useful when using bg images in responsive designs. Definitely my favourite media functionality in Umbraco.

<figure style="background-image: url('/media/folder/image-name.jpg'); background-position: 45% 63% ;"></figure>

[John]

Shopify has this and it would be a game changer in HubSpot

[nickdeckerdevs1]

I see this idea has been submitted, is there any follow up on this?