Resize an image using an image cropper in Umbraco 7.6
Update: I'll make some crops for the Umbraco's image cropper (Umbraco.ImageCropper) in Umbraco 7.6. The users uploads images over the 4MB (some images are over the 7MB). Now I'll crop resize this images to improve page speed.
I've seen that some of the images are taken in landscape and others in portrait. For a image gallery I'll have the original height and width ratio but with a max width of 500 pixels with a variable height.
I've tried to place the height empty and place to zero but both gives me an error:
I can only make crops with a fixed width and height. Now my questions are:
Could I give the crop a variable height dependent on the original size of the image?
This would be useful. I think for your image file sizes you might be able to use imageprocessor or a google plugin (I think it is called something like PageSpeed) to optimize them to also improve your end user experience.
You should be able to make use of the GetCropUrl method in your code. Instead of setting up a crop, just pass in the width of 500 and you should probably also set the ImageCropMode to Max. So, your img tag would be something more like:
This should resize the image to have a width of 500 but keep the height inline with the aspect ratio. ImageCropMode.Max should also ensure that the image isn't stretched to 500 width if it happens to be smaller than that.
Resize an image using an image cropper in Umbraco 7.6
Update: I'll make some crops for the Umbraco's image cropper (
Umbraco.ImageCropper) in Umbraco 7.6. The users uploads images over the 4MB (some images are over the 7MB). Now I'llcropresize this images to improve page speed.I've seen that some of the images are taken in landscape and others in portrait. For a image gallery I'll have the original height and width ratio but with a max width of 500 pixels with a variable height.
I've tried to place the height empty and place to zero but both gives me an error:
I can only make crops with a fixed width and height. Now my questions are:
For now I've found a fall back to do this: Here is my code:
imgtype ofImageis the variable with the current imageI haven't created a new crop for that.
This would be useful. I think for your image file sizes you might be able to use imageprocessor or a google plugin (I think it is called something like PageSpeed) to optimize them to also improve your end user experience.
Hi,
You should be able to make use of the
GetCropUrlmethod in your code. Instead of setting up a crop, just pass in the width of 500 and you should probably also set theImageCropModetoMax. So, your img tag would be something more like:This should resize the image to have a width of 500 but keep the height inline with the aspect ratio.
ImageCropMode.Maxshould also ensure that the image isn't stretched to 500 width if it happens to be smaller than that.Hope that helps!
is working on a reply...