IBM BPM, V8.0.1, All platforms > Customize and rebranding interfaces > Customize Process Portal

Customize themes in Process Portal

A theme defines the overall structure, appearance, and behavior of Process Portal.

You can customize the standard theme that is provided with Process Portal.

The theme is a powerful set of programming artifacts that you can use to control how Process Portal is displayed. However, for most customization purposes, for example, changing the color or images used, consider modifying CSS rules instead of modifying the theme. Customizing the theme is a much more complex undertaking, and has implications for maintenance, migration, and upgrades to later product versions.

Important: Before you customize the theme, be aware of the following:

• Customizing a theme requires familiarity with HTML, CSS, JavaScript, the iWidget specification, and the Dojo widget library.

• If you customize a theme, any IBM updates to the default theme artifacts will not be applied during regular service or maintenance activities. You must update and maintain customized themes manually.

The Process Portal theme is designed so that it does not appear in Process Portal spaces.

You should therefore make any updates directly in the Process Portal theme and not in a copy of the theme because it might cause problems within Process Portal. However, back up any files that you want to modify so that they can be restored if necessary.

The following files and folders define and control the theme for Process Portal.

Theme files and folders

File or folder name	Description
theme.html	The theme is primarily defined by the theme.html file. This file contains the following types of elements: Markup code Static markup code that defines the overall structure of the page. You can modify this code to customize how the page is structured and organized. JavaScript code JavaScript code that defines page-level scripting logic. You can add additional JavaScript to extend the existing page behavior. Dynamic content spots Special markup that defines where generated content from server-side JavaServer Pages (JSP) files will be added. Administrators use the administrative console to map the content spot identifiers and JSP pages. The following example illustrates a dynamic content spot: <link rel="dynamic-content" href="dyn-cs:id:head@tl:oid:csa2.theme"> You can add, remove, replace, or hide dynamic content spots.
theme.css collaboration.css	The style sheets that control the appearance of the theme. If you plan to make style changes to the theme, you need to either edit these files, or create an additional CSS file. If you create a CSS file, it must be a peer of the theme.css and collaboration.css files, and you must add markup to the theme.html file to include it.
img	This folder contains the images used in the theme.
menuDefinitions metaData	These folders are used internally and should not be modified.

• Elements in the theme for Process Portal
  Before you begin to customize the theme, you need to understand what each element is responsible for and whether you can modify it.

What to do next

To make your changes to the theme available, restart the process server that hosts the Process Portal environment.

Customize Process Portal