Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Saied 349 posts 674 karma points
    Jul 25, 2016 @ 12:37
    Saied
    0

    Process (scale, resize) images for different devices/resolutions being served from azure cdn?

    Hi,

    I store my images in different containers on azure (they are not all located in am images container, for example).

    When I retrieve an image, no matter what device I am on, it downloads the same image (size, etc).

    I looked into imgix.net as to process the images in real time, but I was wondering if there was an umbraco package that I could use that when an image was requested from azure, it would serve the appropriate image (size, resolution, etc) depending on if it was a 4K screen, 2K screen, phone, tablet, etc.

    If there is not an Umbraco package for this, are there services that others have had luck with?

    Thanks, Saied

  • David Peck 690 posts 1896 karma points c-trib
    Jul 26, 2016 @ 07:48
    David Peck
    0

    Slimsy? I've created my own version because we're mostly using background images. The I just need to check the size of the container and put ?width=123&height=456 as the querystring on the media item.

    Your point about the CDN though. If the CDN is setup to use blob storage as the source, then Umbraco doesn't get the chance to do the image resizing. It is better to use the website as the source. I wrote this last year.

  • Saied 349 posts 674 karma points
    Jul 26, 2016 @ 11:18
    Saied
    0

    Hi David,

    Would this work if my images weren't background images (I have some, but most are not). You can actually see them here http://stage.sctflash.com and http://stage.bullydog.com.

    All my images come from a CDN. I think one of the biggest issues I have is knowing what width and height to put on the query string depending on the device (phone, tablet, laptop, etc). Do you have any recommendations on this or does slimsy take care of this for you?

    Thanks for the help, Saied

  • David Peck 690 posts 1896 karma points c-trib
    Jul 27, 2016 @ 08:03
    David Peck
    0

    No Slimsy won't work for background images. The markdown obviously cocked up, on my previous message. I was saying that you can do your own version of Slimsy for background images. If you put a data-* attribute on your elements that need a background image, including the uncropped url, then using JQuery it is easy to flick through each of them. You then just need to get their height and width and put these in to the query string of the url.

    This other blog post of mine is on a slightly different topic, but the demo project does just this.

  • Andreas Kaltenhuber 107 posts 286 karma points
    Jul 26, 2016 @ 08:02
    Andreas Kaltenhuber
    0

    Have a look at this packages:

    UmbracoFileSystemProvider.Azure

    or

    Azure CDN Toolkit

    Andreas

  • Saied 349 posts 674 karma points
    Jul 26, 2016 @ 11:20
    Saied
    0

    Hi Andreas,

    Have you used any of these for the purposes I am talking about. All my images are stored on the CDN. I was looking at these packages before, but they seemed a bit complicated, so I wasn't too sure if I should take that path and if it would fit my needs.

    Thanks, Saied

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies