I have few images in my Media library which are uploaded through back-office. A sample image below:
I am trying to get the crop URL for the images based on the hotspot (the green dot). Since, those images are not uploaded via Image Cropper, there are no crop regions define like thumbnail, header, etc. I have seen Image Cropper documentation but that didn't helped much.
I would like to know whether it is possible to get cropped image with respect to hotspot on height & width; something like - GetCropUrl(propertyAlias: "heroImage", height: 400, width: 400) method.
you can define crops on images uploaded to the media library by going to Settings > Media Types and then open the Image media type. Here you can edit the Upload Image (alias: umbracoFile) property, which uses the Image Cropper, and add any crops you would like. These should then be accessible by using the examples in Image Cropper docs.
Hope that helps :)
All the best
Rune
Ps.: Alternatively you can add the crops by going to Developer > Data Types > Image Cropper. This is the saved configuration (Data Type) used on the Upload Image property, so will be the exact same outcome.
Get crop URL of images in Media Library
Hello,
I have few images in my Media library which are uploaded through back-office. A sample image below:
I am trying to get the crop URL for the images based on the hotspot (the green dot). Since, those images are not uploaded via Image Cropper, there are no crop regions define like thumbnail, header, etc. I have seen Image Cropper documentation but that didn't helped much.
I would like to know whether it is possible to get cropped image with respect to hotspot on height & width; something like -
GetCropUrl(propertyAlias: "heroImage", height: 400, width: 400)method.Any help will be appreciated. Thank you.
Hi Abilash,
you can define crops on images uploaded to the media library by going to Settings > Media Types and then open the Image media type. Here you can edit the Upload Image (alias: umbracoFile) property, which uses the Image Cropper, and add any crops you would like. These should then be accessible by using the examples in Image Cropper docs.
Hope that helps :)
All the best
Rune
Ps.: Alternatively you can add the crops by going to Developer > Data Types > Image Cropper. This is the saved configuration (Data Type) used on the Upload Image property, so will be the exact same outcome.
Sorry for the delay in replying back.
Thanks for the detailed reply. Exactly what I was looking for. That helps a lot.
You're so very welcome - glad it helped :)
Happy new year 🎉
/Rune
is working on a reply...