Monday, August 24, 2009

Adding Web 2.0 skins

In conventional portal skins, a Control.jsp implements the code to render the decoration around a portlet. With the portal Web 2.0 theme, the portal renders the pages on the client. Therefore, rather than invoke a JSP to render the skin, it requires to execute an XSLT transformation. To achieve this, the portlet needs to register the following at bootstrap time in head_extras.jspf : The skin name and xslt file path in a mapping for use by the CSA aggregator, along with its object ID, that is its internal identifier which it retrieves from the portal model.

At runtime, the page layout model stores the object ID of the assigned skin. The CSA aggregator retrieves the XSLT path of the skin, then load and apply it to render the skin. If the XSLT path is empty or null, the default skin XSLT would be used.

To add a new skin, proceed as follows:

  1. Implement an XSLT to render the desired markup.
  2. Store the XSLT file in the /xslt directory of the theme, with the same name as the skin. For example, for the IBM skin this is xslt/IBM.xsl .
  3. Register the new skin with the CSA aggregator as follows:
    1. Edit the file head_csa.jspf .
    2. In the definition of the bootstrap() function, find the lines shown below and add a new, similar line for your skin:
      portalAggregator.page.addSkin(new
      com.ibm.portal.aggregation.IbmSkin("IBM",skinResourceRoot2Id["IBM"],""),true);
      portalAggregator.page.addSkin(new
      com.ibm.portal.aggregation.Skin("NoSkin",skinResourceRoot2Id["NoSkin"],""),fal