Chapter 10 Customizing the Global Themes

This chapter contains the following:

• Customization Overview

• Adding a Theme to the Sample Portal

• Customizing the Current Themes

Customization Overview

There are two levels of customization for the themes:

The number of themes and theme attributes are configurable by the administrators. Theme and theme attributes are display profile properties; so they can be edited in the display profile directly. The theme properties are defined as global properties in the organization level in the sample portal. So, when a new theme is created, all users in the organization will see it.

The end user can select one of the preset themes that are defined by the administrator, or customize some theme attribute values inside of the theme page in the Desktop. When the theme changes, it applies to all the containers in the Desktop, and also, the changed property will be stored in the user level display profile.

There are tag library functions defined to allow JSPs to retrieve the theme related values from the display profile. Behind the scene, the tag library functions use the Theme Java class to get the theme properties. For more information on the Theme Java class, please see the Java docs for com.sun.portal.providers.context.Theme.

When you add (or customize) a global theme, all channels see the change, as themes are a global property for all channels.

See the Sun Java System Portal Server 7.1 Technical Reference for more information on the Global themes

Adding a Theme to the Sample Portal

To add a Theme to the Developer Sample

1. Develop the display profile XML definition for the new theme and ensure that the new collection has all thirty eight (38) properties defined in the display profile.

   The collection can be added either using the Portal Server management console, or using the psadmin subcommand.

2. Copy new images into the PortalServer-base/web-src.

   For example:

   • activeBulletImage, inactiveBulletImage, brandImage, brandImage2, previewImage: these images must be copied in to the PortalServer-base/web-src/images directory.

   • helpImage, removeImage, minimizeImage, maximizeImage, normalImage, attachImage, detachImage, editImage: these images must be copied in to the PortalServer-base/web-src/desktop/images directory.

   • tabNotchImage must be copied in to the PortalServer-base/web-src/desktop/tabs/images directory.

3. Run the PortalServer-base/bin/psadmin redeploy --adminuser amadmin --passwordfile passwordfile --portal portal-ID command to deploy the image files.

   See the Sun Java System Portal Server 7.1 Command Line Reference for more information on the psadmin subcommand.

4. Verify that the new theme shows up on the Desktop’s Theme page.

Customizing the Current Themes

Change the theme values in the display profile. You can modify the theme properties from the administration console, or by using the psadmin subcommand to load the XML fragment.

Changing in the administration console is easier, since you want to pin point some specific properties, and change the values.

To Change the Text

The font families and font sizes are combined and defined in the following theme attributes.

• headerText

• titleText

• contentLayoutText

The value of these attributes is actually a class defined in the desktop PortalServer-base/web-src/desktop/css/style.css file. In the Desktop style.css file, there are predefined font family and font size as follows:

.sansSerif12Font { font-family: sans-serif; font-size: 12pt }
.sansSerif11Font { font-family: sans-serif; font-size: 11pt }
.sansSerif10Font { font-family: sans-serif; font-size: 10pt }
.sansSerif9Font { font-family: sans-serif; font-size: 9pt }
.sansSerif8Font { font-family: sans-serif; font-size: 8pt }
.sansSerif6Font { font-family: sans-serif; font-size: 6pt }
.monospace12Font { font-family: monospace; font-size: 12pt }
.monospace11Font { font-family: monospace; font-size: 11pt }
.monospace10Font { font-family: monospace; font-size: 10pt }
.monospace9Font { font-family: monospace; font-size: 9pt }
.monospace8Font { font-family: monospace; font-size: 8pt }
.monospace6Font { font-family: monospace; font-size: 6pt }
.serif12Font { font-family: serif; font-size: 12pt }
.serif11Font { font-family: serif; font-size: 11pt }
.serif10Font { font-family: serif; font-size: 10pt }
.serif9Font { font-family: serif; font-size: 9pt }
.serif8Font { font-family: serif; font-size: 8pt }
.serif6Font { font-family: serif; font-size: 6pt }
.verdana12Font { font-family: verdana; font-size: 12pt }
.verdana11Font { font-family: verdana; font-size: 11pt }
.verdana10Font { font-family: verdana; font-size: 10pt }
.verdana9Font { font-family: verdana; font-size: 9pt }
.verdana8Font { font-family: verdana; font-size: 8pt }
.verdana6Font { font-family: verdana; font-size: 6pt }

To change the font for the header text, title text, and content and layout text, please use one of the predefined class name, or, add new class definition in the style.css file, and then use it.