Version 1.2 Tivoli Integrated Portal 2.2. Tivoli Integrated Portal Customization guide

Version 1.2 Tivoli Integrated Portal 2.2 Tivoli Integrated Portal Customization guide

Version 1.2 Tivoli Integrated Portal 2.2 Tivoli Integrated Portal Customization guide

Note Before using this information and the product it supports, read the information in Notices on page 13. This edition applies to version 2, release 2 of Tivoli Integrated Portal and to all subsequent releases and modifications until otherwise indicated in new editions. Copyright IBM Corporation 2009, 2011. US Government Users Restricted Rights Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.

Contents Customizing the Tivoli Integrated Portal theme and branding......... 1 Creating a custom theme for the portal 3 Applying a custom theme to the portal..... 4 Customizing branding in the portal... 7 Applying your organization's logo to the portal banner................ 7 Configuring custom UI elements........ 8 Hiding the user ID in the portal banner..... 10 Adjusting the portal banner height... 11 Notices.............. 13 Trademarks.............. 14 Index............... 15 Copyright IBM Corp. 2009, 2011 iii

iv Tivoli Integrated Portal Customization guide

Customizing the Tivoli Integrated Portal theme and branding You can create a custom look for your implementation of the Tivoli Integrated Portal by applying your own CSS and image files, so that the portal appearance more closely aligns with your organization's branding requirements. Important: This guide applies only to Tivoli Integrated Portal Version 2.2 and later and the steps contained in the guide do not work for earlier versions. This guide describes how to create custom themes and apply them to the portal. It also outlines how to apply custom branding to the portal. Copyright IBM Corp. 2009, 2011 1

2 Tivoli Integrated Portal Customization guide

Creating a custom theme for the portal In the Tivoli Integrated Portal, you can develop custom themes by applying your own CSS files to the portal. Before you begin Ensure that you have installed, configured, and tested a default implementation of the Tivoli Integrated Portal environment. Attention: Modifications to CSS files are version specific. Any changes that you make cannot be guaranteed to work from one release to the next and are not automatically migrated between versions. About this task To create custom CSS files for your Tivoli Integrated Portal implementation, follow these steps: Procedure 1. Copy the contents of tip_home_dir/profiles/tipprofile/installedapps/ TIPCell/isc.ear/isclite.war/themes/TIPLight to a new directory named tip_home_dir/profiles/tipprofile/installedapps/tipcell/isc.ear/ isclite.war/themes/customtheme. Where CustomTheme is name of the subdirectory that contains your customized theme. Attention: CSS files associated with Internet Explorer are located in a subdirectory named ie. CSS files for other browsers are in a subdirectory named default. Ensure that you copy all of the subdirectories. 2. Edit the CSS files in the relevant subdirectory of the CustomTheme directory to suit your environment. Take care when you are updating CSS files as you can break portal functionality. Whenever you encounter a functional problem, confirm whether the problem also exists when the portal is run using one of the themes native to Tivoli Integrated Portal. Attention: If you run the Tivoli Integrated Portal in load balancing mode, you must copy the CustomTheme directory to all associated servers. Subsequent changes to the CustomTheme directory must also be manually copied to all servers as this directory is not part of the load balancing synchronization process. Copyright IBM Corp. 2009, 2011 3

Applying a custom theme to the portal When you have created a customized theme for your portal implementation, you can apply it by editing a file named customizationproperties.xml. Before you begin Ensure that you have created a customized theme and that it is located in the following directory: tip_home_dir/profiles/tipprofile/installedapps/tipcell/isc.ear/isclite.war/ themes/customtheme Where CustomTheme is name of the subdirectory that contains your customized theme. About this task To apply a custom theme to your Tivoli Integrated Portal environment, complete the following steps: Tip: You can also apply your new theme to the portal through the Settings > Console Preference Profiles panel. Procedure 1. In a text editor, open the following file: tip_home_dir/profiles/tipprofile/config/cells/tipcell/applications/ isc.ear/deployments/isc/isclite.war/web-inf/customizationproperties.xml 2. Locate the following line: <consoleproperties:console-property id="isc.active.theme" value="tiplight"/> 3. Edit the value parameter, so that the line reads as follows: <consoleproperties:console-property id="isc.active.theme" value="customtheme"/> Where CustomTheme is name of the subdirectory that contains your customized theme, which you created in tip_home_dir/profiles/tipprofile/ installedapps/tipcell/isc.ear/isclite.war/themes. 4. Locate the following line: <consoleproperties:console-property id="isc.installed.themes" value="isctheme,tiplight,tipdark"/> 5. Edit the value parameter, so that the line reads as follows: <consoleproperties:console-property id="isc.installed.themes" value="isctheme,tiplight,tipdark,customtheme"/> Attention: If you run the Tivoli Integrated Portal in load balancing mode, you must copy the edited customizationproperties.xml file to all associated servers. Subsequent changes to the customizationproperties.xml file must also be manually copied across all associated servers as this file is not included in the load balancing synchronization process. 6. Stop and restart the Tivoli Integrated Portal Server: a. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v stopserver.bat server1 v stopserver.sh server1 4 Tivoli Integrated Portal Customization guide

Note: On UNIX and Linux systems, you are prompted to provide an administrator username and password. b. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v startserver.bat server1 v startserver.sh server1 Results The portal is now configured to use your customized theme. Note: In a load balanced implementation, you must stop and restart each of the associated Tivoli Integrated Portal Server instances. Tip: If you encounter a problem that may be connected with a customization, before you contact IBM support, ensure that you revert to a default theme to determine if the problem is related to your customized theme. Creating a custom theme for the portal 5

6 Tivoli Integrated Portal Customization guide

Customizing branding in the portal In the Tivoli Integrated Portal, you can apply custom branding to the user interface so that it aligns with your organization's requirements. Applying your organization's logo to the portal banner You can replace the Tivoli brand in the portal banner with your organization's logo. About this task This section applies to the Tivoli logo that is displayed in the portal banner, as shown in Figure 1. Figure 1. Tivoli banner logo To replace the Tivoli logo, complete the following steps: Procedure 1. In a text editor, open the following file: tip_home_dir/profiles/tipprofile/config/cells/tipcell/applications/ isc.ear/deployments/isc/isclite.war/web-inf/customizationproperties.xml 2. Locate the following line: <consoleproperties:console-property id="banner.brand.image" value="../../../iscproxy/images/login/tivoli_logo.gif"/> 3. Edit the value parameter, so that the line reads as follows: <consoleproperties:console-property id="banner.brand.image" value="../../../iscproxy/images/login/your_logo.gif"/> Where your_logo.gif is the file name of your organization's logo image. Important: The logo image file that you specify (your_logo.gif) must be located in the images/login directory associated with the currently active theme. For example, if the active theme is called CustomTheme, then specified file must be located in tip_home_dir/profiles/tipprofile/installedapps/tipcell/ isc.ear/isclite.war/themes/customtheme/images/login/. Important: The following size constraints apply to the replacement logo: Image height Not greater than 30 pixels Image length Not greater than 53 pixels 4. Save your changes. Copyright IBM Corp. 2009, 2011 7

Attention: In a load balanced environment, you should copy the updated customizationproperties.xml file to each of the associated servers. You must also copy the CustomTheme directory, including its subdirectories, to each server in the cluster. Subsequent changes to the customizationproperties.xml file, or to the contents of the CustomTheme directory, must also be manually copied to all servers as these elements are not included in the load balancing synchronization process. 5. Stop and restart the Tivoli Integrated Portal Server: a. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v stopserver.bat server1 v stopserver.sh server1 Configuring custom UI elements Note: On UNIX and Linux systems, you are prompted to provide an administrator username and password. b. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v startserver.bat server1 v startserver.sh server1 You can configure the Tivoli Integrated Portal to use custom UI images from your organization. Custom UI images must maintain the filenames of the images that they are replacing. Before you begin Ensure that you have installed, configured, and tested a default implementation of the Tivoli Integrated Portal environment. You must have already created and applied a custom theme in the portal and the following directory exists in your environment: tip_home_dir/profiles/tipprofile/installedapps/tipcell/isc.ear/isclite.war/ themes/customtheme/images About this task The images being customized in this section are portal related and different from the branding images described in the previous sections, for example, tab and navigation icons, as highlighted in Figure 2 on page 9. 8 Tivoli Integrated Portal Customization guide

Figure 2. Examples of the images that can be customized To configure the portal to use custom image files, complete the following steps: Procedure 1. Add your custom images to the /CustomTheme/images directory. Where CustomTheme reflects the name of your active customized theme directory. Attention: Each custom image that you add to the /CustomTheme/images directory must reflect the exact file name of the image that you are replacing. Attention: If you run the Tivoli Integrated Portal in load balancing mode, you must copy the /CustomTheme/images directory to all associated servers. Subsequent changes to the /CustomTheme/images directory images must also be manually copied to all servers, as this directory is not part of the load balancing synchronization process. 2. Stop and restart the Tivoli Integrated Portal Server: a. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v stopserver.bat server1 v stopserver.sh server1 Note: On UNIX and Linux systems, you are prompted to provide an administrator username and password. b. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v startserver.bat server1 v startserver.sh server1 Results The portal is now configured to use the custom images associated with your custom theme. Attention: In a load balanced implementation, you must stop and restart each of the associated Tivoli Integrated Portal Server instances. Customizing branding in the portal 9

Hiding the user ID in the portal banner You can decide not to show the user ID of the current user in the portal banner. About this task This section applies to the user ID that is displayed in the portal banner, as highlighted in Figure 3. Figure 3. User ID in banner To hide the user ID in the portal banner, complete the following steps: Procedure 1. In a text editor, open the following file: tip_home_dir/profiles/tipprofile/config/cells/tipcell/applications/ isc.ear/deployments/isc/isclite.war/web-inf/customizationproperties.xml 2. Locate the following line: <consoleproperties:console-property id="banner.display.userid" value="true"/> 3. Edit the value parameter, so that the line reads as follows: <consoleproperties:console-property id="banner.display.userid" value="false"/> Attention: If you run the Tivoli Integrated Portal in load balancing mode, you must copy the edited customizationproperties.xml file to all associated servers. Subsequent changes to the customizationproperties.xml file must also be manually copied across all associated servers as this file is not included as part of the load balancing synchronization process. 4. Stop and restart the Tivoli Integrated Portal Server: a. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v stopserver.bat server1 v stopserver.sh server1 Note: On UNIX and Linux systems, you are prompted to provide an administrator username and password. b. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v startserver.bat server1 v startserver.sh server1 What to do next Attention: In a load balanced implementation, you must stop and restart each of the associated Tivoli Integrated Portal Server instances. 10 Tivoli Integrated Portal Customization guide

Adjusting the portal banner height You can adjust the portal banner height to suit your environment, for example, your company logo may not fit when the banner is set to its default height of 34 pixels. About this task To adjust the portal banner height, complete the following steps: Procedure 1. In a text editor, open the following file: tip_home_dir/profiles/tipprofile/config/cells/tipcell/applications/ isc.ear/deployments/isc/isclite.war/web-inf/customizationproperties.xml 2. Locate the following line: <consoleproperties:console-property id="banner.height" value="34"/> 3. Edit the value parameter to adjust the pixel height of the portal banner and save your change. Note: If you make the banner very large (for example, 500 pixels), rendering anomalies may occur. Attention: If you run the Tivoli Integrated Portal in load balancing mode, you must copy the edited customizationproperties.xml file to all associated servers. Subsequent changes to the customizationproperties.xml file must also be manually copied across all associated servers, as this file is not included as part of the load balancing synchronization process. 4. Stop and restart the Tivoli Integrated Portal Server: a. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v stopserver.bat server1 v stopserver.sh server1 Note: On UNIX and Linux systems, you are prompted to provide an administrator username and password. b. In the tip_home_dir/profiles/tipprofile/bin directory, depending on your operating system, enter one of the following commands: v startserver.bat server1 v startserver.sh server1 5. Test that the updated banner height has not introduced any rendering issues in the portal, for example, collapse and expand the navigation pane. Tip: Make sure to test your banner update across all browsers and versions used in your environment. What to do next Attention: In a load balanced implementation, you must stop and restart each of the associated Tivoli Integrated Portal Server instances. Copyright IBM Corp. 2009, 2011 11

12 Tivoli Integrated Portal Customization guide

Notices This information was developed for products and services offered in the U.S.A. IBM may not offer the products, services, or features discussed in this document in other countries. Consult your local IBM representative for information on the products and services currently available in your area. Any reference to an IBM product, program, or service is not intended to state or imply that only that IBM product, program, or service may be used. Any functionally equivalent product, program, or service that does not infringe any IBM intellectual property right may be used instead. However, it is the user's responsibility to evaluate and verify the operation of any non-ibm product, program, or service. IBM may have patents or pending patent applications covering subject matter described in this document. The furnishing of this document does not grant you any license to these patents. You can send license inquiries, in writing, to: IBM Director of Licensing IBM Corporation North Castle Drive Armonk, NY 10504-1785 U.S.A. For license inquiries regarding double-byte (DBCS) information, contact the IBM Intellectual Property Department in your country or send inquiries, in writing, to: IBM World Trade Asia Corporation Licensing 2-31 Roppongi 3-chome, Minato-ku Tokyo 106-0032, Japan The following paragraph does not apply to the United Kingdom or any other country where such provisions are inconsistent with local law: INTERNATIONAL BUSINESS MACHINES CORPORATION PROVIDES THIS PUBLICATION "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. Some states do not allow disclaimer of express or implied warranties in certain transactions, therefore, this statement may not apply to you. This information could include technical inaccuracies or typographical errors. Changes are periodically made to the information herein; these changes will be incorporated in new editions of the publication. IBM may make improvements and/or changes in the product(s) and/or the program(s) described in this publication at any time without notice. Any references in this information to non-ibm Web sites are provided for convenience only and do not in any manner serve as an endorsement of those Web sites. The materials at those Web sites are not part of the materials for this IBM product and use of those Web sites is at your own risk. IBM may use or distribute any of the information you supply in any way it believes appropriate without incurring any obligation to you. Copyright IBM Corp. 2009, 2011 13

All statements regarding IBM's future direction or intent are subject to change or withdrawal without notice, and represent goals and objectives only. COPYRIGHT LICENSE: This information contains sample application programs in source language, which illustrate programming techniques on various operating platforms. You may copy, modify, and distribute these sample programs in any form without payment to IBM, for the purposes of developing, using, marketing or distributing application programs conforming to the application programming interface for the operating platform for which the sample programs are written. These examples have not been thoroughly tested under all conditions. IBM, therefore, cannot guarantee or imply reliability, serviceability, or function of these programs. Trademarks IBM, the IBM logo, and ibm.com are trademarks or registered trademarks of International Business Machines Corp., registered in many jurisdictions worldwide. Other product and service names might be trademarks of IBM or other companies. A current list of IBM trademarks is available on the Web at Copyright and trademark information at www.ibm.com/legal/copytrade.shtml. Internet Explorer is a trademark of Microsoft Corporation in the United States, other countries, or both 14 Tivoli Integrated Portal Customization guide

Index B banner height 11 C custom images 7 themes 1, 3 custom logo 7, 10 I images custom 7 custom logo 7, 10 T themes custom 1, 3 virtual 4 V virtual themes 4 Copyright IBM Corp. 2009, 2011 15

16 Tivoli Integrated Portal Customization guide

Printed in USA