« Zurück zu Image Gallery...

Image Gallery Thumbnails

Thumbnails are reduced-size versions of pictures, used to help in recognizing and organizing them, serving the same role for images as a normal text index does for words (source: http://en.wikipedia.org/wiki/Thumbnail).

Liferay's Image Gallery Portlet automatically creates thumbnails for images when they are upload. This article describes how the creation of this thumbnails can be configured and how thumbnails can be accessed programmatically.

Configuration #

This can be configured through portal.properties.

    # Set the maximum thumbnail height and width in pixels. Set dimension of the
    # custom images to 0 to disable creating a scaled image of that size.
    #
    ig.image.thumbnail.max.dimension=150
    #ig.image.custom1.max.dimension=100
    #ig.image.custom2.max.dimension=0

As seen above, ig.image.thumbnail.max.dimension defines the max dimension of the thumbnail. In addition, another 2 thumbnail with different custom sizes can be created: custom1 and custom2.

Accessing programmatically #

In order to use the thumbnails in jsp files, you should do the following:

IGImage image = ....;

Image largeImage = ImageLocalServiceUtil.getImage(image.getLargeImageId());
Image smallImage = ImageLocalServiceUtil.getImage(image.getSmallImageId());
Image custom1Image = ImageLocalServiceUtil.getImage(image.getCustom1ImageId());
Image custom2Image = ImageLocalServiceUtil.getImage(image.getCustom2ImageId())
0 Anhänge
51292 Angesehen
Durchschnitt (0 Stimmen)
Die durchschnittliche Bewertung ist 0.0 von max. 5 Sternen.
Kommentare
Antworten im Thread Autor Datum
Thanks for sharing..this is really greate! Now... Archi Madhu 6. Februar 2010 09:47
How can i call a custom generated thumbnail... Pablo Liz 24. Mai 2010 14:07
Can those images be called inside a Web Content... Peter Mesotten 25. August 2010 07:52
Yes, you can use same approach inside journal... wolfgang kubens 15. Oktober 2010 13:56
hi, thanks for this post, it really helped a... Tom I. 1. März 2011 14:30
SOLVED. The custom sized images are created... Tom I. 1. März 2011 15:12
Hi, I am facing one problem regarding... Nilesh Gundecha 22. November 2011 06:43

Thanks for sharing..this is really greate!
Now no need to worry about CSS classes and borwser compatibility issue for small image
also fast image loading if there are many images in same page!
Gepostet am 06.02.10 09:47.
How can i call a custom generated thumbnail from a .vm or .xsl template?
Gepostet am 24.05.10 14:07.
Can those images be called inside a Web Content Display as well?
Gepostet am 25.08.10 07:52.
Yes, you can use same approach inside journal templates also.

Structure:
1<root>
2  <dynamic-element name='headline' type='text' repeatable='false'></dynamic-element>
3  <dynamic-element name='image' type='image_gallery' repeatable='true'></dynamic-element>
4</root>


Journal Template:
 1#set ($ImageLocalService = $serviceLocator.findService("com.liferay.portlet.imagegallery.service.ImageLocal­ServiceUtil"))
 2#set ($IGImageLocalService = $serviceLocator.findService("com.liferay.portlet.imagegallery.service.IGImageLoc­alServiceUtil"))
 3
 4<h1>$headline.getData()</h1>
 5#foreach ($item in $image.getSiblings())
 6<p>
 7    #set ($url = $getterUtil.getString($item.getData()))
 8    #set ($uuid = $getterUtil.getString($httpUtil.getParameter($url, "uuid", false)))
 9    #set ($groupId = $getterUtil.getLong($httpUtil.getParameter($url, "groupId", false)))
10    #set ($imageObj = $IGImageLocalService.getImageByUuidAndGroupId($uuid, $groupId))
11    #set ($smallImageId = $imageObj.getSmallImageId())
12    #set ($thumbObj = $ImageLocalService.getImage($smallImageId))
13
14    <img src="/image/image_gallery?img_id=$smallImageId" width="$thumbObj.getWidth()" height="$thumbObj.getHeight()"/><br>
15</p>
16#end
Gepostet am 15.10.10 13:56 als Antwort auf Peter Mesotten.
hi, thanks for this post, it really helped a lot.

on the other hand, I couldn't get to use a custom sized image in a FreeMarker template in LR 6.0.5.
imageObj.getSmallImageId() works well, but imageObj.getCustom1ImageId() returns 0 (zero number) instead of the object. I have ig.image.custom1.max.dimension=210
in portal-ext.properties
do you have any ideas why it doesn't work?
thanks
Gepostet am 01.03.11 14:30 als Antwort auf wolfgang kubens.
SOLVED.

The custom sized images are created only at adding an image, so if you'd like to use custom size, you have to set it BEFORE you upload images to your gallery.
Gepostet am 01.03.11 15:12 als Antwort auf Tamas Imrei.
Hi,

I am facing one problem regarding Thumbnails in Image Gallery portlet. I am using liferay 6.0.6 version.

I have some jpg file stored in the server machine and want to save this image in Image Gallery portlet. For that I read that jpg file and get the File object and add in Image Gallery portlet using IGImageLocalServiceUtil.addImage(.....) method.

The image is getting stored there but thumbnail is not created. When I click on that ,it shows the image properly.

After analyzing little bit, I found that small Image is not being created. Just wondering why?

If anybody knows the answer ,please help me.

Thanks in advance.
Nilesh
Gepostet am 22.11.11 06:43 als Antwort auf Tamas Imrei.