IBM COLLABORATIVE PORTAL 2.2.1 User Manual

<was_profile_root>/installedApps/cellname/wps.ear/wps.war/skins/markup_
type/MySkin

Note: To avoid problems with the directory name, do not use DBCS characters.

2. Copy all of the files and subdirectories from another skin directory into the new directory. For

example, you could copy the files from the /IBM skin.

Note: If you are using the portlet context menus then the portletContextMenu.jsp file from
/themes/html/IBM

should also be copied into the themes/html/<your_theme> directory

for any themes you wish your skin to work with.

3. Make updates to the following files according to the requirements of your portal site.

JSPs

Edit Control.jsp to create the title bar and border around individual portlets. The other JSPs,
such as UnlayeredContainer-H.jsp and UnlayeredContainer-V.jsp, are used by the
portal customization to arrange portlets within the page.

Images

These are images that are used to create the portlet title bar or background images. You can
modify these images or create your own and add them to the JSPs.

4. To add the skin, use the Themes and Skins portlet under Administration, Portal User

Interface. The skin name that you add must be the same as the subdirectory name that you used
for the skins.

5. Use

the

Appearance portlet to test and make changes to the new skins as you are working on

them.

6. When you are ready to provide the skin for general use, create a preview that users and

administrators can see from the page properties:

a. Create a screen capture of the skin.

b. Reduce the screen capture image to fit in the preview box. The recommended size is 307 x

159 pixels.

c. Name the image preview.gif. GIF files are limited to 256 colors.

d. Copy the image to:

<was_profile_root>/installedApps/cellname/wps.ear/wps.war/skins/html
/<skin_name>

For example:

<was_profile_root>/installedApps/cellname/wps.ear/wps.war/skins/html
/MySkin/preview.gif

7. After the skin is fully developed and tested, update and redeploy the IBM WebSphere Portal

Express .EAR file with the new skin.

Note:

If the IBM theme directory is either deleted or renamed, the portal resource loader uses the
themes/html/Default.jsp

. In this case, you should also use the fallback skin. To do this,

rename the skins directory. For example, the skins/html/IBM directory should be renamed
skins/html/IBM1

. If you have a broken theme, you can rename the theme and skin directories

which are causing the problem to get to a working minimal theme.

Important: You have completed the installation and configuration tasks for the solution.

Collaborative Portal: Implementation Guide