Layout of the portal page

Portal, Express Beta Version 6.1
Operating systems: i5/OS, Linux,Windows

Layout of the portal page

Before customizing your portal site, it helps to understand the underlying structure of the portal as it is determined by the portal JSPs. The portal page is composed of JSPs and statically included JSP fragments (JSPFs) for screens, themes, and skins that are typically created by the Web designer of the portal. These JSPs reside in the corresponding /screens, /themes, /skins directories under :

Linux and Windows: was_profile_root/installedApps/cellname/wps.ear/wps.war

i5/OS: app_server_root/installedApps/cellname/wps.ear/wps.war

Within this location, subdirectories for markup, locale, and client types are used to support portal aggregation.

themes: provide the navigation, appearance, and layout of the portal, including colors, fonts, and images outside of the portlet content area (Home screen).
screens: the area of the portal that typically displays portlets (Home screen), but can also display other content in its place, for example, a login form or error message. Screens are selected from navigation icons in the theme.
skins: represent the border rendering around components, such as row containers, column containers, or portlets. Skins are installed independently from themes. However, the administrator can set a default skin for a theme.

The starting place for building the portal page is Default.jsp in the /themes directory. The screen and skin are called by the corresponding <portal-core:screenRender/> and <portal-core:pageRender/> tags from the portal-core tag library.

The following example is shown to illustrate the underlying code in themes, screens, and skins as they are used in the portal. The code example is followed by an illustration of how this code would render in the portal.

<style>
div.theme, div.screen, div.skin { 
    border: 3px solid; 
    width: 75%;
    padding: 5px;
}
div.theme { color: blue;}
div.screen, p.screen { color: green;}
div.skin, p.skin {color: red;}
</style>
<div class="theme">
    <p>Theme (Default.jsp)</p>
    <p>...</p>
    <p class="screen"><portal-core:screenRender/></p>
    <div class="screen">
        <p>Screen (Home.jsp)</p>
        <p>...</p>
        <p class="skin"><portal-core:pageRender/></p>
        <div class="skin">Skin</div>
    </div>
</div>

Themes

Theme policies

Theme extension points
By using the Eclipse Extension Point Framework, the default Portal theme provides various points where theme functionality can be extended by simply putting a new JAR file in the classpath.

Screens

Skins

Aggregation

Parent topic: Designing a portal site

Library | Support | Terms of use |