Adding styles to the IBM® Connections style sheet
You can customize the look of the IBM® Connections pages by adding new style definitions in the cascading style sheet and applying that style to different parts of the product user interface.
About this task
Procedure
- Optional: Turn on the customization debugging capability. For more information, see Enabling live user interface customization editing mode.
-
Create a CSS file that is named
custom.css
and store it in the appropriate subdirectory of the customization directory.For example, to change the style of a class in all the applications, you copy the file into the following directory: customizationDir/themes/<theme_name>Theme
For information about how to find out where your customizationDir directory is located, see Determining where to save your customizations.
A custom.css file is present in the WAR file for each application, but the file does not contain any useful content by default, so it is easier to create a new custom.css.
-
Open the .css file in a text editor, and define any new styles that you
want to apply to the product user interface.
You might want to use the default hikariTheme.css file as a resource for styles that are already defined for the application. You can find this file in the following location:
http://server_name/connections/resources/web/com.ibm.oneui3.styles/css/hikariTheme/
- Add new style definitions or edit the style that is specified for the class definition that you copied from the hikariTheme.css file.
- Save and close custom.css file.
- Stop and restart the Common.ear file to pick up the CSS changes.
- To test your style changes, reference your new style from a user interface element, and then refresh your web browser.
- Optional: If you enabled customization debugging in step 1, turn it off when you are ready to publish your changes. For more information, see Enabling live user interface customization editing mode.
- See Post-customization step for information about how to apply your changes permanently.