7.1 Customizing the Branding of the User Interface

Self Service Password Reset includes a flexible theme mechanism that allows for maximum customization of look and branding of the Self Service Password Reset application for your users. You can make the following changes:

  • Change the look and feel of the Self Service Password Reset user interface. Self Service Password Reset provides several standard themes. Each theme is an extension or modification of the default theme.

  • Determine whether to display or hide certain options, buttons, and messages on the user interface.

  • Customize the password guide text.

  • Determine the theme’s language.

You customize Self Service Password Reset through the Configuration Editor.

To configure user interface settings:

  1. Log in to Self Service Password Reset at https://dns-name/sspr as an administrator.

  2. In the toolbar, click your name.

  3. Click Configuration Editor > Settings > User Interface > Look & Feel.

  4. Configure the following settings:

    Interface Theme

    Select an appropriate theme from the list.

    If you select Embedded, the system uses Embedded CSS style sheet and Embedded Mobile CSS style sheet to manage the custom CSS tags. If you select Custom, the system uses Custom CSS Location and Custom Mobile CSS Location.

    Custom CSS Stylesheet Location

    Specify the location and name of the custom style sheet. To implement this setting, you must set Embedded as theme under User Interface > Theme. If this is a relative URL, the system appends it to the context path.

    Self Service Password Reset can enable multiple themes to be used. You can select the theme by adding the theme=themename parameter to the URL. For example, when linking to the Self Service Password Reset Forgotten Password module such as:

    /sspr/public/ForgottenPassword?theme=myCustomTheme
    Custom Mobile CSS Stylesheet Location

    Specify the location and name of the mobile style sheet. To implement this setting, you must set Embedded as theme under User Interface > Theme. If this is a relative URL, the system appends it to the context path.

    Embedded CSS Stylesheet

    Specify the contents of the custom CSS style sheet.

    To implement this setting, you must set Embedded as theme under User Interface > Theme. The contents of this setting can be served from the URL of /public/resources/themes/embed/ssprStyle.css.

    Embedded Mobile CSS Stylesheet

    Specify the contents of the custom mobile CSS style sheet.

    To implement this setting, you must set Embedded as theme under User Interface > Theme. The contents of this setting can be served from the URL of /public/resources/themes/embed/ssprMobileStyle.css.

    Embedded JavaScript

    Provide a JavaScript to include a particular content in all pages inside an HTML tag near the bottom of the page.

    Custom Resource Bundle

    Select Upload File to upload the customized ZIP file that contains static HTTP resources that an application should retrieve from the HTTP path, /public/resources/ to be added to the configuration.

    The maximum limit for the file size is 10 MB. The file must be HTML, text, images, and so on. No server side processing is performed when serving these files.

  5. Click Settings > User Interface > UI Features.

  6. Configure the following settings:

    Enable Showing Masked Fields

    Enable this option if you want to allow users to toggle the Show/ Hide button wherever required. This setting applies to all HTML masked password fields, regardless of the actual data type.

    Mask Password Fields

    Enable this option to hide the input fields with a standard password masking.

    Mask Response Fields

    Enable this setting to mask the challenge-response answers with standard password masking. This setting applies to both setup responses and forgotten password response entry screens.

    Show Cancel Button

    Enable this option to display the Cancel button to users wherever applicable.

    When users click Cancel, the system sends users to the forward URL (or logout URL if the password has been modified). The Cancel button does not appear on the Change Password screen if:

    • The password is expired

    • JavaScript is not enabled in the browser

    Show Success Pages

    Select this option to enable Self Service Password Reset to display success messages when an activity completes successfully.

    Show Login Page Options

    Select this option to display the Forgotten Password and other options on the Login page.

    Show Logout Button

    Select this option to display the Log Out button to an authenticated user.

    Show Home Button

    Select this option to display the Home button to an authenticated user.

    Show Idle Timeout Counter

    Select this option to display the user's remaining idle time. When that time reaches zero, the system redirects the user to the logout page.

  7. Select Save changes.