Previous Contents Index Next |
iPlanet Messenger Express 5.2 Customization Guide |
Chapter 2 Customizing General Features
This chapter describes how to customize the general features of iPlanet Messenger Express.This chapter contains the following sections:
Modifying the Login Screen
Modifying the Login Screen
This section describes how to modify the Messenger Express login screen shown in Figure 2-1.
Figure 2-1    Messenger Express Login Screen
You can modify the following on the Messenger Express login screen:
To Modify the Login Screen
To modify the Login Screen, edit the lang/default.html file.Customize the user interface by editing the body of lang/default.html. Functionally, lang/default.html contains three forms, two visible and one hidden:
The hidden form is the one that is submitted to the server (POST username and password to login.msc).
You can also insert a new banner, image or link on the Messenger Express login screen, by editing the lang/default.html file.
Note lang is the language specific file that you need to edit.
ExampleLogin Screen Modifications
The example shown in Figure 2-2 replaces the iPlanet logo with a custom graphic and adds an advertisement banner with a link.
Figure 2-2    Example Login Screen Modifications
Code Example 2-1 shows the login screen HTML before the edit and shows the changes to be made in the en/default.html file to customize the login screen.
Modifying Color Sets
This section describes how to modify the iPlanet Messenger Express user interface color sets shown in Figure 2-3.
Figure 2-3    Messenger Express Color Sets
You can customize the default color sets for the Messenger Express user interface to change items such as the title bar, tab outlines, and column headers.
To Modify Color Sets in the User Interface
To modify color sets in the user interface, edit the ui[] array definitions near the top of the main.js file.The function refreshColorSet() in main.js sets the color scheme of the user interface to color values such as chrome1 and accent2. These color values are used by the rest of the display functions in main.js.
See refreshColorSet() in main.js for the translation of the ui[] elements to the color values.
The ui[] array can have as many rows as desired. Additional color themes are displayed on the preferences page as new rows are defined in main.js. The user's JavaScript application will not start when the rows are deleted from the definition script with the user preferences still pointing to a higher color table index than exists in the ui[] array.
See Table 2-1 for the color index of ui[] controls.
Table 2-1    Color Index of ui[] Controls
Index
Name
Determines
Selected tab background, tool bar, column headers, and so on
ExampleColor Sets Modifications
The example shown in Figure 2-4 customizes the default color set ui[0] to have accent1 color maroon, chrome4 color navy blue, and chrome5 color silver.
Figure 2-4    Example Color Sets Modifications
Code Example 2-3 shows the necessary changes to be made in the file main.js.
Modifying the Logo and Link
This section describes how to modify the Messenger Express corner logo and link shown in Figure 2-5.
Figure 2-5    Messenger Express Corner Logo and Link
You can modify the following on the Messenger Express corner logo and link:
To Modify the Logo and Link
To modify the logo and link, edit the function toolFrame() in the main.js file.
ExampleLogo Modification
The example shown in Figure 2-6 replaces the iPlanet logo with a custom logo having different dimensions.
Figure 2-6    Example Corner Logo
Code Example 2-5 shows the necessary changes to be made in file default.html for altering link.
Modifying the Title Graphic and Text
This section describes how to modify the title graphic and the text shown in Figure 2-7.
Figure 2-7    Messenger Express Title Text
You can modify the following on the Messenger Express title graphic and text:
To Modify the Title Graphic and Text
To customize the layout of the title text, edit the function toolFrame() in the main.js file.
ExampleTitle Text Modification
The example shown in Figure 2-8 customizes the text to "Inbox for user."
Figure 2-8    Example Title Text Modification
Code Example 2-6 shows the necessary changes to be made in file main.js to alter the graphic title.
Code Example 2-7 shows the necessary changes to be made file en/i18n.js to alter the title text.
Code Example 2-7    Altering Title Text function i18n_tab_header(user) { return '<nobr> Inbox for ' + user }
Inserting Banners and Links
This section describes how to insert advertisement banners and links on the iPlanet Messenger Express user interface shown in Figure 2-9.
Figure 2-9    Example Inserting Common Banner and Link
You can modify the following on the Messenger Express user interface:
Add a banner and link to appear on all user interface
Add a banner and link to appear only on certain user interface
Edit the function toolFrame() in the main.js file to add a common banner and link.
Edit the function getToolbar() and frameset height in the files comp_fs.html, fldr_fs.html, mbox_fs.html, msg_fs.html, opts_fs.html, and searchmsg_fs.html to add separate banners and links.
ExampleInserting Banners and Links
The example shown in Figure 2-10 inserts a banner and link in the Messenger Express Inbox screen.
Figure 2-10   
Example Inserting a Banner and Link in the Inbox Screen
Code Example 2-8 shows the code before inserting banner and link on all user interface in the main.js file.
Code Example 2-9 shows how to insert a banner and link to the main.js file.
Code Example 2-10 shows the code before inserting banner and link to the Inbox screen, in mbox_fs.html file.
Code Example 2-11 shows how to insert a banner and link to the Inbox screen by editing mbox_fs.html. The banner and link are displayed only on the Inbox screen.
Previous Contents Index Next
Copyright © 2002 Sun Microsystems, Inc. All rights reserved.
Last Updated February 28, 2002