I'm using the image cropper on my media type > Image > Upload Image
. This seems to be the best solution for creating responsive images in the media library.
However, this presents me with the problem of finding out how to get the URL for my images now.
Usually for Image Croppers I would use this code:
@Model.Content.GetCropUrl("image", "my-crop-name")
However if I try to get the image crop this way I get this instead:
<img src="Umbraco.Web.Models.DynamicPublishedContent?mode=pad&rnd=131108182860000000" />
I was expecting to get an image URL with the crop I specified. This works fine for standard image croppers but not ones on my images in the media library. Why is that? And how should I get the crop URL for these images?
I'm using v7.4.2
In order to get a crop URL for an image in the media section you first need to retrieve the image as IPublishedContent
. You can do this as follows:
var imageId = Model.Content.GetPropertyValue<int>("image");
var image = Umbraco.TypedMedia(imageId);
Or if you're using the excellent Core Property Value Converters package you can retrieve it directly without having to perform the conversion:
var image = Model.Content.GetPropertyValue<IPublishedContent>("image");
You then need to call the GetCropUrl()
method on your image. If you've replaced the default Upload property with an Image Cropper property, and kept the property alias the same (umbracoFile
), you can just pass in the crop alias:
var cropUrl = image.GetCropUrl("my-crop-name");
If the alias of your Image Cropper property is different to the default you will need to pass that as an additional argument:
var cropUrl = image.GetCropUrl("imageCropperAlias", "my-crop-name");