tag:blogger.com,1999:blog-54313297189595587842024-03-28T20:29:42.324-07:00It's all about Java and LiferayAnonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.comBlogger12125tag:blogger.com,1999:blog-5431329718959558784.post-66941734983058548242013-07-16T03:36:00.000-07:002014-09-11T09:56:18.482-07:00Create WebContent and Integrate Flow Player to Play Videos in Liferay<div dir="ltr" style="text-align: left;" trbidi="on">
Most of the times we have a requirement from the client to show videos on the home page for marketing purpose or to promote the brands. At that time I looked into the internet for so many different players but I found the Flow Player as the Most efficient and easy to integrate it.<br />
<br />
<b><span style="font-size: small;"><span style="font-family: 'Trebuchet MS', sans-serif;">Note:- Download source code at the end of this blog.</span></span></b> <br />
<br />
Below are some of the <b>Features of Flow Player</b> which make him so much popular:-<br />
<ul style="text-align: left;">
<li><b>Basic Features</b> </li>
</ul>
<div>
<ul style="text-align: left;"><ul style="text-align: left;">
<li> Play/Pause Controls</li>
<li> FullScreen</li>
<li> Playlist<b> </b></li>
</ul>
</ul>
<ul style="text-align: left;">
<li><b>Advance Features</b></li>
</ul>
<ul style="text-align: left;"><ul>
<li> Common Clipping ( for eg. :- you can set the duration for all the files in the playlist to play for only 5 seconds )</li>
<li> Clipping ( for eg. :- you can set the duration for each and every individual file in the playlist)</li>
<li> Advertising ( You can integrate Advertising in the Flowplayer same as you see in the youtube )</li>
<li> Streaming ( Online streaming from live server )</li>
</ul>
</ul>
There are so many different video formats are available on Internet. Some Particular format of Video required respective company's Player but some other formats are open and other players can play them.<br />
<br />
As FlowPlayer runs on Flash Video Object, so it can virtually handle all format which are supported by flash.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLkF7aJFHiqcyrvMETfAKHt0MqlaDH_eho6Lh6SC93KsLXJ3194Gmx67PPHtTo-QyprI5YOc7aPV9cm5esxFZ2hLQo64KaQE6cjgsxq0fmly-Pwj4mb0ABebDOfEI8X6UXDw9vyZnDc8Ck/s1600/supported-format-video.PNG" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="224" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLkF7aJFHiqcyrvMETfAKHt0MqlaDH_eho6Lh6SC93KsLXJ3194Gmx67PPHtTo-QyprI5YOc7aPV9cm5esxFZ2hLQo64KaQE6cjgsxq0fmly-Pwj4mb0ABebDOfEI8X6UXDw9vyZnDc8Ck/s640/supported-format-video.PNG" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Supported Video Format</td></tr>
</tbody></table>
<br />
Here I am going to show you the small demo about how to integrate Flow Player in Liferay and play videos with the help of it.<br />
<br />
List of the necessary files required in order to integrate Flow Player with Liferay are as below:-<br />
<br />
<b>jquery1.8.js</b> - Javascript file required for the Flow Player.<br />
<b>flowplayer-3.2.12.min.js</b> - Javascript file required for the Flow Player.<br />
<b>flowplayer.ipad-3.2.12.min.js</b> - Optional Javascript file required for the Flow Player to make Ipad Compatible.<br />
<b>flowplayer-3.2.16.swf</b> - Flash File required in order to play Video or Audio.<br />
<b>flowplayer.controls-3.2.15.swf</b> - Flash File which contains Controls of Flow Player like Volume Control, Slider, Play/Pause etc.<br />
<br />
We can integrate the Flow player in two ways either we can use Web Content(Structure/template) or directly integrate in the Liferay Portlet.<br />
<br />
Here we are going to see Flow Player integration with Web Content(Structure / Template)<br />
<b><br /></b>
<b>There are three ways to include the Javascript and Flash file :-</b><br />
<br />
<b>1) If you have developed a theme for your site then put the Javascript and Flash files in theme and then include in Velocity(Template).</b><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ZSNQXVNtBm7gV8jZFN5bMAzjML1oui_nO2zTJm3UIF45y6fCLPwsE0KMIONsQ3TuA5VfeQcGJVKJ35ZKoDExTQqLqY9PlZae8tXvVnWOuUaRbF_dESu0XTadilh4ihMRkQKY0FJN2H71/s1600/a.PNG" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ZSNQXVNtBm7gV8jZFN5bMAzjML1oui_nO2zTJm3UIF45y6fCLPwsE0KMIONsQ3TuA5VfeQcGJVKJ35ZKoDExTQqLqY9PlZae8tXvVnWOuUaRbF_dESu0XTadilh4ihMRkQKY0FJN2H71/s400/a.PNG" width="331" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">1. Folder Structure in theme</td></tr>
</tbody></table>
<br />
<b>2) Put the JavaScript and Flash Files in the Document and Media.</b><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK7onioEnvLyXNKlDI8uBmSAud4cpc6aVZSNxG3VMeITqsY5X_PJdBl1Z_wlRKNW-gEyr9lsZiE4uL5907cr98OBJqsG8i-ktOnsa7qLV3ijhmaNQHhl-yII6ejQYZ7v1LCrsAdO82eX5X/s1600/b.PNG" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="255" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK7onioEnvLyXNKlDI8uBmSAud4cpc6aVZSNxG3VMeITqsY5X_PJdBl1Z_wlRKNW-gEyr9lsZiE4uL5907cr98OBJqsG8i-ktOnsa7qLV3ijhmaNQHhl-yII6ejQYZ7v1LCrsAdO82eX5X/s400/b.PNG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">2. Files in Document and Media</td></tr>
</tbody></table>
<br />
<b>3) Most appropriate way, put the Javascript files in the Theme and Flash Files in Document and Media.</b><br />
<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIyJpy_V7WXlRRkymXjnMQfwPfTBDxddl4QO0hBT8FqsZTCfvnnInqhQZVGzg3lLkXkvcPNfLl1av6BuxkMAVncK5VSL7wOYqLdGayf3-28w13t97BxDieiYCCjbXz7MNAKSAHz3yuzBbi/s1600/a1.PNG" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIyJpy_V7WXlRRkymXjnMQfwPfTBDxddl4QO0hBT8FqsZTCfvnnInqhQZVGzg3lLkXkvcPNfLl1av6BuxkMAVncK5VSL7wOYqLdGayf3-28w13t97BxDieiYCCjbXz7MNAKSAHz3yuzBbi/s200/a1.PNG" width="198" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">3.1 Files and Folder in Theme</td></tr>
</tbody></table>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje95DS27dNP1D8wIAdWVV__BY2PDG20UDNMTkEgLfUdnsQ_uizyVMZmw0yzLp1nVNVeVeGyg_Rxl2m_AXLdUGwQJS59iUMO7z2rFHMTJBbuhCIKazXGPOpTAVLG9OQhcRcHIjE79WJRQt9/s1600/b1.png" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="212" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje95DS27dNP1D8wIAdWVV__BY2PDG20UDNMTkEgLfUdnsQ_uizyVMZmw0yzLp1nVNVeVeGyg_Rxl2m_AXLdUGwQJS59iUMO7z2rFHMTJBbuhCIKazXGPOpTAVLG9OQhcRcHIjE79WJRQt9/s320/b1.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">3.2 Files in Document and Media</td></tr>
</tbody></table>
<br />
<br />
<br />
<br />
<br />
<div class="" style="clear: both; text-align: left;">
<b>Here we are using the third approach.</b><br />
<br />
After configuring the files, now we will start with creating the web-content.<br />
<br />
Web Content is Divided in three Parts as below :-</div><br />
<div class="" style="clear: both; text-align: left;">
<b>1) </b>Creating Structure<b>. 2) </b>Creating Template.<b> 3) </b>Creating Content.<br /><br />
</div>
<div class="" style="clear: both; text-align: left;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpqU6-SeywSUfBy2vWTGVnzlkqlj2IIoTciecM6EbzOMOnBeYKVf01lJTIfGxvSnJ2awZ7R_sxF6h8FGlrV2uQ8ZfVsC4o0e_LvGc8zfleliCsSIJSQtyK5JbQ98k1OQCUXM09ZeMxreoc/s1600/webcontent.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpqU6-SeywSUfBy2vWTGVnzlkqlj2IIoTciecM6EbzOMOnBeYKVf01lJTIfGxvSnJ2awZ7R_sxF6h8FGlrV2uQ8ZfVsC4o0e_LvGc8zfleliCsSIJSQtyK5JbQ98k1OQCUXM09ZeMxreoc/s400/webcontent.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4. Liferay 6.1 Web Content</td></tr>
</tbody></table>
<br />
<div class="" style="clear: both; text-align: left;">
<b>1) Creating Structure</b></div><br />
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir2ysC_EXXyduFLqJLKvYNADvr7d6UFMYxn99N1BrYmWVknINkBu4IVyS1uNLo4JFclNHhSbEECdhKBzUQuAEOxr2sz1P0RH_TButBXBnfboCVHmafRVNPsr41cLPx4T-np3LyOJeZxkIL/s1600/structurer1.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="195" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir2ysC_EXXyduFLqJLKvYNADvr7d6UFMYxn99N1BrYmWVknINkBu4IVyS1uNLo4JFclNHhSbEECdhKBzUQuAEOxr2sz1P0RH_TButBXBnfboCVHmafRVNPsr41cLPx4T-np3LyOJeZxkIL/s400/structurer1.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.1 Creating Structure</td><td class="tr-caption" style="text-align: center;"><br /></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: left;">
After Clicking on the Add Structure button the below screen appears.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfAa6MJ9cxryoOg16Odxv1zrisY4aI6qE9KzlBCUGSVc-zw72VREYh3lVbPmPshEL_VDiB19t_zNiva2nx22NccZ3vFxr4uUBUpOhWXtL2t0Dj-7M7Js8PbT_76WEmnbTUTQPK_cn4CwsC/s1600/structure2.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="182" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfAa6MJ9cxryoOg16Odxv1zrisY4aI6qE9KzlBCUGSVc-zw72VREYh3lVbPmPshEL_VDiB19t_zNiva2nx22NccZ3vFxr4uUBUpOhWXtL2t0Dj-7M7Js8PbT_76WEmnbTUTQPK_cn4CwsC/s400/structure2.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.1.1 Structure GUI </td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Name </b>and <b>Description </b>are the fields in order to name the Structure and also give appropriate description for that structure.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
After Scrolling Down you will find XML Schema Definition section. Click on the Add Row button and go on adding as per below screenshot.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp0hrRMU9YzG0euphEBHUUXOP2eSV6hww40BUfH-SoOYxqZPVp8RtAoWeMRXSaJ1G065g6KDc7roNsTpie-zRmPScdnSXhIicu77__YWnzP8gfR51-NbalQtE3FD6_5ys0HKRuoY7LDoA6/s1600/structure3.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="209" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp0hrRMU9YzG0euphEBHUUXOP2eSV6hww40BUfH-SoOYxqZPVp8RtAoWeMRXSaJ1G065g6KDc7roNsTpie-zRmPScdnSXhIicu77__YWnzP8gfR51-NbalQtE3FD6_5ys0HKRuoY7LDoA6/s640/structure3.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.1.2 Structure XML Schema GUI </td></tr>
</tbody></table>
We have added three fields in XML Schema as per above screenshot.<br />
<br />
<b>VideoFile </b>- Type as <b>Text-Field </b>(It will contain the path of the Video like Flv or mp4 file path).<br />
<b>SWFPlayer </b>- Type as <b>Document and Media</b> ( It will have the flowplayer-3.2.16.swf file from the Document and Media).<br />
<b>SWFPlayerControl </b>- Type as <b>Document and Media</b> ( It will have the flowplayer.controls-3.2.15.swf file from the Document and Media).<br />
<br />
Now we are done with our Structure part.<br />
<br />
<b>2) Creating Template</b><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixzAVe0-xP_uDG-gQP6uqHAWEDrWbFR04FCiWrhbJDDhkpofvxi9UDS_Wk09fN5YcY4jn_PyQ7whI-UOIYMDpUOTbF4qBdIn33rmck5CJcFafZOiOm9IoOIhyphenhyphenj6ymywx0buMDY_gpL6MFg/s1600/template1.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="187" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixzAVe0-xP_uDG-gQP6uqHAWEDrWbFR04FCiWrhbJDDhkpofvxi9UDS_Wk09fN5YcY4jn_PyQ7whI-UOIYMDpUOTbF4qBdIn33rmck5CJcFafZOiOm9IoOIhyphenhyphenj6ymywx0buMDY_gpL6MFg/s400/template1.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.2 Lifeay 6.2 Creating Template</td></tr>
</tbody></table>
After clicking on the Add Template button the below screen appears.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYcHx64H7BRbSZCPUYmOsq-AFusavmOg_cABC6G4KTBCdSpHt2EVx1OxsHy541N3zr2znrRusBVP_Bd8JTIZkOqdEHTTRRGQD5SIrnECdedvtMx1xkUF82a6G_2aWkEu9LO9FgeJdZoQzi/s1600/template2.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="245" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYcHx64H7BRbSZCPUYmOsq-AFusavmOg_cABC6G4KTBCdSpHt2EVx1OxsHy541N3zr2znrRusBVP_Bd8JTIZkOqdEHTTRRGQD5SIrnECdedvtMx1xkUF82a6G_2aWkEu9LO9FgeJdZoQzi/s400/template2.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.2.1 Template GUI </td></tr>
</tbody></table>
<b>Name </b>and <b>Description </b>are the fields in order to name the Template and also give appropriate description for that Template.<br />
<b>Cacheable </b>is for caching the content.<br />
<b>Structure Selection</b> is for selecting the structure that we have created<br />
<b>Language Type</b> is for writting the Template code in different languages (VM,CSS,FTL,XSL)<br />
<b>Launch Editor </b>will open the Screen in which you will be able to write the Template Code.<br />
<br />
As you see in screenshot, the Editor with Default Code. Remove that Default Code and add below code in your editor.<br />
<br />
<script src="https://gist.github.com/amitccet/5892591.js"></script>
Click on update button of Editor and now Save the Template.<br />
<br />
<b>Explanation of Template Code</b><br />
<ul style="text-align: left;">
<li><b>$image-path</b> will find the image path from theme.</li>
<li>2nd and 3rd line is for importing the javascript file that we need to
include in Flow Player. But one important thing is that as our
Javascript File is in the JS Folder so we moved upto JavaScript Path
from ImagePath accordingly.</li>
<li>Now we have defined link with id as player and href is the location
where we will get video file path from the Web-Content Dynamically. </li>
<li>As we have written Flow Player configuration in ready function of the
JavaScript. So When the page will be loaded and it will be ready then
Javascript ready function will get called. In that our Flow Player
function will be called.</li>
<li>First parameter in the flow player function is the id of the anchor where we want to place the flow player.</li>
<li>Second parameter in the flow player function is the parameter that contains the Main SWF File Path.</li>
<li>Third Parameter is the Plugins of the Flow Player. Here we used Play/Pause, Slider that contains inside the Plugins swf.</li>
<li>We can add more parameter if we want in the Flow Player functions.</li>
</ul>
<b>3) Creating Web-Content</b> <br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxhsBCvdUGRBvwbk7ywHMKbBIhRQmfzi81ZzkIRqrJhgY_cvOk169ohMoBp8BNoXWTKyHQVt5c5XBWuianRH0PDVVgVFk63O0qvrjZcL-gR4ML1uMpQBNgqVMVTFbZ-BUamiLB3y1HTQVL/s1600/webcontent1.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="261" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxhsBCvdUGRBvwbk7ywHMKbBIhRQmfzi81ZzkIRqrJhgY_cvOk169ohMoBp8BNoXWTKyHQVt5c5XBWuianRH0PDVVgVFk63O0qvrjZcL-gR4ML1uMpQBNgqVMVTFbZ-BUamiLB3y1HTQVL/s400/webcontent1.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.3 Create Web Content</td></tr>
</tbody></table>
<span id="goog_1469782833"></span><span id="goog_1469782834"></span><span id="goog_1374393982"></span><span id="goog_1374393983"></span><br />
There are two option either Basic Web Content or Flow Player :-<br />
<br />
If you select Basic Web Content then you have to manually select Structure and Template for that web content.<br />
But if you select FlowPlayer then it will automatically select Structure and Template of Flow Player.<br />
<br />
After Clicking on it below screen appears.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCygLMxVFl5OrcowPqOW10CVIK3BrQP_tu006AiAIcXqMekGF7KVyGD0e7aCLVUhO6NijeUWPlr1QepsNhOEaSVYS0aGT2c3cGTxHro-NHSC_gaBP2YeAr8EpbX2ndeKdfA9podTthpPlQ/s1600/webcontent2.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="378" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCygLMxVFl5OrcowPqOW10CVIK3BrQP_tu006AiAIcXqMekGF7KVyGD0e7aCLVUhO6NijeUWPlr1QepsNhOEaSVYS0aGT2c3cGTxHro-NHSC_gaBP2YeAr8EpbX2ndeKdfA9podTthpPlQ/s640/webcontent2.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">4.3.1 GUI of Web Content</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmzQThw5_QeVKBmSxq5Uj0yU-Ti55MM9DTI13_kDKLY3pGN3tVODeCY1LgM3PHJCkhHF8wgLxAZzCFnwysWqtl3B1DPZLbBj4wIfr3tysVuBjPYpbnuKumN_t01B87IBLhkwKEwvIw3Qrm/s1600/webcontent2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br /></a></div>
<b>Title </b>- Will be appropriate title for the Web Content<br />
<b>Video file</b> - It is the parameter that we defined in the Structure. Add the appropriate path of the Video File<br />
<b>SWF Player</b> & <b>SWF Control File</b> that we need to select it from the Document and Media as we have specified in Structure.<br />
<br />
After selecting the <b>SWFPlayer </b>and <b>SWFPlayer Control </b>appropriate SWF's. Click on the <b>Publish </b>Button.<br />
<br />
Your Web Content is Created.<br />
<br />
Now go any page in the site with Site Administrator or Administrator as a Role in liferay.<br />
You will see the ADD Button on the DockBar.<br />
Click on the ADD Button and select Web Content Display Portlet. It will appear in the page.<br />
From the Web Content Display Portlet select Flow Player. It will appear as below :-<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgX7a-SFgdxaqT3NOM_MMIp-DtI8EqsmSi0vCrzumcOm5xaXovSzOaLbrsihqJV6cXrAuwNLLNgD5RKQ2beNo0_OotTd9ljuDu-9tS8eZkNh_6Wm9ksxhLtTK51Oo_NfOSEOHknp2b-TLS/s1600/webcontent4.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="387" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgX7a-SFgdxaqT3NOM_MMIp-DtI8EqsmSi0vCrzumcOm5xaXovSzOaLbrsihqJV6cXrAuwNLLNgD5RKQ2beNo0_OotTd9ljuDu-9tS8eZkNh_6Wm9ksxhLtTK51Oo_NfOSEOHknp2b-TLS/s640/webcontent4.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Flow Player integrated with Web Content</td></tr>
</tbody></table>
<br />
<br />
Congrats !! Now your job is done.<br />
<br />
Download complete source code from <a href="https://github.com/amitccet/FlowPlayer-with-liferay" target="_blank">here</a>. <br />
<br />
Hope it will be useful.</div>
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com35tag:blogger.com,1999:blog-5431329718959558784.post-3065077806228620112013-07-02T23:34:00.000-07:002014-09-11T09:56:18.435-07:00New Features in Liferay Portal v6.2<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: left;">
With every new version of Liferay, it is becoming more robust and easy to use. As I am the member of <a href="http://www.liferay.com/community/verifier" target="_blank">Liferay 6.2 Comunnity Verifier Group</a>, So I am quite excited to explore its features.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
Here I am going to list down some of the new features that you are going to see in <a href="http://www.liferay.com/community/forums/-/message_boards/view_message/22178855" target="_blank">Liferay 6.2 CE</a>.<br />
<br />
<h3 style="text-align: left;">
<b>UI Refinements</b></h3>
<br />
In the Liferay 6.2 CE Version you will see all the things are very much organized or Categorize form then the previous version.<b> </b><br />
<ul style="text-align: left;">
<li><b>Look & Feel</b> :- When I downloaded the latest tomcat bundle of liferay 6.2 CE, the first thing I noticed is there is a change in the Default Liferay theme. Liferay is now upgraded to Alloy 2.0.</li>
</ul>
<div style="text-align: left;">
</div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td class="tr-caption" style="text-align: center;"><b><span style="font-size: xx-small;">Liferay 6.1 Theme</span></b></td></tr>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib-zW_jQw7GQwAA9Cg1vVHk8R-hZyVuVEmpU5xCh0mkk3gU9sT5u4AppyVqi7Gp10J5kEqvTQV6AKVq3ZZ9vMNqrAtevWkR5dtLG5nl9mzIgAqPQ3EVTXRwHE-v-6Wx2O4ov003qQp2D4x/s702/theme.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="324" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib-zW_jQw7GQwAA9Cg1vVHk8R-hZyVuVEmpU5xCh0mkk3gU9sT5u4AppyVqi7Gp10J5kEqvTQV6AKVq3ZZ9vMNqrAtevWkR5dtLG5nl9mzIgAqPQ3EVTXRwHE-v-6Wx2O4ov003qQp2D4x/s640/theme.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><b><span style="font-size: xx-small;">Liferay 6.2 Theme</span></b></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<ul style="text-align: left;">
<li> <b>Dockbar </b>:- The Second thing that come into focus is the Dockbar. In Liferay 6.2 they have made it more Categorize form. They have Categorize <b>Admin(Control Panel)</b> and <b>MySites</b> which all comes together in <b>GOTO</b> Section in liferay 6.1 version.</li>
</ul>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td class="tr-caption" style="text-align: center;"><b><span style="font-size: xx-small;">Liferay 6.1 Dockbar</span></b></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td></tr>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhytlAL_2wH6AiZJm5Zv2R3Ca0j9y5SjBf82CIdq3QRkfv7lKrQ4kdT187g3Nv_k4MaZZTD8S7rD2N5XF8v0QMlndzlBxe7n_AmYHCSb1_09eBaLygA7b1qwe0NXD5pPg21tTt-UYUj5eE1/s714/dockbar.PNG" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhytlAL_2wH6AiZJm5Zv2R3Ca0j9y5SjBf82CIdq3QRkfv7lKrQ4kdT187g3Nv_k4MaZZTD8S7rD2N5XF8v0QMlndzlBxe7n_AmYHCSb1_09eBaLygA7b1qwe0NXD5pPg21tTt-UYUj5eE1/s640/dockbar.PNG" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><b><span style="font-size: xx-small;">Liferay 6.2 Dockbar</span></b></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td><td class="tr-caption" style="text-align: center;"></td></tr>
</tbody></table>
<div style="text-align: center;">
</div>
<div style="text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<ul style="text-align: left;">
</ul>
<b> </b><b> </b><br />
<ul style="text-align: left;">
<li><b>Control Panel</b> :- There was a Major Change in the Control Panel Section. It was divided into Four Sections</li>
</ul>
<ul style="text-align: left;">
</ul>
<ul style="text-align: left;"><ul>
<li><b>Users </b>- It contains User, UserGroup, Password Policies, Roles, Organization etc in this section.</li>
<li><b>Sites</b> - It contains Sites,Sites Template,Page Template,Blogs,Wiki, Document and Media etc in this section.</li>
<li><b>Apps </b>- It contains Market Place,Plugins Configuration, Plugins Installation etc in this section.</li>
<li><b>Configuration </b>- It contains Portal Settings,Custom Fields,Server Administration and Portal Instances in this section. </li>
</ul>
</ul>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="height: 426px; margin-left: auto; margin-right: auto; text-align: center; width: 571px;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiln9K6cWYAabdvFzW7_97yjYZKhde4iFnWIBY1mr9TdoBY6QyB4l0oDn9MsIUHFh_6DD6vqg7oc6Ks20SYLTkuaxXWKY0nIwlQuOoSyI-ZicTROjRWlbapT4Rms_6GBV9nBdpuE9-73dIR/s917/controlpanel.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Control Panel" border="0" height="394" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiln9K6cWYAabdvFzW7_97yjYZKhde4iFnWIBY1mr9TdoBY6QyB4l0oDn9MsIUHFh_6DD6vqg7oc6Ks20SYLTkuaxXWKY0nIwlQuOoSyI-ZicTROjRWlbapT4Rms_6GBV9nBdpuE9-73dIR/s640/controlpanel.png" title="Control panel" width="600" /></a></td></tr>
<tr align="left"><td class="tr-caption"><span style="font-size: xx-small;"> <b> Liferay 6.1 Control Panel </b> <b>Liferay 6.2 Control Panel</b></span></td></tr>
</tbody></table>
<br />
<h3 class="separator" style="clear: both; text-align: left;">
<b>Sites</b></h3>
<br />
<div class="separator" style="clear: both; text-align: left;">
There are couple of changes and also new portlets are added at site level.</div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<ul style="text-align: left;">
<li><b>Recycle Bin</b> :- The name itself speaks a lot. You all knows what the Recycle Bin do in Windows or Trash in Mac. The same feature liferay has implemented here.<br /><br />In Previous versions of liferay if a user accidentally deletes a document from the Documents and Media portlet, the user has no way to easily restore the document.After this feature is implemented, as an end user, you can easily restore your deleted files by going to the recycle bin to restore files that have been deleted lately. It also provides automatically clean up the Recycle Bin if the file entry is older than one month. </li>
</ul>
<br />
<div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9R8891clSjHQ_nGRKUqQ4tIHmShyphenhyphenLz60K21X_2svJN2e7f0DGjqJ-uIQinDetd9y1XlccwetNT_t50NF68FQmHsNHsC_mzJN6d08zBQOCboxHf2CzQDfgFAdOqkuYGkOcziF2Y7Px-YCw/s700/recyclebin.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="306" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9R8891clSjHQ_nGRKUqQ4tIHmShyphenhyphenLz60K21X_2svJN2e7f0DGjqJ-uIQinDetd9y1XlccwetNT_t50NF68FQmHsNHsC_mzJN6d08zBQOCboxHf2CzQDfgFAdOqkuYGkOcziF2Y7Px-YCw/s640/recyclebin.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: xx-small;"><b>Liferay 6.2 Recycle Bin Portlet</b></span></td></tr>
</tbody></table>
<br />
<ul style="text-align: left;">
<li><b>Web Content Management</b> :- You can now organize Web Content in Folders and Sub-Folders in the same way as Document and Media.</li>
</ul>
<br />
<div style="text-align: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfGCriYnFNQxCbCr67Z1t_gl9DSm3WQorRn-8Tulwi2aQrif7-Qq-FENsrKCwNngu_55ajHgF3QOmHFGd-8Kmwj2nwfufJDI6N9ZZSTGowey8V7HhzsHDnLLgS7j6e6HZW31q5_V_mLRsV/s654/webcontent.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="312" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfGCriYnFNQxCbCr67Z1t_gl9DSm3WQorRn-8Tulwi2aQrif7-Qq-FENsrKCwNngu_55ajHgF3QOmHFGd-8Kmwj2nwfufJDI6N9ZZSTGowey8V7HhzsHDnLLgS7j6e6HZW31q5_V_mLRsV/s640/webcontent.png" width="640" /></a></div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: xx-small;"><b>Liferay 6.2 WCM</b></span></td></tr>
</tbody></table>
<br />
<ul style="text-align: left;">
<li><b>New Template Script Editor with Auto complete </b>:- Good to have this. It was hectic to write scripts in previous versions. It will make life easier.</li>
</ul>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ6S717OBRT6ap7yMO5-RdF8cSfdOsuKlkFwi5g3-n4Uy44aHJjFLzqpCJaB6GlsaFuNruANqgvZvP3GN8CMK5HfsHfxLhGpSvlJd3BiSH8cBiJS2L8FdMQb1TlGcUmLHxzbzEQQ-SQLTG/s700/template.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="436" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ6S717OBRT6ap7yMO5-RdF8cSfdOsuKlkFwi5g3-n4Uy44aHJjFLzqpCJaB6GlsaFuNruANqgvZvP3GN8CMK5HfsHfxLhGpSvlJd3BiSH8cBiJS2L8FdMQb1TlGcUmLHxzbzEQQ-SQLTG/s640/template.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: xx-small;"><b>Liferay 6.2 Script Editor</b></span></td></tr>
</tbody></table>
<br />
<ul style="text-align: left;">
<li><b>Application Display Templates :- </b>We can make our own Custom templates for Wiki, Blogs, Asset Publisher etc. </li>
</ul>
<br />
<div>
<div>
<div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxJDj8y7_DbpX65PhWDr3bfNnP3-LIxif33dD6dna6-j7auZDRJS0f7oIuqqJRRKE0TIwJxm3P6DYKFpQ6481dMEfPwh8FXMLdtehP7-XvoHOGp-UF4HvDvmoGkZzDgURx5_yZ0gaPkQXO/s974/controlpanel.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-left: 1em;" width="620"></a><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4ERuQ8cT-EkuyGVUEyIDzWTe2vmNeYxoEyFTva95gtb2bLfFCZHb8yESKKQBjBgNmDME6xqLQhVdT1KCi9f6VQygKwQRTblJZ8U7FQhkP2UgjIchnbOjCmKhQW4ilZ1fPhtNbsvlysifN/s500/application_display_templates.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="484" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4ERuQ8cT-EkuyGVUEyIDzWTe2vmNeYxoEyFTva95gtb2bLfFCZHb8yESKKQBjBgNmDME6xqLQhVdT1KCi9f6VQygKwQRTblJZ8U7FQhkP2UgjIchnbOjCmKhQW4ilZ1fPhtNbsvlysifN/s640/application_display_templates.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Liferay 6.2 Application Display Templates</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAVV1UdOMda1sqLb8qsLL3C44_LhieOUm7yNLbmEeCXGEHYBBMJ0D6xPFLlf4jnEQXW-jKAaTpo9zXH9b3wiVFb-KQSbsFSm64HptbAUbpUwwNZ1KIZPpZ2M0oYCEd0ivrqfvzRHb2QX-O/s700/theme2.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<b></b>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUU-YLrSDwlg9yuZTaTxzCQQeagCj4KquGLPrZJxQ7_5We9NJ-MYZn1Lb2FkkwiKAW1MwNHLC2xtR7EOLzZS8kNHTvzRO68icx-IQVux7lYCQ2Xl5-RAT0D7pPAAHdEUN6pHgKPzpQYkyS/s100/Down_arrow.svg.thumb.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBzkFzCc-5GeJiUivZ0ITpPtPK1ND6mg9b1VHmz3_oNG368CXzgQ3ZSsptvj-vjb7OnbANMVKuBCOYvM9EA4u8NAew1xlDdCoZzj2LKyxnMGVJNbYlAzC0MUM0g125NwRQE_dA250CDZ_v/s700/theme2.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<div style="text-align: left;">
</div>
<b><a href="http://sourceforge.net/projects/lportal/files/Liferay%20Portal/6.2.0%20M6/liferay-portal-tomcat-6.2.0-ce-m6-20130614143518319.zip/download" target="_blank">And lots More .......</a></b><br />
<br />
<br /></div>
</div>
</div>
</div>
</div>
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com10tag:blogger.com,1999:blog-5431329718959558784.post-48919615178331956062013-05-11T13:21:00.003-07:002014-09-11T09:56:18.440-07:00Mobile Theme in Liferay<div dir="ltr" style="text-align: left;" trbidi="on">
Now no need to do any nightmare work for creating mobile theme. No need to find User Agents and writting different CSS for different device. Single CSS will work for all device.<br />
<br />
You are just few steps away for becoming expert in Mobile Theme. <br />
<br />
<b>NOTE </b>:- Considering that you are aware of creating the Basic Theme in Liferay.<br />
<br />
<b>1)</b> Create a Simple theme as we are creating for normal website portal(Make CSS code as percentage specific rather than Pixel specific for width Especially.).<br />
<br />
<b>2)</b> While creating theme, Don't forget to add two most important things.<br />
<ul style="text-align: left;">
<li> In the portal_normal.vm, header section put the below line</li>
</ul>
<meta name="viewport" content="target-densitydpi=160dpi, width=device-width, minimum-scale=1, maximum-scale=1"><br />
<ul style="text-align: left;">
<li> In the Script part add below line</li>
</ul>
AUI().use('aui-viewport');<br />
<br />
Above Two lines will handle your theme according to your device.<br />
<br />
<b>3)</b> Complete your coding part that you required for creating the theme( Navigation , footer, etc).<br />
<br />
<b>4)</b> Once the Development part is done from your end then you need to do the Configuration part for different device. <br />
<br />
<b>5)</b> Now no need to find user-Agent in Liferay with if and else conditions on the Code of theme. Liferay has solved that problem for us now. Liferay has introduced Mobile Device Rules which will do our work.<br />
<br />
<b>6)</b> In order to make it compatible with different Devices like Iphone,Ipad,Android Devices you need to install plugins called WURFL.<br />
<br />
<a href="http://sourceforge.net/projects/lportal/files/Liferay%20Plugins/6.1.0%20GA1/wurfl-web-6.1.0.1-ce-ga1-20120106155615760.war/download" target="_blank"> http://sourceforge.net/projects/lportal/files/Liferay%20Plugins/6.1.0%20GA1/wurfl-web-6.1.0.1-ce-ga1-20120106155615760.war/download</a><br />
<b><br />7)</b> Once You installed Plugins. Follow the below Video to create different rules for different devices.<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="http://www.youtube.com/embed/-m2wQt9vnZ4" width="560"></iframe>
<b></b><br />
<b><br />8)</b> If you don't have device with you for testing then Install User-Agent Switcher in browser for Chrome and also for Firefox ( Required to restart the browser once you switch the User-Agent).<br />
<br />
Thank You Guys for reading. Please post your comments and reviews.</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com4tag:blogger.com,1999:blog-5431329718959558784.post-53713372707620466532013-01-02T02:36:00.000-08:002014-09-11T09:56:18.457-07:00Tabs with Search Container in Liferay<div dir="ltr" style="text-align: left;" trbidi="on">
Generally we have to write a lot of javascript and java code in order to deal with paging in Web based application.<br />
<br />
But with liferay you don't have to deal with that any more. Your life become easier with liferay.<br />
<br />
As I used to post regularly in liferay forums. I found that most of the people face issues of pagination with Tabbing.<br />
Here I would represent how search container works with Tabs.<br />
<br />
Below are some of the screenshot for the demo that I am going to discuss in this post.<br />
<br />
<div class="separator" style="clear: both; margin-left: -38px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0PMGzgaJmRsPmz82zlPY6lU95FXuRMuBOy5DUbtjwLkfaU-z8DkNQP0C-GF1eZpd159ETStfaVCBhb40igivw1MQBQQI20GT6l-_DrAAzKYUMY_j4yEkNR8-cLM_Q6_fI2jkzVttWzhL_/s1600/tabbing1.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="216" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0PMGzgaJmRsPmz82zlPY6lU95FXuRMuBOy5DUbtjwLkfaU-z8DkNQP0C-GF1eZpd159ETStfaVCBhb40igivw1MQBQQI20GT6l-_DrAAzKYUMY_j4yEkNR8-cLM_Q6_fI2jkzVttWzhL_/s640/tabbing1.PNG" width="600" /></a></div>
<br />
<div class="separator" style="clear: both; margin-left: -38px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb4MjIMenyH3TUeeNu76zyRXqqQjEGu6E5DMPKLiRMulkO4u3ebEoMn1kY5zudOYQKFTUdDVUzzBJjMeFiyknJAl5N2O38mlBj3kDeKmEM8316OoIZganUa4GwSm8iHddkA8ote9oiPRwU/s1600/tabbing2.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="196" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb4MjIMenyH3TUeeNu76zyRXqqQjEGu6E5DMPKLiRMulkO4u3ebEoMn1kY5zudOYQKFTUdDVUzzBJjMeFiyknJAl5N2O38mlBj3kDeKmEM8316OoIZganUa4GwSm8iHddkA8ote9oiPRwU/s1600/tabbing2.PNG" width="600" /></a></div>
<br />
<br />
<br />
<br />
<br />
As you will refer above screenshot, you will be able to see two tabs and both of them having list of data.<br />
First Tab show the list of all the User Group and the Second Tab shows the list of all Users for the Current Company.<br />
<br />
Below are the steps you need to follow :-<br />
<br />
1) First Create the Controller Class which will extend the MVC Controller and put it's Entry in the portlet.xml.<br />
<br />
<script src="https://gist.github.com/amitccet/5865431.js"></script>
<br />
SearchContainerController.java
<script src="https://gist.github.com/amitccet/5865875.js"></script>
<br />
2) In order to create the Tabbing View, you have to write below code in your jsp page. So in my case I have created the view.jsp and whose entry by default set in the portlet.xml.
<br />
<script src="https://gist.github.com/amitccet/5865521.js"></script>
3) As you can see in the view.jsp, there are different sections for User and UserGroup. So we have created separate pages for both of them. In order to display data related to UserGroup and User, we have created usergroup.jsp and user.jsp respectively.
<br />
<br />
usergroup.jsp
<br />
<script src="https://gist.github.com/amitccet/5865530.js"></script>
<br />
user.jsp
<br />
<script src="https://gist.github.com/amitccet/5865548.js"></script>
<br />
<b>NOTE </b>:- Here on the basis of "tabs" parameter, it will return the search container. <br />
<br />
4) In order to make the code more readable, I created the separate class for both the UserGroup i.e., UserGroupUtil and for User i.e.,UserUtil<br />
<br />
UserGroupUtil
<br />
<script src="https://gist.github.com/amitccet/5865554.js"></script>
UserUtil<br />
<script src="https://gist.github.com/amitccet/5865564.js"></script>
In order to work pagging in proper way for search container with different tabs. We need to create the iterator URL in proper manner. Because Pagging in Search Container works based on IteratorURL. So we need to pass proper parameter in the Iterator URL.
The Below code plays an key role in the Tabbing with Search Container.
<br />
<script src="https://gist.github.com/amitccet/5865594.js"></script>
In the above code I used HashMap, because if we have more parameter to pass then we can pass easily in the Iterator URL.
Hope it will be useful !!!!
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com7tag:blogger.com,1999:blog-5431329718959558784.post-10637267823685399382012-12-31T23:57:00.000-08:002014-09-11T09:56:18.414-07:00Integrating Solr with Liferay 6<div dir="ltr" style="text-align: left;" trbidi="on">
<div align="CENTER" style="margin-bottom: 0in;">
<b>Building Solr &
Installing Solr instance on tomcat.</b></div>
<ol>
<li><div align="LEFT" style="margin-bottom: 0in;">
<span style="font-weight: normal;">Download
</span><b>Solr-1.3.0</b> release from <a href="http://apache.is.co.za/lucene/solr">Solr.</a></div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
Unzip .tar on some
location. For eg. <b>/opt/solr/</b></div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
Make
<i><b>/opt/solr/example/solr</b></i> as a <i><b>$SOLR_HOME</b></i><i>.</i></div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
Copy
<i><b>apache-solr-1.3.0.war</b></i> file from <i><b>/opt/solr/dist</b></i>
and paste it into <i><b>/opt/solr/example/solr</b></i>.</div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
Open up the
<i><b>/opt/solr/example/solr/conf/solrconfig.xml </b></i>
</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Replace
</div>
<div align="LEFT" style="margin-bottom: 0in;">
<i><b><dataDir>${solr.data.dir:
./solr/data}</dataDir></b><span style="font-weight: normal;"> </span></i>
</div>
<div align="LEFT" style="margin-bottom: 0in;">
by
following<i><b> </b></i></div>
<div align="LEFT" style="margin-bottom: 0in;">
<i><b><dataDir>${solr.data.dir:/opt/solr/example/solr/data}</dataDir></b></i></div>
</li>
</ol>
<div align="LEFT" style="margin-bottom: 0in;">
</div>
<div align="LEFT" style="margin-bottom: 0in;">
<div style="text-align: left;">
<span style="font-weight: normal;"> <b>Note:</b>
</span>The <i><i><b>dataDir</b></i></i> can also be temporarily
overridden with the <i><i><b>JAVA_OPTS</b></i></i> environment variable prior to starting Tomcat</div>
</div>
<div align="LEFT" style="margin-bottom: 0in;">
<i><b>export
JAVA_OPTS="$JAVA_OPTS
-Dsolr.data.dir=/opt/solr/example/solr/data"</b></i></div>
<div align="LEFT" style="margin-bottom: 0in;">
</div>
<ol start="6">
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
It
is recommended to run the Solr instance on separate tomcat instance
other than liferay tomcat.</div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
<span style="font-weight: normal;">So
for separate tomcat for solr, consider it here. </span><i><b>$SOLR_TOMCAT</b></i></div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
<span style="font-weight: normal;">Into
</span><i><b>$SOLR_TOMCAT/conf/Catalina/localhost , </b></i><i><span style="font-weight: normal;">c</span></i><span style="font-weight: normal;">reate
one </span><i><b>solr.xml</b></i><span style="font-weight: normal;">
file and copy following content into the file and save it.</span></div>
</li>
</ol>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
</div>
<br />
<script src="https://gist.github.com/amitccet/5878854.js"></script>
<ol start="9">
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Now
start tomcat and check that it is running without any error or not.</div>
</li>
</ol>
<div align="CENTER" style="margin-bottom: 0in;">
<b>Integrating Solr plugin
with Liferay</b></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<ol>
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Download
Solr plugin which is compatible with the Liferay version.</div>
</li>
<li><div align="LEFT" style="margin-bottom: 0in;">
<span style="font-weight: normal;">Drop
the plugin into </span><i><b>$LIFERAY_HOME/deploy </b></i><span style="font-style: normal;"><span style="font-weight: normal;">directory</span></span><i><b>.</b></i></div>
</li>
<li><div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
Start liferay tomcat server. After started liferay tomcat, just stop
both the tomcat servers (SOLR_TOMCAT and LIFERAY_TOMCAT).</div>
<div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
</div>
</li>
<li><div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
Openup the
<i><b>$LIFERAY_HOME/tomcat-6.0.18/webapps/solr-web/WEB-INF/classes/META-INF/solr-spring.xml</b></i></div>
</li>
</ol>
<div align="LEFT" style="margin-bottom: 0in;">
<i><b>
</b></i>
</div>
<div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
for bean id=”<i><b>solrServer</b></i>”
give the solar tomcat settings and save it.</div>
<div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
for eg. http://localhost:8181/solr</div>
<div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
</div>
<ol start="5">
<li><div align="LEFT" style="font-style: normal; font-weight: normal; margin-bottom: 0in;">
Copy the
<i><b>$LIFERAY_HOME/tomcat-6.0.18/webapps/solr-web/WEB-INF/conf/schema.xml
</b></i>file and paste it into <i><b>/opt/solr/example/solr/conf/
</b></i>directory<i><b>.</b></i></div>
</li>
</ol>
<div align="LEFT" style="margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="margin-bottom: 0in;">
<br /></div>
<div align="CENTER" style="font-style: normal; margin-bottom: 0in;">
<b>Congratulation,
you have done!</b></div>
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com11tag:blogger.com,1999:blog-5431329718959558784.post-49907517478439483012012-05-27T11:58:00.002-07:002014-09-11T09:56:18.449-07:00Dynamic Query in Liferay<div dir="ltr" style="text-align: left;" trbidi="on">
Liferay provides several ways by which we can retrieve data from database. One of them is <span class="IL_AD" id="IL_AD7">dynamic</span> query.
You can easily fire complex query using dynamic query and it will reduce overhead of creating custom finder methods.
Lets go step by step with easy example.
If you want to fire simple AND query then here is the example.<br />
<br />
<script src="https://gist.github.com/amitccet/5878959.js"></script>
Above query will search in table MycustomTable for records which has status as Pending and userId as 10122.
If you want to sort your records in particular order that also you can do.<br />
<br />
<script src="https://gist.github.com/amitccet/5878968.js"></script>
<br />
Above query will order records based on Modified Date and RequestId.
Now if you want to fire some complex query like combination of or , And , Between and Like then here is the example.
By using RestrictionFactoryUtil we can file OR,AND,Like and Between query.
<br />
<br />
<script src="https://gist.github.com/amitccet/5878994.js"></script><br />
As you can see above query will try to fetch those records which has subject like "Test Subject" and its created_date is in between the above dates or the records which has status as pending. To execute dynamic query.
<br />
<br />
<script src="https://gist.github.com/amitccet/5879028.js"></script>
<br />
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com6tag:blogger.com,1999:blog-5431329718959558784.post-16002936299400074252012-05-26T13:56:00.003-07:002014-09-11T09:56:18.421-07:00Deploying Ext in Liferay 6<div dir="ltr" style="text-align: left;" trbidi="on">
On Deploying EXT, We face the problem that our changes are not getting reflected.<br />
<br />
I seen people in liferay forums continuously asking for the same.<br />
<br />
It is not perfect but will work in the case ,<b> </b>if you can't execute the command<b> ant direct-deploy </b>and want to execute<b> ant deploy </b>command<b>.</b><br />
<br />
The following steps you have to follow in order to redeploy the EXT Portlet<br />
<br />
My Portlet name is <b>Alert-ext</b> so I am referring with this name in the below steps :-<br />
<br />
1) Stop the Server<br />
2) put <b>ext-redeploy-6.0.5.jar</b> in <b>tomcat-6.0.29/Webapps/ROOT/WEB-INF/lib/</b><br />
3) Delete the <b>Alert-ext portle</b>t from the <b>webapps folder</b> if in case you are redeploying<br />
4) Remove <b>ext-Alert-ext-service.jar</b> from the tomcat-6.0.29\lib\ext<br />
5) Remove all the <b>*-ext.xml</b> from the path <b>tomcat-6.0.29\webapps\ROOT\WEB-INF</b> except <b>struts-config-ext.xml</b><br />
6) Remove all the jar file related to ext from the <b>tomcat-6.0.29\webapps\ROOT\WEB-INF\lib except ext-redeploy-6.0.5.jar</b><br />
7) Start the Server<br />
8) Deploy the EXT Portlet<br />
9) After that it will ask for rebooting the server once the EXT portlet is successfully deployed.<br />
10) Now once again start the server.<br />
<br />
Your EXT portlet will re-deployed successfully and all the changes will get Executed.<br />
<br />
Hope it helps !!!</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com22tag:blogger.com,1999:blog-5431329718959558784.post-70798491242545242102012-05-26T13:16:00.001-07:002014-09-11T09:56:18.490-07:00Connecting to different database using Liferay Service Builder<div dir="ltr" style="text-align: left;" trbidi="on">
Generally we guys used to connect with the liferay default Database.<br />
We also have requirement that Client wants there Data on Separate Schema or Separate DB.<br />
But In Liferay how we can connect with different DB?<br />
<br />
Don't Worry guys your problem is now solved.<br />
<br />
Just Follow some steps as below :-<br />
<br />
<b>1)</b> As you are mentioning the jdbc properties for the liferayportal in portal-ext.properties, same way mention for the external DB or seperate schema as below :-<br /><br />
<script src="https://gist.github.com/amitccet/5890571.js"></script>
<br />
<b>Explanation :-</b><br />
The first four line starts with the <b>jdbc.default</b>, it means that it was associated with the Default Data Source. So it will connect to the Default Liferay DB.<br /><br />
Last four line line starts with the <b>jdbc.test</b>, which does not belong to the Default DB. It will be connected to some other DB whose entry will be in ext-spring.xml. <br /><br />
<b>2)</b> As we are using service-builder, it means that you need new tables other than liferay default DB. So it requires for you to create new plugins project and in that you need to create service.xml under webapps/WEB-INF and with the help of ANT(ant build-service) or MAVEN (mvn liferay:build-service) you will able to create full structure for your service. But still it is pointing to the default DB. <br /><br />
Now you need to create a new file ext-spring.xml under WEB-INF/src/META-INF dir. Inside META-INF folder you will find couple of xml files whose entry will be there in liferay portal.properties file as below :-<br /><br />
<script src="https://gist.github.com/amitccet/5890576.js"></script><br />
If you notice the order of xml file loading in portal.properties file, then you will find that the last file is ext-spring.xml is loaded. So we will now <b>create ext-spring.xml</b> and putting all transaction,datasource and sessionfactory related changed on that file as below :-<br /><br />
<script src="https://gist.github.com/amitccet/5879321.js"></script><br />
<b>3)</b> Now the last and the final step you need to do is that you need to modify the existing service.xml as follows :-<br /><br />
<script src="https://gist.github.com/amitccet/5879214.js"></script><br />
The <b>data-source</b> value specifies the data source target that is set to the persistence class. The default value is the Liferay data source. This is used in conjunction with session-factory. <br /><br />
The <b>session-factory</b> value specifies the session factory that is set to the persistence class. The default value is the Liferay session factory. This is used in conjunction with data-source. <br /><br />
The <b>tx-manager</b> value specifies the transaction manager that Spring uses. The default value is the Spring Hibernate transaction manager that wraps the Liferay data source and session factory. <br /><br />
If the <b>local-service</b> value is true, then the service will generate the local interfaces for the service. The default value is false.<br /><br />
If the <b>remote-service</b> value is true, then the service will generate remote interfaces for the service. The default value is true.<br /><br />
You can use the local-service and remote-service attribute according to your needs.<br /><br />
You are now connected with your external DB.<br /><br />
Put your Suggestions/Comments.<br /><br />
Thanks for Reading !!!
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com10tag:blogger.com,1999:blog-5431329718959558784.post-54838228672686636382012-05-26T12:34:00.001-07:002014-09-11T09:56:18.469-07:00Redirect to View or Render Method after Submitting the form in liferay<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
In Liferay most of time happens with us that after submitting the form we want to redirect it to some other page.<br />
<br />
Now it's not difficult any more.<br />
<br />
Please check below code.It will help you to redirect to the Static page as you are aspecting in liferay.</div>
<br/>
<script src="https://gist.github.com/amitccet/5879422.js"></script>
<br/>
<b>Congratulations, You have DONE NOW !!!!!!!</b>
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com0tag:blogger.com,1999:blog-5431329718959558784.post-58283986670150283012012-05-19T13:19:00.000-07:002014-09-11T09:56:18.473-07:00LDAP Configuration with Liferay<div dir="ltr" style="text-align: left;" trbidi="on">
<br />
<h3 align="CENTER" style="margin-bottom: 0in;">
<b> OPEN LDAP SERVER
CONFIGURATION FOR WINDOWS</b></h3>
<h3 align="CENTER" style="margin-bottom: 0in;">
<b> </b></h3>
<h3 style="margin-bottom: 0in; text-align: left;">
</h3>
<div style="text-align: left;">
<b><b>Softwares Used:</b></b></div>
<h3 style="margin-bottom: 0in; text-align: left;">
</h3>
OpenLDAP (Windows edition)<br />
LDAP Browsers(Apache DS,Jxplorer, LDAPsoft admin tools, Softerra LDAP
admin etc)<br />
<br />
<br />
<b>Download Softwares:</b><br />
<br />
1. You can download openLDAP windows edition from the following
location:<br />
<div style="font-weight: normal;">
<a href="http://www.userbooster.de/en/download/openldap-for-windows.aspx"><span style="color: blue;">http://www.userbooster.de/en/download/openldap-for-windows.aspx</span></a></div>
2. you can download browsers from the locations given below:<br />
Softerra LDAP admin: <a href="http://www.ldapadministrator.com/download.htm"><span style="color: blue;"><span style="font-weight: normal;">http://www.ldapadministrator.com/download.htm</span></span></a><br />
<br />
<br />
<b>Installing openLDAP:</b><br />
<br />
1. Follow the instructions and choose your host as “localhost”
or an “IP address”<br />
2. Choose the port and SSL-port as you may want to use or can let
it by default to 389 and 636 respectively.<br />
3. Select a database for directory you want to use: BDB or LDAP
(we have used BDB i.e berkely’s DB)<br />
4. NEXT -> choose a password for your root directory, by
default it would be “<b>secret</b>”<br />
5. NEXT-> install-> Finish.<br />
<br />
<div style="margin-bottom: 0in; text-align: left;">
<b> </b><b>Using an LDAP Browser:</b></div>
<div style="margin-bottom: 0in; text-align: left;">
<br /></div>
As We have used “LDAPsoft LDAP admin”<br />
1. Start the server using by clicking on the <b>slapd.exe</b>
where OpenLDAP is installed<br />
2. Install LDAPsoft LDAP admin<br />
3. Open “LDAPsoft LDAP admin” and create new connection
to LDAP.<br />
4. Specify the connection name - it could be any friendly name you
may want to use<br />
5. Specify the Hostname as “localhost” or “IP Address” as
set at the time of installing OpenLDAP<br />
6. Specify the port you are using for LDAP<br />
7. Specify the Base DN as “dc=maxcrc,dc=com” or you may choose
to click on “Fetch Base DNs” button to automatically fetch the
Base DNs<br />
9. Got to NEXT and select “Simple Authentication” method.
For this, you will be needed to provide Bind DN and Password which
would be “cn=Manager, dc=maxcrc, dc=com” and “secret”
respectively. The Bind DN can also be populated by clicking on the
button, which is on the right hand side of the Bind DN text field.<br />
12. NEXT->Finish.<br />
<br />
Now you have a complete connection with openLDAP and you can
create your own OUs and CNs.<br />
<br />
<br />
<div style="text-align: center;">
<b>How To Configure
OPENLDAP in Liferay </b></div>
<h3 style="margin-bottom: 0in; text-align: left;">
</h3>
<ol>
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Go
to the Control Panel in Liferay 6 EE .</div>
</li>
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Control
Panel ---> Settings</div>
</li>
<li><div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
From
the Right Side pannel Select the Configuration---> Authenticaion</div>
</li>
</ol>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
After
Clicking on the Authentication it will open different Options and
Select LDAP on it.</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Click
on the Add from LDAP Servers</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<b>ServerName</b>
: Give any name</div>
<div style="font-weight: normal; margin-bottom: 0in;">
<a href="http://www.blogger.com/blogger.g?blogID=5431329718959558784" name="aui-3-2-0PR1-1391"></a>
<b>Default Values </b>: Select open ldap</div>
<div align="LEFT">
<br />
<br /></div>
<div align="LEFT">
<b>Fill all details as shown in image.</b></div>
<div align="LEFT">
<b>In Credentials : </b><span style="font-weight: normal;">secret</span></div>
<div align="LEFT">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1Po-K-VBZc37cErSBoGpf2CXTRziTsuMR8-rTM6aphMhXUVsID8wtbZtg5Vx2tdQXKXlbdjIN-AF0qoHf8Kcu6Nb_9d_4e2R8gEWwanyrb7vV5r4mii9e6FcD4mRjvk3F_7CdLdQhTNQR/s1600/blog21.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="218" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1Po-K-VBZc37cErSBoGpf2CXTRziTsuMR8-rTM6aphMhXUVsID8wtbZtg5Vx2tdQXKXlbdjIN-AF0qoHf8Kcu6Nb_9d_4e2R8gEWwanyrb7vV5r4mii9e6FcD4mRjvk3F_7CdLdQhTNQR/s400/blog21.PNG" width="400" /></a></div>
<div align="LEFT">
<br /></div>
<div align="LEFT">
</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
After
clicking on the <b>Test LDAP Connection</b> you will popup as shown
in image.</div>
<div align="LEFT" style="margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="margin-bottom: 0in;">
<b>USERS</b></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Keep
all the field as it is .</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
Just
remove the text from the Group field at last before test ldap user
button..</div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
So,
keep the <b>Group field blank.</b></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<br /></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
After
clicking on the Test Ldap User button the popup will be displayed of
the available users as shown in images below</div>
<br />
<br />
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
In the
Snapshot you will be able to see the users are displayed that we
configured in OpenLDAP(<b>Refer Last image in which it is shown the
user that we configured in OpenLDAP Using Browser)</b></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<b><br /></b></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi59IoPZMIISxnmBkTuMGMFTDn-l6rfYW5xdqFT7JO3-CPnExf89N2jNMb01dVAlkK8KgS9jhtuZAC_c-9gxDD_ddwd-NwX8C4DVgtLHsu6COk6hGjwOCaDD_KgdsvSWnc9G456gkFrSGgu/s1600/blog22.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi59IoPZMIISxnmBkTuMGMFTDn-l6rfYW5xdqFT7JO3-CPnExf89N2jNMb01dVAlkK8KgS9jhtuZAC_c-9gxDD_ddwd-NwX8C4DVgtLHsu6COk6hGjwOCaDD_KgdsvSWnc9G456gkFrSGgu/s400/blog22.PNG" width="400" /></a></div>
<div align="LEFT" style="font-weight: normal; margin-bottom: 0in;">
<b><br /></b></div>
<b>Structure of LDAP with Apache DS</b><br />
<b><br /></b>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjor0EGpny853G1zNBBaNEVd_62mbrrbS6bniwCXckNUwwUAqXxEt7luD9MchF4klfnX0D2bufxxP4bHX2fjlazSevvfAmYMUYwlgC1PMmlNWAYIlV_lNzzQi36i-dx6u0jgot2kXLsjN4S/s1600/blog23.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="313" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjor0EGpny853G1zNBBaNEVd_62mbrrbS6bniwCXckNUwwUAqXxEt7luD9MchF4klfnX0D2bufxxP4bHX2fjlazSevvfAmYMUYwlgC1PMmlNWAYIlV_lNzzQi36i-dx6u0jgot2kXLsjN4S/s400/blog23.PNG" width="400" /></a></div>
<b><br /></b>
<br />
<div style="text-align: center;">
<b>Congratulations, You have DONE with LDAP !!!!!!!</b></div>
<br /></div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com2tag:blogger.com,1999:blog-5431329718959558784.post-54087090796512499952012-05-19T12:57:00.004-07:002014-09-11T09:56:18.461-07:00Liferay Eclipse Setup<div dir="ltr" style="text-align: left;" trbidi="on">
<br />
<div style="margin-bottom: 0in;">
</div>
<div align="CENTER" style="margin-bottom: 0in;">
<h3>
<span style="font-family: Arial,sans-serif;"><span style="font-size: medium;">Liferay
Folder Structure</span></span></h3>
</div>
<div style="margin-bottom: 0in;">
<br /></div>
<div style="margin-bottom: 0in;">
1. create Liferay folder in C drive</div>
<div style="margin-bottom: 0in;">
2. unzip Liferay tomcat 6.0 bundle
(liferay-portal-tomcat-6.0-5.2.3.zip) to Liferay folder
</div>
<div style="margin-bottom: 0in;">
3. unzip Liferay plugin SDK
(liferay-plugins-sdk-5.2.3.zip) to Liferay/plugins folder
</div>
<div style="margin-bottom: 0in;">
4. unzip Liferay EXT
(liferay-portal-ext-5.2.3.zip) to Liferay/EXT folder
</div>
<div style="margin-bottom: 0in;">
5. unzip Liferay Portal Source
(liferay-portal-src-5.2.3.zip) to Liferay/portal folder</div>
<div style="margin-bottom: 0in;">
<br /></div>
<div style="margin-bottom: 0in;">
After above steps folder structure will
as bellow</div>
<div style="margin-bottom: 0in;">
<br /></div>
<div style="margin-bottom: 0in;">
c:\Liferay</div>
<div style="margin-bottom: 0in;">
- data</div>
<div style="margin-bottom: 0in;">
- deploy</div>
<div style="margin-bottom: 0in;">
- EXT</div>
<div style="margin-bottom: 0in;">
- license</div>
<div style="margin-bottom: 0in;">
- plugins</div>
<div style="margin-bottom: 0in; text-align: left; text-indent: 0.5in;">
- portal</div>
<div style="margin-bottom: 0in;">
- tomact-6.0.18<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVwg8gY3FhSZGfgseutHWTzy2JC_CivivWLhyphenhyphenk7HAI4q3IgWaALBl4JiGLe3Cl2cM2OEPeXM34-0v1pSsPHYuKr_dv2KQhct1-d5f2p0-ZDsFA8OF1PBT3HT-4wA1R5TVj4QwEfIJJHzOL/s1600/blog1.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVwg8gY3FhSZGfgseutHWTzy2JC_CivivWLhyphenhyphenk7HAI4q3IgWaALBl4JiGLe3Cl2cM2OEPeXM34-0v1pSsPHYuKr_dv2KQhct1-d5f2p0-ZDsFA8OF1PBT3HT-4wA1R5TVj4QwEfIJJHzOL/s400/blog1.PNG" width="258" /> </a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<h3 style="margin-bottom: 0in; text-align: center;">
<span style="font-family: Arial,sans-serif;"><span style="font-size: medium;">Eclipse
Setup</span></span></h3>
<div style="margin-bottom: 0in; text-align: left;">
<span style="font-family: Arial,sans-serif;"><span style="font-size: medium;"> </span></span>
</div>
<div style="margin-bottom: 0in;">
1. Start Eclipse and create three JAVA
projects (plugins, EXT, Portal) as follow:</div>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRJ0MT87oZe_cueiPmum52Ck-yC7GNGJ51NXFUsvSwCDYiiK73ys1graNRhV5enaIVTdwYLXasKLlrwtyfxeNjOq-iCln-8gQtTbSakHld3GRIk2lzVM5jWILuo1LbrAwFjIG6tcLj36IG/s1600/blog2.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="300" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRJ0MT87oZe_cueiPmum52Ck-yC7GNGJ51NXFUsvSwCDYiiK73ys1graNRhV5enaIVTdwYLXasKLlrwtyfxeNjOq-iCln-8gQtTbSakHld3GRIk2lzVM5jWILuo1LbrAwFjIG6tcLj36IG/s400/blog2.PNG" width="400" /></a></div>
<div style="margin-bottom: 0in;">
<br />
<div class="separator" style="clear: both; text-align: left;">
</div>
<div style="margin-bottom: 0in;">
2. Create plugins project </div>
<ul style="text-align: left;">
<li>Create New JAVA Project
</li>
</ul>
<ul style="text-align: left;">
<li> Goto > File > New > Java
Project</li>
</ul>
<ul style="text-align: left;">
<li> Project Name > plugins</li>
</ul>
<ul style="text-align: left;">
<li> Select "Create Project from
existing Source"</li>
</ul>
<ul style="text-align: left;">
<li> Click on browse and select directory
plugins (liferay-plugins-sdk-5.2.3)</li>
</ul>
<ul style="text-align: left;">
<li> Click Finish</li>
</ul>
<div style="margin-bottom: 0in;">
3. Create EXT project </div>
<ul style="text-align: left;">
<li>Create New JAVA Project
</li>
</ul>
<ul style="text-align: left;">
<li> Goto > File > New > Java
Project</li>
</ul>
<ul style="text-align: left;">
<li> Project Name > EXT</li>
</ul>
<ul style="text-align: left;">
<li> Select "Create Project from
existing Source"</li>
</ul>
<ul style="text-align: left;">
<li>Click on browse and select directory
EXT (liferay-portal-ext-5.2.3)</li>
</ul>
<ul style="text-align: left;">
<li> Click Finish</li>
</ul>
<div style="margin-bottom: 0in;">
4. Create Portal project </div>
<div style="margin-bottom: 0in;">
</div>
<ul style="text-align: left;">
<li>Create New JAVA Project
</li>
</ul>
<ul style="text-align: left;">
<li> Goto > File > New > Java
Project</li>
</ul>
<ul style="text-align: left;">
<li> Project Name > portal</li>
</ul>
<ul style="text-align: left;">
<li> Select "Create Project from
existing Source"</li>
</ul>
<ul style="text-align: left;">
<li> Click on browse and select directory
Portal (liferay-portal-src-5.2.3)</li>
</ul>
<ul style="text-align: left;">
<li> Click Finish</li>
</ul>
<br />
<div style="margin-bottom: 0in;">
</div>
<div style="margin-bottom: 0in;">
5. Run Configuration Settings</div>
<div style="margin-bottom: 0in;">
</div>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA28skNNx7gHxRztFGyQtLGzZesGn8CSMZ9HxW_ETZoU-UiC-Rpxujvuk8wM63sdYLTQs8oxcNr0uc5Cg65oJQlRgnmhAFhFPZVXS2Geuni19-wi4bgsQtJr_vM8vy32OdhIiUoaXP2n1N/s1600/blog3.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="317" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA28skNNx7gHxRztFGyQtLGzZesGn8CSMZ9HxW_ETZoU-UiC-Rpxujvuk8wM63sdYLTQs8oxcNr0uc5Cg65oJQlRgnmhAFhFPZVXS2Geuni19-wi4bgsQtJr_vM8vy32OdhIiUoaXP2n1N/s400/blog3.PNG" width="400" /></a></div>
<div style="margin-bottom: 0in;">
</div>
<div style="margin-bottom: 0in;">
<br />
<ul style="text-align: left;">
<li>Open "Run Configurations..."
under the Run Menu
</li>
</ul>
<ul style="text-align: left;">
<li>Under Java Applications node in the
tree, right click and "New"
</li>
</ul>
<ul style="text-align: left;">
<li>Click on New_Configuration and
change Name: Liferay
</li>
</ul>
<ul style="text-align: left;">
<li>On Main tab, select the portal
source code project or your Plgins project
</li>
</ul>
<ul style="text-align: left;">
<li>In the Main class put
org.apache.catalina.startup.Bootstrap, don't check any check boxes
</li>
</ul>
<ul style="text-align: left;">
<li>Go to Arguments tab, in the Program
arguments type: start
</li>
</ul>
<ul style="text-align: left;">
<li>In VM arguments put like:
</li>
</ul>
<pre class="brush:css">-Xmx512m
-XX:PermSize=32m
-XX:MaxPermSize=160m
-Dfile.encoding=UTF8
-Duser.timezone=GMT
-Dcatalina.base=-Xmx512m
-Djava.security.auth.login.config=C:/Liferay/tomcat-6.0.18/conf/jaas.config
-Dcatalina.base=C:/Liferay/tomcat-6.0.18
-Dcatalina.home=C:/Liferay/tomcat-6.0.18
-Djava.io.tmpdir=C:/Liferay/tomcat-6.0.18/temp
</pre>
</div>
<div style="margin-bottom: 0in;">
<br /></div>
<ul style="text-align: left;">
<li>In Classpath tab, remove ALL User
entries, do NOT remove the JRE System library
</li>
</ul>
<ul style="text-align: left;">
<li>Select User Entries and "Add
External Jars", find the bootstrap.jar file from the
${tomcat-root-folder}/bin folder and add only that one
</li>
</ul>
<ul style="text-align: left;">
<li>In the Source tab, select any
related Java project (EXT, Plugins, Portal), but also the main
project. For example, if you want to also debug a plugin, add it's
source path here
</li>
</ul>
<ul style="text-align: left;">
<li>Under Common tab check Run (if we
want debugging then check Debug)
</li>
</ul>
<ul style="text-align: left;">
<li>Apply all changes
</li>
</ul>
<ul style="text-align: left;">
<li>Run Liferay from Run Icon (View
output on console)</li>
</ul>
<ul style="text-align: left;">
<li>Check Liferay server on
<span style="color: blue;"><u><a href="http://localhost:8080/">http://localhost:8080</a></u></span></li>
</ul>
<div style="margin-bottom: 0in;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XOdb1DJdLZXrHYQ1XXj3GQKDjI4rauw6IqNQm15Nt_QqegMc7kN760WXgFNVZZlPZyKDJjelOPw94E-m9Y9DS7qMP1wZ3NH9oV1lFOdeX1OxBjvzXnj-YFj3HPlvG03-0atquIxFm-Jj/s1600/blog4.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="302" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XOdb1DJdLZXrHYQ1XXj3GQKDjI4rauw6IqNQm15Nt_QqegMc7kN760WXgFNVZZlPZyKDJjelOPw94E-m9Y9DS7qMP1wZ3NH9oV1lFOdeX1OxBjvzXnj-YFj3HPlvG03-0atquIxFm-Jj/s400/blog4.PNG" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div style="margin-bottom: 0in;">
</div>
</div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com2tag:blogger.com,1999:blog-5431329718959558784.post-20301746915437557852012-05-04T04:22:00.002-07:002014-09-11T09:56:18.430-07:00Access Liferay Service & Util and Custom Portlet Service & Util Class in Velocity Template<div dir="ltr" style="text-align: left;" trbidi="on">
<a name='more'></a>Here are the steps to access services and util class of custom portlet in velocity template.<br />
<br />
1) Make sure the services and util class <span class="IL_AD" id="IL_AD6">which you</span> want to access are available inside tomcat/lib/ext.<br />
<br />
2) In order to access services you need to place below property inside portal-ext.<br />
<br />
<script src="https://gist.github.com/amitccet/5879521.js"></script><br />
By default this property will <span class="IL_AD" id="IL_AD9">be like</span> this<br /><br />
<script src="https://gist.github.com/amitccet/5879527.js"></script><br />
Which means you wont be able to access serviceLocator inside velocity template.<br />
So make sure before you access any service inside velocity template change this <br /><br />
<script src="https://gist.github.com/amitccet/5879521.js"></script>
<br />
3) Access services using findService Method of Custom Portlet in Velocity.<br />
<br />
<div class="container">
<script src="https://gist.github.com/amitccet/5879537.js"></script>
</div>
<div class="line number2 index1 alt1">
</div>
<div class="line number3 index2 alt2">
</div>
<div class="line number4 index3 alt1">
</div>
<div class="line number5 index4 alt2">
<code class="java plain"><br /></code></div>
<div class="line number5 index4 alt2">
</div>
<div class="line number5 index4 alt2">
Normally we use findService(serviceName) method to access Liferay service.<br />
But to access custom portlet service we have to use findService(contextName,ServiceName).<br />
<br />
findService(serviceName) will search at the portal level and
findService(servletContextName , serviceName) will search at specified
portlet level.<code class="java plain"> </code></div>
</div>
<br />
4) Access Liferay Services using findService Method in Velocity<br /><br />
<script src="https://gist.github.com/amitccet/5879544.js"></script>
<br />
5) Access util class using findUtil Method for inbuilt Util of Liferay<br />
<br />
<div>
<script src="https://gist.github.com/amitccet/5879550.js"></script><br />
</div>
6) Access util Class of Custom Portlet in Velocity refer below link<br />
<br />
<a href="http://www.liferay.com/web/raymond.auge/blog/-/blogs/2245146">http://www.liferay.com/web/raymond.auge/blog/-/blogs/2245146</a></div>
Anonymoushttp://www.blogger.com/profile/13770286510803429589noreply@blogger.com12