How to Use the Tag Library
This section describes the steps for creating from scratch a layout JSP page.
It may be easiest to take an existing layout and modify it. The default layouts are contained in the com.sap.portal.layouts.default application.
Procedure
...
1. In the portalapp.xml file:
a. Add a sharing reference in the <application-config> element, as follows:
<property name="SharingReference"
value="com.sap.portal.pagebuilder"/>
b.
Add a reference to the tag library by adding the following property to the
<component-profile> element for the JSP component:
<property name="NavigationTagLibrary"
value="/SERVICE/com.sap.portal.pagebuilder/taglib/layout.tld"/>
2. In the JSP page, add a taglib directive for the layout tag library. JSP pages for the portal’s default layouts use the tag name prefix lyt.
<%@ taglib uri="prt:taglib:com.sap.portal.reserved.layout.TagLibLayout" prefix="lyt" %>
If the JSP page includes HTMLB tags, add a reference to the HTMLB tag library.
3. Add a template tag, which indicates the start and end of the layout.
<lyt:template>
...
</lyt:template>
4. In the template tag, add HTML to divide the page into sections.
5. In the layout tag, add container or containerWithTrayDesign tags to indicate where you want iViews to be placed.
For example, the following uses HTMLB tags to divide the page into two equal columns and to add containers to each column.
<hbj:content id="myContext" >
<hbj:page title="Portal Page">
<hbj:gridLayout id="GridLayout1" width="100%" cellSpacing="2">
<hbj:gridLayoutCell rowIndex="1" columnIndex="1" width="50%"
verticalAlignment="top">
<lyt:container id="column1" />
</hbj:gridLayoutCell>
<hbj:gridLayoutCell rowIndex="1" columnIndex="2" width="50%"
verticalAlignment="top">
<lyt:container id="column2" />
</hbj:gridLayoutCell>
</hbj:gridLayout>
</hbj:page>
</hbj:content>
The container tag creates a container that displays iViews with the default iView tray. The containerWithTrayDesign tag enables you to create a custom tray for the iViews within the container.
6. For the containerWithTrayDesign tag, add HTML inside the tag’s body to create a tray. Within the tray, indicate with the iViewContent tag where to place the iView’s contents, and use other layout tags to create links to invoke tray functions.
For an example of a layout JSP page that creates a simple iView tray, see Sample Layout.