Wednesday 8 January 2014

Dynamic Customization in Theme via Theme Settings

Liferay provides rapid development feature for its theme.
Many time we may need some part of theme on need bases, timely changeable features.
For Example, say back ground images of portal should be customizable/changeable
on run-time. or you need customized/changeable menu on run-time.
 
This is achievable by theme settings in liferay-hook.xml of developed theme. 
 <?xml version="1.0"?>  
 <!DOCTYPE look-and-feel PUBLIC "-//Liferay//DTD Look and Feel 6.1.0//EN"  
 "http://www.liferay.com/dtd/liferay-look-and-feel_6_1_0.dtd">  
 <look-and-feel>  
      <compatibility>  
           <version>6.1.0+</version>  
      </compatibility>  
      <theme id="example" name="Example">  
            <settings>  
           <setting key="image" type="text" configurable="true" value="image.png" />  
                <setting key="navigation-menu" type="select" configurable="true" value="mega-menu" options="mega-menu,default-menu,custom"/>  
      </settings>  
      </theme>  
 </look-and-feel>  
 
Above setting attributes will be available in interface so you can set it anytime.
Now, in your theme's vm file, you may want to have custom view based on these settings.
You would require to check values of these settings, below is the code snippet to fetch those 
setting.
 #set ($theme_settings = $themeDisplay.getThemeSettings())  
 $theme_settings.getProperty('Image')   
 $theme_settings.getProperty('navigation-menu')   
You can have if else conditions based on value of settings to customize your view.
Hope this would help you. 
Regards, 
 
 

Tuesday 7 January 2014

Application Display Templates - One of the New Features in Liferay 6.2


                       Liferay comes with many collaboration functionality related portlets like Asset Publisher, Blogs, Wiki, Media Gallery.

                      Many  times client has requirement which differs in terms of look and feel from this OOB portlets, to achieve such requirement the only way before Liferay 6.2 was to create jsp hook and do modification to jsp files. But this doesnt required any more if your requirement is not so complex.

                      Liferay 6.2, comes with concept "Application Display Templates",  WithApplication Display Templates, you can define custom display templates used to render asset-centric applications.

Liferay comes with 7 Application Display Templates as shown in image below.

 Each of Edit Screen for Application Display Template contains respective variables to use in Editor.

For Example: Asset Entries/ Blog Entries / Pages / Tags / Documents are available as entries variable in respective templates

           
Lets understand it by example:
Say you want to display list of Asset Entries in Asset Publisher with just title and date[with format dd MM yyyy].

To achieve this create on Asset Publisher Template, with script as below.
 #if (!$entries.isEmpty())  
   #foreach ($curEntry in $entries)  
     <a href='$assetPublisherHelper.getAssetViewURL($renderRequest, $renderResponse, $curEntry)'>$curEntry.getTitle($locale)</a>  
     $dateTool.format("dd MMM yyyy",  
  $dateTool.toDate("EEE, dd MMM yyyy hh:mm:ss Z", $curEntry.getPublishDate()), $locale)  
     <br/>  
     #end  


       
And then in Asset Publisher's Configuration Display Setting >  Display Template, select your created Asset Publisher Template and save configurations.
Similarly, you can set Display Template for portlets like Blogs, Wiki, Tags navigation, Categories navigation, SiteMap, Media Gallery etc.

By this you will see list of assets with Published date in particular format.

Thus, you can customize view of Asset Publisher portlet.

Similarly, you can also customize view for Blogs portlet, Tags navigation, Site Map, Categories Navigation, Media Gallery.

You will find default Carousel Display Template for Media Gallery in Liferay 6.2 version.

Cheers!