CSS Customization

Style Intelligence gives you the flexibility to implement your own custom User Portal. (See Integrating the Web User Interface in Integration.) However, in most cases it is easier and less time-consuming to customize the default User Portal. The User Portal consists of a number of pre-configured themes, each of which is a combination of tab styles and color schemes (e.g., Windows-Orange). As described in the Look-and-Feel section, you can easily set the Portal theme in the Enterprise Manager.

Note: Restart the server after you modify a CSS file. Changes that you make to a CSS file may not be visible to the user until the browser cache has been cleared.

However, by replacing the appropriate CSS files, you can also customize these themes. The following CSS files can be modified:

theme.css: Style definitions for the User Portal (excluding the Repository tree).

tree-em.css: Style definitions for the Repository tree in Enterprise Manager.

tree-portal.css: Style definitions for all Repository trees in the User Portal.

These files are located in the sree\WEB-INF\classes\portal\css directory. For example, to display the “active” item in the User Portal Repository tree in bold with a gray background, modify the JSTreeLabel_active class in tree-portal.css as follows:

.JSTreeLabel_active {

   font-size: 11px;

   font-weight: bold;

   background-color: #BBBBBB;

   white-space: nowrap;

}

The server accesses only a single instance of tree-em.css and tree-portal.css. However, you can create a distinct theme.css file for each of the different color schemes available on the 'Global Look-and-Feel' page of Enterprise Manager (see Look-and-Feel).

For example, to customize the Windows-Orange theme, create the directory structure sree/WEB-INF/classes/portal/css/windows/orange/, and place into the windows/orange/ directory a theme.css file containing style definitions for the desired Portal components.

<< 8.2.1 Look-and-Feel © 1996-2013 InetSoft Technology Corporation (v11.5) 8.2.2 Integration >>