Managing system themes

Administrators can create themes that define the display of the Contact web interface.

Contact is designed as a fully white-label solution so that it can be rebranded across all portals according to an organisation’s brand.

Add a theme #

1. Click System > Themes on the menu bar. A list of the themes that are already set up is displayed.
   • A default theme is provided, which you can use as a template on which to base the definition of new themes, rather than defining them from scratch. The current default theme is denoted by an asterisk.
2. Click Add. The Theme page is displayed.
3. (Mandatory.) Enter the name of the new theme (up to 100 characters). Any unicode characters are allowed, including whitespace and accented letters. The name must be unique within your organisation. Click OK.A template theme (based on the existing default theme but with a new name) is displayed.
4. To make the new theme the default (template) theme on which to base all new theme definitions, click .
5. To use the theme, click Make Active.
6. To define the colours that are used in the display of the Contact web interface, select the Colours tab, scroll down to the appropriate section and enter the hexadecimal code that identifies the colour to be used, for example, #32CD32 (lime green).
7. To define the images that are used on the web interface, select the Images tab.
   From here, you can define:
   • The logo that is displayed on the login page, its height in pixels (px) and the background image of the login page
   • The logo that is displayed on the topbar, and its height and width (in pixels)
   • The icon that is displayed as a favicon. Depending on the web browser that is used, the favicon might be displayed, for example, in the browser’s address bar, next to the page’s name in a list of bookmarks, or as a desktop icon.
     • To select an image, scroll down to the appropriate section then choose the image from the Media File dropdown list. The images that can be selected depend on the media files that have been uploaded to the system (System > Media Files).
8. To show or hide online help topics for the Contact web interface, select the Help tab. To hide online help, tick the checkbox. To show online help, clear the checkbox.
9. Click Save Changes.

Note: Please see Managing media files for further help with media files.

Delete/Copy/Edit a theme #

1. To delete a theme, select the appropriate theme in the list and click Delete then confirm that you want to delete the theme.
2. To create an exact copy of a theme:
   • Select the appropriate theme in the list.
   • Click Copy.
   • Enter the name of the copy (up to 100 characters) then click OK.
3. To edit the details for a theme, select the appropriate theme in the list, reconfigure the parameters as required then click Save Changes.

Definitions #

• Name: The name of the theme.
• Make Default Company Theme: Click this to make the theme the default (template) theme on which to base all new theme definitions.
• Make Active: Click this to use the selected theme.

Colors Tab:

• Main: The primary and accent colours used on the Contact web interface.
• Page: The colours used in the topbar, sidebar, and login page background.
• Queue Status: The colours used to denote the queue statuses: bad, warning and good. Both the font colour and the background colour can be specified.
• Wallboard
  • Widgets – The colours used for wallboard widgets. These are used for all widgets for which the statistics are not tied to company KPIs.
    • A default font colour and a default background colour can be specified from which clients can set the colour to be used by their particular company. The default values are a black font on a white background.
  • KPI Tolerances – The colours used for widgets for which the statistics are tied to company KPIs to show whether or not KPI thresholds have been breached. Both the font colour and the background colour can be specified. The default colours are:
    • KPI In Tolerance – black font on white background
    • KPI Breached – same as colours defined for Queue Status: bad.
• Agent Status: The colours used to denote the following agent statuses:
  • Alerting
  • Dialling
  • Busy
  • Available
  • Handling webchat
  • Handling email
  • On a call
  • On a break
  • Exceeded break
  • Call failed
  • In wrapup
  • Offline
• Chat Display: The colours used to denote the different messages in a webchat:
  • Message from a customer (remote webclient)
  • Message from an agent
  • Whisper message
  • Chat flow message
  • Link highlight

Images Tab

• Login: The logo that is displayed on the login page, its height in pixels (px), and the background image of the login page.
• Topbar: The logo that is displayed on the page banner, and its height and width (in pixels)
• Favicon: The icon that is displayed as a favicon. Depending on the web browser that is used, the favicon might be displayed, for example, in the browser’s address bar, next to the page’s name in a list of bookmarks, or as a desktop icon.

Help Tab

• Help Display: Whether or not online help topics for the Contact web interface are hidden.