Chapter 5. Customize the Solution
When you are developing a solution to satisfy the customer requirements some form of customization is
usually involved. This section helps you understand and implement common customizations for this
solution and how to create a unique theme and skin for your portal.
Creating New Themes
Perform this task on the Development Client.
To customize the look and feel of the portal, for example to give it the corporate identity of your customer,
you can modify the theme and skin that is used on the pages. This includes changing colors, banners,
styles, fonts, layout, and other items that can make the portal look unique.
Defining your own theme involves creating a subdirectory using the theme name in the following directory:
<was_profile_root>/installedApps/cellname/wps.ear/wps.war/themes/markup
You must also create the supporting resources within that directory. HTML is the only markup language
that is provided by IBM WebSphere Portal Express that supports more than one theme. The following
steps provide one way of creating your own HTML-based theme using an existing theme.
1. Create a new directory using the new theme name; for example:
<was_profile_root>/installedApps/cellname/wps.ear/wps.war/themes/html/M
yTheme
Note: To avoid problems with the directory name, do not use DBCS characters.
2. Copy all of the files and subdirectories from another theme directory into the new directory. For
example, you could copy the files from the /Express theme.
3. Make updates to the following files according to the requirements of your portal site.
JSPs
Default.jsp and its included JSPs are used to provide the appearance and layout and
determine where the screen element goes.
Images
Images are used for icons and tools within the theme pages. They are typically located in an
images directory. You can modify these images or create your own and add them to the JSPs.
Style sheets
In order to handle the different locales and browsers supported by a theme, the style sheets are
actually JSPs. The <portal-theme:cacheProxyUrl/> tag and servlet, which is used to make
sure the output of CSS JSPs is cacheable, makes sure that the JSP is aware of the current
browser and locale.
Note: For security reasons, the cache proxy servlet will only serve URLs pointing to resources
located in the themes, skins, and screens directories. This makes all resources underneath these
directories public. Also, any URLs containing the ".." characters will not be served.
All style sheets reside in the css directory in the /MyTheme directory. The main style sheet is
styles.jsp. styles.jsp contains only statically included JSP fragments (JSPFs - .jspf file
extension). The easiest way to add your own styles is to create your own JSP fragment file and
54 Collaborative Portal: Implementation Guide