White Labeling

Customize your tenant theme as per your company branding, boost your brand visibility, and strengthen customer loyalty using While Labeling.


Let’s understand how to apply white labeling on your IBM webMethods Integration tenant as per your company’s brand identity.

Note
White labeling is at the TENANT LEVEL and only Admin users can create and change the theme. Developer and Custom Role users cannot create and change themes.

Getting Started with White Labeling

To begin with the white labeling process, follow the instructions given below:

  1. Log in to your IBM webMethods Integration tenant.

  2. Navigate to your tenant profile icon located at the top-right corner of the screen and select Settings from the list of options that appear.

    Go to the White Labeling screen.

    From here you can create, modify, and manage the custom themes, which can be applied to your tenant.

Creating a New Theme

Let’s now understand how to create a new theme for white labeling your IBM webMethods Integration tenant. To do so, follow the steps given below:

  1. Navigate to the White Labeling screen.

  2. On the White Labeling screen that appears, click on the New Theme button located at the top-right corner of the screen.

  3. You will be redirected to the following White Label configuration screen where you can add relevant details to create custom themes.

  4. Fill in values for the required fields as per the instructions given below:

    • Theme Name - Provide a suitable name for the theme you want to create.
    • Theme Description - Provide a short description for this theme.
    • Primary Color - Specify the exact hex color code for the color you want to apply on UI header background.
    • Header Text Color - Specify the exact hex color code for the color you want to apply on UI header text.
    • Primary Text Color - Specify the exact hex color code for the color you want to apply on UI text.
    • Link Color - Specify the exact hex color code for UI menu links.
    • Link Border Color - Specify the exact hex color code for the border of UI menu links.
    • Logo -
      • Image - Upload the image you want to display as your tenant logo. The recommended image format is JPEG, PNG, or SVG.
      • Favicon - Upload the favicon you want to associate with your tenant. The recommended favicon format is ICO.
    • Primary Button - Style the primary button as per your choice.
      • Background Color - Specify the exact hex color code for the color you want to apply on button background.
      • Text Color - Specify the exact hex color code for the color you want to apply on button text.
      • Border Color - Specify the exact hex color code for the color you want to apply on button border.
    • Secondary Button - Style the secondary button as per your choice.
      • Background Color - Specify the exact hex color code for the color you want to apply on button background.
      • Text Color - Specify the exact hex color code for the color you want to apply on button text.
      • Border Color - Specify the exact hex color code for the color you want to apply on button border.
    • Footer Text - Provide the text you want to display in the footer of the UI. You can use the given formatting options to customize it as per your requirements.
    • About Page - Provide the content you want to display on the About page (Tenant profile icon -> About). You can use the given formatting options to customize it as per your requirements.
    Note
    The ‘About IBM webMethods Integration’ page will be replaced with this content.

    Whenever you add/modify values for these fields, their outcome will be instantly reflected in the corresponding Preview tab columns. This will give you an idea of how your final theme will look like when applied to your tenant. Once you have filled in all the required details, click on the Save button located at the top-right corner of the screen.

  5. Once you have filled in all the required details, click on the Save button located at the top-right corner of the screen.

    With this, the theme will be successfully created and added to the list of custom themes in the White Labeling Settings screen.

Applying a Theme

Once created, the custom theme can be easily applied to your IBM webMethods Integration tenant.

To do so, follow the steps given below:

  1. Navigate to the White Labeling screen. On the White Labeling screen, you will see a list of existing themes.

  2. Next, click on the vertical ellipsis icon given against the theme you want to apply. From the list of options that appear, select Apply.

  3. On clicking it, the required theme will be applied to IBM webMethods Integration and the desired branding specifications will be reflected on the screen.

    Note
    The currently enabled theme is denoted by the Current label beside the theme name. You can always revert to the previous theme by clicking the Revert Theme button given against the current theme name.

Managing Themes

To view the list of your custom themes, navigate to the White Labeling screen.

Here, along with the theme names and their descriptions, you can see the various control actions which you can use to manage themes.

Let’s glance through the control actions.