Forums (Obsolete)

Certified Developer v7

Gitesh - 11/28/2011 3:46:52 PM

Resize images in the transformation with get permanent links

Hi guys,

I have custom field (media Selection) in my document type.

The data in this custom field is mostly images. I am using the below code in the transformation to read this images:

<img src="<%# Eval("Image1") %>" />

Executed code for the image looks like this on the frontend:
<img src="/AucklandConventions/media/images/banner/Lower-1.jpg?width=638&height=310&ext=.jpg">

Is it possible to resize them in the Transformation? Example: resizing the image to width: 200px

I know this can be done with the permanent links, but I am not sure how to bring the permanent links in the transformation.

Your help is much appreciated.

Thanks
Gitesh Shah


Kentico Legend	Brenden Kehren - 11/28/2011 11:02:44 PM RE:Resize images in the transformation with get permanent links You could try a few built-in functions: <img src='<%# GetImageByUrl(GetFileUrl(Eval("Image1")), 663, 468) %>' /> or <img src='<%# GetFileUrl(Eval("Image1")) %>?width=663&height=468' />


Certified Developer v7	Gitesh - 11/29/2011 2:31:21 PM RE:Resize images in the transformation with get permanent links Hi, I tried both of your transformation but it gives me the below output: <img src="/getattachment/00000000-0000-0000-0000-000000000000/Room4.aspx?width=170&height=85"> Any ideas why is this happenning? Thanks Gitesh Shah

Certified Developer 8

Jiveabillion - 11/30/2011 11:30:24 AM

RE:Resize images in the transformation with get permanent links

if this code:

<%# Eval("Image1") %>

Gives you this:

/AucklandConventions/media/images/banner/Lower-1.jpg?width=638&height=310&ext=.jpg

Would that not mean that

"/AucklandConventions/media/images/banner/Lower-1.jpg?width=638&height=310&ext=.jpg"

is literally what is stored in that column of your document type?

If that is so, then :

GetFileUrl(Eval("Image1"))

Will not find the correct attachment and return the code:

<img src="/getattachment/00000000-0000-0000-0000-000000000000/Room4.aspx?width=170&height=85">

Where all those zeroes are where the Attachment GUID would be.

In order for the GetFileUrl method to work, you need to pass it the Attachment GUID, not the URL.

Also, since you are storing the URL, I don't know for certain, but I don't think that it is processed by the file handler the same way, so it doesn't resize.

You may need to change how your document type stores the value for "Image1"


Certified Developer v7	Gitesh - 11/30/2011 10:25:10 PM RE:Resize images in the transformation with get permanent links Hi, Is there a way to tell the document type column to store the guid instead of the URL? I can't change the Image field type now as I have already uplaoded more than 100 images. Cheers Gitesh Shah


Kentico Legend	Brenden Kehren - 12/1/2011 10:33:26 AM RE:Resize images in the transformation with get permanent links Check out the documentation on methods used in transformations here: http://devnet.kentico.com/docs/6_0/contexthelp/index.html?newedit_transformation_methods.htm This may help you a bit more

Certified Developer v7

Gitesh - 12/1/2011 2:28:13 PM

RE:Resize images in the transformation with get permanent links

Hi,

Thanks for the reply.

I tried almost all the method for the images.

Below method looks the nearest:

<%# GetImageByUrl(Eval("Image1"),200) %>

Output was the following:

<img alt="" src="/AucklandConventions/media/images/banner/Lower-1.jpg?ext=.jpg&width=50&height=50">

The code looks like it should resize it but for some reason it is not resizing.

Cheers
Gitesh Shah

Certified Developer v7

Gitesh - 12/1/2011 2:39:11 PM

RE:Resize images in the transformation with get permanent links

Gitesh wrote: Hi,

Thanks for the reply.

I tried almost all the method for the images.

Below method looks the nearest:
<%# GetImageByUrl(Eval("Image1"),50,50) %>
Output was the following:
<img alt="" src="/AucklandConventions/media/images/banner/Lower-1.jpg?ext=.jpg&width=50&height=50">
The code looks like it should resize it but for some reason it is not resizing.

Cheers
Gitesh Shah

Kentico Developer

kentico_ivanat - 12/5/2011 5:13:15 AM

RE:Resize images in the transformation with get permanent links

Hi,

where exactly are your images stored? Or how were they uploaded to the system?

In case they are uploaded to the content tree as cms.file documents you can make the URL work correctly storing custom path for example:

/Images/gallery_default.png?width=5

In properties of document cms.file, URLs tab you need to set Path type to Route and enable Use custom URL extensions, set the property to .jpg in your case. Alternative solution for allowing custom extensions is to configure extension-less configuration. This way the image is re-sized correctly.

The custom form control you created seems to be implementing the functionality which is already in the Kentico. Maybe to you should re-upload 100 images in order to avoid problems in the future and use one of standards controls.

Best regards,
Ivana Tomanickova

Certified Developer v7

Gitesh - 12/5/2011 7:38:53 PM

RE:Resize images in the transformation with get permanent links

HI,

I am storing the images in Media Library. I have created a field in the document type called Text > Media Selection.

I was just searching on the forum and it looks like this link could work:
http://devnet.kentico.com/Knowledge-Base/API-and-Internals/How-to-retrieve-an-image-from-the-KenticoCMS-datab.aspx

can anyone tell me where to enter this.

I tried it in the transformation and it gives me an error message.

I Tried the below code in the transformation:

<%#
Guid attachmentGuid = ValidationHelper.GetGuid(CMS.TreeEngine.TreeNode.GetValue("Image"), Guid.Empty);
string nodeAlias = ValidationHelper.GetString(CMS.TreeEngine.TreeNode.GetValue("NodeAlias"), "");
string fileUrl = ResolveUrl(AttachmentManager.GetAttachmentUrl(attachmentGuid, nodeAlias));
%>

Error Message:

[CMSDataProperties.LoadTransformation]: http://server/CMSTransformations/2999eced-ee8f-4c7d-a79e-604fa6a58e6c/asi/news/detail.ascx(26): error CS1026: ) expected

Kentico Developer

kentico_ivanat - 12/12/2011 5:00:02 AM

RE:Resize images in the transformation with get permanent links

Hi,

in this case you can check option Use permanent links in the Site Manager - Settings - Content - Media Library.

Then in a transformation you can Eval your Media selector field:

<%# Eval("yourField")%>

and using above information about GUID you should be able to create path like the following:
http://domain/getmedia/9b23712c-098c-462f-a843-45a14338dbf0/workflow.aspx?width=60&height=204

The query parameters will resize the image.

Best regards,
Ivana Tomanickova


Certified Developer v7	Gitesh - 12/12/2011 3:41:36 PM RE:Resize images in the transformation with get permanent links HI Ivana, Thanks for replying. I have checked that my setting is already ticked at :Site Manager - Settings - Content - Media Library - Use Permanent Links I remember that I ticked this option after uploading the images, could that be a reason? Thanks Gitesh Shah

Kentico Developer

kentico_ivanat - 12/14/2011 6:43:19 AM

RE:Resize images in the transformation with get permanent links

Hi,

yes it changes the format of links, but all of them should work:

This is permanent link which is stored in the field Text -> Media selector

~/getmedia/9b23712c-098c-462f-a843-45a14338dbf0/workflow.png.aspx?width=948&height=406&ext=.png

Its folder version alternative (version without checked setting - Use permanent links):

~/CorporateSite/media/VideoGallery/workflow.png?width=948&height=406&ext=.png

So now you have both this values in your database.

You can create a custom transformation method that will create a substring from the above expressions, i.e. removes ~ and the part behind question mark (included).

I mean you can call <%# MyCustomMethod(Eval("columnName")%>

Then you can add your parameters to the URL. Both path, permanent and folder version should work in the same time.

How to create a custom transformation method is described here:
Adding custom function to the transformation

Best regards,
Ivana Tomanickova

Certified Developer v7

Gitesh - 12/14/2011 2:40:36 PM

RE:Resize images in the transformation with get permanent links

Hi Ivana,

How can I check that there are permanent links in the database, because even after ticking the Permanent links option it is just giving me the below link:
~/CorporateSite/media/VideoGallery/workflow.png?width=948&height=406&ext=.png

I only want the permanent links , I don;t want the folder option.

Thanks
Gitesh Shah


Kentico Developer	kentico_ivanat - 12/15/2011 5:59:30 AM RE:Resize images in the transformation with get permanent links Hi, unfortunately, in this case you need to re-upload files. Then the path will be changed to permanent. Best regards, Ivana Tomanickova


Member	DahlinDev - 6/29/2012 1:29:24 PM RE:Resize images in the transformation with get permanent links Did you ever come up with a solution to resize images stored in the media library? If so can you please post for the rest of us?

Kentico Developer

kentico_ivanat - 7/1/2012 3:34:39 PM

RE:Resize images in the transformation with get permanent links

Hi,

which web part do you use to display media library files? Or which form control are you using to select media library file?

In general you can get media library url in transformation using:

GetMediaFileUrl(object fileGUID, object fileName)

Example:

<%# GetMediaFileUrl(Eval("FileGUID") ,Eval("FileName")) %>

The last step would be to add either maxSideSize, or width / height parameters to the url, e.g. by using

CMS.GlobalHelper.UrlHelper.AddParameterToUrl(string url, string parameterName, string parameterValue)

Best regards,
Ivana Tomanickova


Member	somemore144-yahoo - 8/5/2013 9:10:22 PM RE:Resize images in the transformation with get permanent links i am looking for codes that can resize images c# during transformtation.which permanent links should i use to use to resize to the width and height i need.


Member	kentico_sandroj - 8/5/2013 9:18:11 PM RE:Resize images in the transformation with get permanent links Hello, You can use any of the available methods which are listed in our documentation. There are also plenty of suggestions on this thread - have you tried any of them? If so, what happened? Regards, Sandro