Sun Identity Manager Service Provider 8.1 Deployment

Modifying the Layout

The Service Provider User Interface pages implement the Apache Struts Action framework and Tiles to control page layout. The file $WSHOME/spe/user/common/layouts/page.jsp is used as a template when pages are rendered, with various regions of the page corresponding to the output of individual JSPs or tiles. The default page template consists of four tiles:

Adding a new tile, for example a “footer” at the bottom of the page, is accomplished by defining the tile in $WSHOME/WEB-INF/spe/config/tiles-page-defs.xml and then inserting the tile in page.jsp:

<body class="DefBdy" onload=’checkFirst( );’>
   <tiles:insert attribute="masthead" ignore="true"/>
   <tiles:insert attribute="navbar" ignore="true"/>
   <tiles:insert attribute="subnavbar" ignore="true"/>
   <tiles:insert attribute="content"/>
   <tiles:insert attribute=”footer” ignore=”true”/>
</body>

Placement of the tile on the rendered page can be controlled via HTML markup in the page template and/or via CSS. A template tile for a page footer is located at $WSHOME/spe/user/common/tiles/footer.jsp.

Another page which users will frequently want to modify is the login page. This page consists of a single tile, content, whose source JSP is $WSHOME/spe/user/Login.jsp. The actual HTML <FORM> is generated as an Identity Manager form, but it is wrapped in content from Login.jsp.

The page.jsp file includes three CSS stylesheet files:

The first two stylesheets are the system defaults and should not be modified, as they may be rewritten during upgrades. The customStyle.css stylesheet is empty and is intended for user custom CSS styles. These files are all located in $WSHOME/spe/user/common/layouts/styles/.

The Service Provider User pages are designed so that rebranding the page can be accomplished by modifying CSS styles, rather than JSPs. For example, the product name logo (Java System Identity Manager Service Provider) image in the masthead is specified by the following CSS definition:

td.MstTdTtlProdNam {
   background: url(../images/ProductName.png) no-repeat 10px 30px;
   padding:10px 10px 0px 10px;
   vertical-align:top;
   white-space:nowrap;
   height: 75px;
   width: 520px;
}

You can override this definition in customStyle.css to point to a different image file or specify a different location. For more information about using CSS to change user interface elements in Identity Manager, see Deployment Guide.