display asset publisher full content in another site page in liferay 6.2

We often use asset publisher to show news abstract at main page for quick view. If users want to read more, they will click on readmore link and browsers will link to the page of that article.

But I have try many times to configure asset publisher portlet, it only show full content  in the same portlet. After searching on the internet I find this, to display asset publisher full content in another site page we need to do 3 step:

1. Add asset publisher to a page and set it to default display

2. Write an article and set it default display page, here you can see the canonical URL, the unique url to an article, that will show that article in right page

3. Generate canonical URL in asset publisher by hook file or in velocity template

3.1. If you want to use hook file using eclipse:

- create hook project

- add new liferay hook configuration, select the create custom jsp and final choose the jsp override from liferay-.abstracts.jsp in asset publisher portlet.

- in this please insert the code:

viewURL = assetRenderer.getURLViewInContext(liferayPortletRequest, liferayPortletResponse, currentURL);

- deploy it and you will see the result, you can download the war here, please copy to deploy directory (liferay-portal-6.2-ce-ga4\deploy), you can install it.

3.2. If you want to generate in velocity asset publisher template, You have to use onather way. I myself use the  code bellow, like the code that we add in hook project by the variable in velocity but It does not show the right url.

$AssetRenderer.getURLViewInContext($renderRequest, $renderResponse, $currentURL)

Finally I use this code:

#set ($url1array = $currentURL.split("\/"))

$curEntry.getTitle($locale)

Here is the full code of newslide show asset publisher template, if you want to know more about how to make news slideshow by asset publisher, please read this article: news slideshow in liferay 6.2

##
## This template can be used to modify the look of a specific
## application.
##
## Please use the left panel to quickly add commonly used variables.
## Autocomplete is also available and can be invoked by typing "$".
##

#if (!$entries.isEmpty())
#foreach ($curEntry in $entries)
#set($renderer = $curEntry.getAssetRenderer() )
#set($className = $renderer.getClassName() )

#if( $className == "com.liferay.portlet.journal.model.JournalArticle" )

#set( $Article = $renderer.getArticle() )
#if( $Article.getArticleImageURL($themeDisplay) )
#set( $image = $Article.getArticleImageURL($themeDisplay) )
#set ($content = $saxReaderUtil.read($Article.getContent()).getStringValue())
#set ($dau =$content.indexOf('src="', 1))
#set ($dau = $dau + 5)
#set ($cuoi =$content.indexOf('"', $dau) )
#set ($urlarray = $currentURL.split("\?"))
#set($site = $urlarray.get(0))
#set ($url1array = $currentURL.split("\/"))

$curEntry.getTitle($locale)

$renderer.getSummary($locale) 

#else

$curEntry.getTitle($locale)

$renderer.getSummary($locale)

#end
#end
#end
#end

news slideshow in liferay 6.2

I want to insert in my portal a portlet to show news with image, description and link to that article. This portlet would be a beautiful way to get notice from readers and make the website more beautiful. But to make a new portlet takes a lot of time, why don't we use asset publisher portlet.

In liferay 6.2, we can use asset publisher template to change the way showing web content. And finally I got this:

It will automatically get image of webcontent and its description to make slideshow with beautiful transition effect. Click on the title to navigate to article. Now I will show you how to make news slideshow by asset publisher portlet:
1. Insert at least 3 article in web content. Remember that each article must has a small image, and a big image in its content to show big image and its thumb in slideshow
2. Add new asset publisher portlet. Select the categories of the articles we have added before to show content in slideshow automatically

3. Add a new template in the configuration/display setting with the code below and select it then:

##
## This template can be used to modify the look of a specific
## application.
##
## Please use the left panel to quickly add commonly used variables.
## Autocomplete is also available and can be invoked by typing "$".
##

#if (!$entries.isEmpty())
#foreach ($curEntry in $entries)
#set($renderer = $curEntry.getAssetRenderer() )
#set($className = $renderer.getClassName() )

#if( $className == "com.liferay.portlet.journal.model.JournalArticle" )

#set( $Article = $renderer.getArticle() )
#if( $Article.getArticleImageURL($themeDisplay) )
#set( $image = $Article.getArticleImageURL($themeDisplay) )
#set ($content = $saxReaderUtil.read($Article.getContent()).getStringValue())
#set ($dau =$content.indexOf('src="', 1))
#set ($dau = $dau + 5)
#set ($cuoi =$content.indexOf('"', $dau) )

$curEntry.getTitle($locale)



$renderer.getSummary($locale) 

#else

$curEntry.getTitle($locale)

$renderer.getSummary($locale)

#end
#end
#end
#end

4. Add the file css to css folder of the theme being used and import it in your custom.css:

@import url(camera.css);

5. Add images in the folder image in css folder

css and images files

6. Add javascript files to javascript folder and add these code in the head of template of the theme

 

file download:

javascript file

Ok it's done.
If you feel it's difficult, you can download retina liferay theme, I have add all css and javascript of the slideshow to it. You just paste the asset publisher template to use slideshow.

DOWNLOAD ATTACHMENTS:

•  images-and-css.zip (0 Downloads)
•  js.zip (0 Downloads)