image cropper moving from 625 to 73 - XSLT

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

Bent Holz 100 posts 273 karma points

Sep 30, 2015 @ 07:35

0

Image cropper - moving from 6.2.5 to 7.3

I am trying to recreate an old 6.2.5 site in 7.3

Have no experience with Razor/Mvc and have set up the installation with webforms.

Created my document types, created simple templates and made the "Hello world" work in the browser, yay!

Now I wan't to make a simple image slider for my frontpage using the built in image cropper.

After creating a crop size to the image cropper data type, I added it to my frontslide doc type, uploaded a few images and tried to test it.

My XSLT replaces the images if none is uploaded/can't find an image to display (see http://test.insane.dk). It outputs the node name etc., but no images.

If I look in the media archive on the server, the image cropper has not created images according to my image cropper settings.

Am I missing something here or is the 7.3 version of image cropper stashing the images somewhere else?

Copy Link
Chriztian Steinmeier 2800 posts 8790 karma points MVP 8x admin c-trib

Sep 30, 2015 @ 07:57

0

Hi Bent,

The Image Cropper in v7+ is pure magic compared to what's been available previously - it creates the images on the fly (and caches them somewhere smart).

To output a specific crop, you'll probably need to use some Razor code, as there's no built-in library extensions for use with XSLT (I know, not too happy about that either :( but that's how it is...)

You can get to the cropsettings through XSLT, but you'll be doing lots of calculations (as I have been forced to a couple of times, because of other factors), since they're JSON which is (apart from CDATA-wrapped WYSIWYG output) about the least usable format to work with in XSLT :-)

That said, Umbraco is using Imageprocessor behind the scenes, so you can get a long way by getting the original mediaNode (using GetMedia()) as usual and then throw some options on the QueryString to manually crops/size the images.

Hope that helps,

/Chriztian

Copy Link
Bent Holz 100 posts 273 karma points

Sep 30, 2015 @ 08:59

1

Hi Chriztian

As always, thank you for the reply. They should put a bust of guys like you up at Umbraco Headquarters!

"Arg!..." to say the least... Being the non-programmer that I am can I some how use Razor/new image cropper with my webforms site?

/Bent

Copy Link
Chriztian Steinmeier 2800 posts 8790 karma points MVP 8x admin c-trib

Sep 30, 2015 @ 09:08

1

Haha - I like that idea :-)

Actually, I don't see why you shouldn't be able to create a Razor Macro, and use that in you Webforms masterpage...

Give it a try, and come back here if it explodes :)

/Chriztian

Copy Link
Bent Holz 100 posts 273 karma points

Sep 30, 2015 @ 09:37

0

Sigh!... Looks like I have to go learn something about Razor...

Gonna "google" my way around and see if theres a "Razor for dummies" page somewhere...

...and I will be back I'm sure!

/Bent

Copy Link
Janae Cram 63 posts 439 karma points MVP 8x c-trib

Sep 30, 2015 @ 15:56
1
Hi Bent,

Like Chriztian said, you can always append the URL of the media item in XSLT for ImageProcessor :)

If you click on any of the methods listed in the sidebar here (I assume 'crop' is the one you'll be going for), they tell you the querystring parameters you'll need to append to your image: http://imageprocessor.org/imageprocessor-web/imageprocessingmodule/

Alternately, if I were coding it in a "display the image" Razor Macro (I prefer to use the MVC Razor macros), my code would probably look like this:
```
@inherits Umbraco.Web.Macros.PartialViewMacroPage

@if (Model.Content.HasProperty("image") && Model.Content.HasValue("image"))
{
    var image = Umbraco.TypedMedia(Model.Content.GetPropertyValue("image"));

    if (image != null)
    {
        <img src="@image.GetCropUrl(width: 100, height: 100)" alt="@image.Name" />
    }
}
```
Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?

Image cropper - moving from 6.2.5 to 7.3