Monday 5 November 2012

Adding JQuery Library to Liferay 6.1 at Portal level

As all Liferay developers know, Liferay 5.2.x and earlier had included jQuery library by default at Portal level, so if we want to use jQuery in any portlet or plugins, we do not need to include the library. But from 6.0, Liferay is using YUI, so jQuery is not available by default and we need to include the jQuery library if we want to use.

The following blog entry from Liferay covers three different ways to include jQuery

http://www.liferay.com/web/nathan.cavanaugh/blog/-/blogs/5363997

1. Theme Level
2. Portlet Level
3. jsp level.

but I came across one scenario where we wanted to have the same behavior as in 5.2.3, we have multiple themes so we do not want to duplicate same code in every portlet, and want to include the jQuery at portal level..

The solution worked for us is

Step 1: included the jquery-1.2.6.min.js in your hook - /jsp-hook/docroot/WEB-INF/ext-web/docroot/html/js/jquery-1.2.6.min.js


Step 2: copy top_js.jspf from source and place that in your hook -  /jsp-hook/docroot/META-INF/custom_jsps/html/common/themes/ and add the the line

            <script src="/html/js/jquery-1.2.6.min.js"></script>

at the end of top_js.jspf.

so now jQuery available throughout the portal in all the themes. 

2 comments:

  1. Buen artículo. Mucahs gracias!!

    ReplyDelete
  2. I don't have a hook, just two regular hands. I suppose it could come in handy in a fight. In the meantime, can you spell out some paths (e.g. liferay-portal-6.2-ce.ga3 > tomcat-7.0.42 > ?

    ReplyDelete