Image resize in EPiServer 7.5

Dejan Caric

Vote:

Hello fellow developers!

I have a page type that has Image property. That image has to be displayed on different views (details page, listing page, etc.) but in different sizes.
E.g. on details page we need 600x200, on listing page we need 300x100, etc.

I’d like to avoid to create 3 different properties and force the epi editor to upload the same image but in 3 different sizes :)

I also don’t want to create a handler that will resize the image on the fly because it’s a very expensive operation (especially for news website). If I want to implement "caching on the file system functionality", how can I trigger resizer when editor changes the image in epi?

Back in EPiServer 6 days, we used EPiImage. Is there a similar tool in EPiServer 7.5, which is both developer and editor friendly?

Any help would be greatly appreciated!

#86678

May 28, 2014 11:16

Martin Pickering

Vote:

If you were to use the ImageResizing.Net sub-system from Imagen and the integration code to be found via the Code area in world.episerver.com and aslo on Git.Hub then you can get on-the-fly image resizing features into EPiServer 7.5.

If you went further and licensed the Performance Pack from Imagen then you would get some great performance features as well. I would have thought that these combinations of things woud/could overcome your fears about performance whilst providing a quick and simple to deploy and utilize solution for you.

#86697

May 28, 2014 15:05

valdis

Vote:

http://nuget.episerver.com/en/OtherPages/Package/?packageId=ImageResizer.Plugins.EPiServerBlobReader

https://github.com/valdisiljuconoks/ImageResizer.Plugins.EPiServerBlobReader

#86718

May 29, 2014 0:03

valdis

Vote:

One of the most popular plugin from Performance Edition of ImageResizer is `DiskCache` that will create requested resized images on the disk. Sometimes because of open files there deployment of the site fails, but that's totally another story :)

#86719

May 29, 2014 0:05

Marija Jemuovic

Vote:

If you have the desirable width defined, but the image height can scale, you can use out of the box functionality + Chief2moro.ImageDataExtensions.

This is how my imagefile looks like:

    [ContentType(GUID = "some guid")]
    [MediaDescriptor(ExtensionString = "jpg,jpeg,jpe,gif,bmp,png")]
    public class ImageFile : ImageData
    {
        public virtual string Title { get; set; }
        public virtual string AlternativeText { get; set; }
        
        // for large first image on article and similar
        [Editable(false)]
        [ScaffoldColumn(false)]
        [ImageWidthDescriptor(Width = AppSettings.MobileWidth)]
        public virtual Blob Mobile { get; set; }

        [Editable(false)]
        [ScaffoldColumn(false)]
        [ImageWidthDescriptor(Width = AppSettings.WideMobileWidth)]
        public virtual Blob WideMobile { get; set; }

        [Editable(false)]
        [ScaffoldColumn(false)]
        [ImageWidthDescriptor(Width = AppSettings.TabletWidth)]
        public virtual Blob Tablet { get; set; }
    }

It's accessed imagepath/Tablet, imagepath/Mobile, etc... EPi saves it as Blog and inside VPP.

If not, than you take on of the suggested packages.

#86732

May 29, 2014 9:51

Dejan Caric

Vote:

Thank you!

#86765

May 30, 2014 9:34