By default, Jacada Interaction Server applications are configured with the following themes:

ApplicationTheme
Agent Application flat-agent
Mobile Web Floating
Web Self Service Breadcrumbs

Several other out-of-the-box themes are available as well.

Mobile Web Theme Options
The following themes for the Mobile Web application that are provided out-of-the-box enable you to select the most appropriate look and feel for your organization's Interactions:

  • Theme A (Flat): This theme provides the option to incorporate your company logo in the top level bar. The navigation buttons (Next and Back) and the customer assistance icons (Help and Contact Us) are part of the menu bar at the bottom of the page.

  • Theme B (Floating): This theme offers a top level bar and a menu bar with a floating effect. The navigation buttons and customer assistance icons are larger and bolder than those in Theme A.

  • Theme C (Rounded): This theme offers a top level bar with a rounded effect, and navigation buttons at the top of the page. The customer assistance buttons are located in the menu bar, at the bottom of the page.

  • Flat-Mobile_RTL: This theme, which is based on the Flat theme, was developed specifically to support proper display of Interactions in right-to-left languages, such as Hebrew and Arabic.
    page.

 

Web Self Service Theme Options
Although a large selection of default themes for the web applications is offered, the Flat theme and the Breadcrumbs theme are most recommended for an aesthetic and usable look and feel to your Interactions. Both themes support a company logo at the top, and feature the Contact Us button at the right upper corner of the page.

  • Flat: This theme displays the breadcrumbs trail in a horizontal bar at the top of the page. The Back and Next navigation buttons are located at the lower left and lower right corners of the page, respectively.



  • Breadcrumbs: This theme features a separate frame for the breadcrumbs trail, at the left side of the page. The breadcrumbs bar is displayed vertically. The navigation buttons (Next and Back) are located at the lower right corner of the page.



  • flat-web-rtl: This theme, which is based on the Flat theme, was developed specifically to support proper display of Interactions in right-to-left languages, such as Hebrew and Arabic.

Selecting a Logo for a Theme
Jacada Interaction Server supports the ability to set your own company logo as part of an application theme. The logo is defined per theme, so if relevant, you may upload different logos for different themes.

The selected logo for a theme is displayed on the Logo tab of the theme. For example:

If no logo is defined for the theme, the Logo tab is empty.

The following procedure explains how to set a logo for a theme. Logos may be set for both default and new (cloned) themes.

Note: Users with a role of Designer are not authorized to set logos.

To set the logo for an application theme: 

  1. From the Resources menu of the Admin Console, select Themes.
    The Themes page opens.
  2. From the Theme Name column, click the link of the relevant theme. Then, at the top of the page, select the Logo tab.
    The Logo tab opens. For example:

  3. Click Upload. Then, from the Open dialog box, navigate to the relevant graphic file, and click Open.

    Note: Supported file formats are .JPG, .GIF and .PNG. For best results, it is recommended to upload a logo of 65 x 45 pixels (or smaller).

    The selected logo is displayed in the Logo tab. For example:

  4. To return to the Themes page, click Close.

Selecting an Application Theme

The theme that is currently defining the look and feel of an application is determined by the Selected theme setting of the application's Client Settings tab. By updating the client settings, you can select a different theme for the Web application, or change the swatch used for the Mobile application.

Customizing Themes
It is possible to create your own customized themes by making a copy of one of the default themes, and then modifying this clone as desired. The workflow for creating a customized theme for an application is summarized in the following steps:

  1. Create an additional theme by duplicating an existing theme. For details, refer to Adding New Themes.
  2. Modify the CSS of the cloned theme. For details, refer to Editing Themes.
  3. From the Applications menu of the Admin Console, apply the new theme to the applications of your choice.

Revision:

Comments