Customize branding for each tenant

Contents[Hide]

1. Overview

Multi-tenancy enables you to use a single application instance to serve multiple tenants (where each tenant is one of your clients) whose users are isolated from other tenants and see only the appropriate content and data.

This article shows you how to apply further customization to multi-tenant instances at the application level and at the dashboard level so that users belonging to different tenants see different branding elements, such as logos and color schemes, or other customizations.

Tip
If you are also providing different URLs for each tenant to use, you can also set up External Application URI Overrides.

2. Application styling resources

System administrators can add custom CSS styles, JavaScript, and HTML by editing the application styling resources through the Administration interface, as shown in the article on white labeling.

In the case of tenant-specific resources, you can follow the same steps except to add separate styling for each tenant.

2.1. Adding tenant resources

Access Administration from the main menu, expand Setup and then click App Styling.

Application styling
Application styling

A list of application styling resources is displayed on the right.

On an instance with multiple tenants, you can click Add New in the toolbar to add a new resource that is specific to a tenant.

Add a tenant resource
Add a tenant resource

In the Application Styling Resource dialog, choose the Resource Kind and then select the Tenant.

Select tenant and resource type
Select tenant and resource type

Click Choose File to select an existing file containing the content, or enter or paste the styling content directly into the dialog.

Select a file, or enter or paste the content
Select a file, or enter or paste the content

Click Submit. A separate tenant resource is now listed, which is now applied the next time one of the tenant's users loads a page.

Tenant resource file
Tenant resource file

2.2. Branding the log on screen

Styling resources pertaining to the log on page are applied by passing in the corresponding tenant ID via query string when navigating there. For example:

http://dbi.example.com:8000/LogOn/?tenantId=bcfad362-12c3-458b-b072-9ea0e4110c4e

2.3. Testing the styling

To test your tenant-specific resources beyond the log on screen, log on with a user account that belongs to the tenant (i.e., the Tenant field is set for this user account). The scripts, styles, and HTML associated with this tenant will be applied.

3. Apply dashboard theme per tenant

When you want to customize the styling of dashboards that are reused between different tenants, an alternative to using the application styling resources described above is to define tenant-specific styles and themes. A simple script can then be used in the Loading action of the shared dashboard to load the appropriate theme.

To use this method, first record the ID of the theme file from its Properties dialog.

Record the ID of the Purple theme
Record the ID of the Purple theme

Next, go to the Properties window when editing the dashboard and add a Loading script action.

In the Script Editor, you can use code like the following:

// Get the user's tenant ID.
var dashboard = this;
var tenID = window.dundas.context.currentSession.tenantId;
if (tenID == 'bcfad362-12c3-458b-b072-9ea0e4110c4e')
{
    // Apply the tenant theme.
    var themeService = window.dundas.context.getService("ThemeService");
    var tenantTheme = themeService.getThemeById("72cd17a0-b63e-4456-98e9-cb7152659bf6");
    tenantTheme.done(function (theme) {
        dashboard.control.applyTheme(theme);
    });
}

Add a dashboard Loading script
Add a dashboard Loading script

To test the dashboard, check it in, log off and log back on as a user that belongs to the tenant, then view the dashboard.

For the example script above, the Purple theme should be automatically applied.

Purple theme is applied to dashboard for this tenant user
Purple theme is applied to dashboard for this tenant user

4. See also

Dundas Data Visualization, Inc.
400-15 Gervais Drive
Toronto, ON, Canada
M3C 1Y8

North America: 1.800.463.1492
International: 1.416.467.5100

Dundas Support Hours:
Phone: 9am-6pm, ET, Mon-Fri
Email: 7am-6pm, ET, Mon-Fri