Rebranding BMC Helix Digital Workplace

As a BMC Helix Digital Workplace administrator, you can rebrand BMC Helix Digital Workplace for your end users. To suit your company's branding, you can change the default logo, background color, and colors for the primary, secondary, and active elements. The rebranding tool, available from the BMC Helix Digital Workplace Admin console, is intuitive and easy to use.

If you are upgrading from a previous version

Since version 19.02, rebranding is performed using the Admin console, and eliminates the need for manually writing the CSS code. All rebranding changes you made in version 19.02 will be migrated to the current version.

However, if you upgrade from a version prior to 19.02, you will have to perform the steps described in this topic, since your existing settings will not be migrated.

Related topic

Deploying clients

Before you begin

If you are using an alternative sign-on process (such as BMC Helix Single Sign-On ), do not rebrand the BMC Helix Digital Workplace login page.

To create image files for rebranding

Create the following graphics files required for rebranding each tenant:

Background image for login page
Main page header logo
Mobile logo

The following table provides guidelines for creating the required images. Create and save the files to a location that you can access from the server.

Graphic	Description
Background image for the login page	You can upload only one login page image. For faster loading, use lower resolution images. Example of the background image for the login page image with white background:
Product logo	The logo file that you will upload must meet the following requirements: Supported file formats: JPG, JPEG, PNG, and GIF. The maximum file size is 200 KB The width-to-height ratio should be 1:1 or wider. You can also set a custom width-to-height ratio for the product logo. Recommendation: Transparent PNG, 48H x 80W pixels
Mobile logo	The logo file that you will upload must meet the following requirements: Supported file formats: JPG, JPEG, PNG, and GIF. The maximum file size is 1024 KB. Recommendation: Transparent PNG, 512H x 512W pixels

To rebrand BMC Helix Digital Workplace

You can upload the logo and background images, and choose colors for various elements in the user interface. According to your selections, the BMC Helix Digital Workplace rebranding automatically applies changes to the user interface.

In addition to the steps below, the following video (6:43) describes how to rebrand BMC Helix Digital Workplace:&amp;amp;lt;br/&amp;amp;gt;

https://youtu.be/kiF6r5MNcT0

Log in to the BMC Helix Digital Workplace Admin console, and select Configuration > Branding .

Rebrand the required elements as described in the table following the preview image below.

Tips

To view your changes as they are updated dynamically, use the UI Preview, available on the right.

If you are using a login mechanism (for example, BMC Helix Single Sign-On) that bypasses the BMC Helix Digital Workplace login page, do not customize the login page settings.

Rebranding area	Action
Global Navigation	To change from the default dark global navigation style, select Dark, Light, or Gray.
	To update the product name, type your product name in the Product name field. Tip: If required, you can leave this field blank.
	To update the Product logo, click Add logo, or drag and drop the image file. Workaround for displaying the logo on iOS mobile devices Follow the steps given below to display the product logo in the Safari browser on an iOS device. Rename the image file that has your product logo to apple-touch-icon.png, and copy it to the tenant-custom-res directory. The ID for the default tenant is 000000000000001. If %TOMCAT_HOME%/webapps/tenant-custom-res/ does not exist, create the tenant-custom-res directory, and the copy the image file.
	To update the Favi con for mobile devices, click Attach File, or drag and drop the image file. This image will be used for the icon when users add BMC Helix Digital Workplace to the home screen of their mobile devices. Important The Favicon will not be available on Microsoft Edge.
	To update the Home screen icon for Android device, click Attach file, or drag and drop the image file .
Colors	To update the Primary state color, use the color picker tool, enter a hexadecimal code, or enter the RGB values. Select or clear the Use light text check box for defining the text color. Important When you log in to BMC Helix Digital Workplace , the bottom line of the navigation bar is for a moment displayed in the prior color selected as the Primary state color . For example, the Primary state color is green, you update it to black, then log in to BMC Helix Digital Workplace. The bottom line is green for a moment, but is restored to black shortly.
	To update the Secondary state color, use the color picker tool, enter a hexadecimal code, or enter the RGB values. Select or clear the Use light text check box for defining the text color.
	To update the Active state color, use the color picker tool, enter a hexadecimal code, or enter the RGB values.
Login page	Use Background color to specify the background color for the login page. The gradients (if selected) will be applied to this color. Note: You cannot delete or modify the Powered by BMC inscription at the bottom of the login page.
	(Optional) Use Background: image to select a background image for the login page. Provide the image URL to be used in the background, and select the options to customize the look and feel.
	(Optional) Use Background: linear gradient to configure the linear gradient by specifying one or more of the available settings.
	(Optional) Use Background: radial gradient to configure the radial gradient by specifying one or more of the available settings.

To save your changes, click Apply changes.

To apply customization to the BMC Helix Digital Workplace login

If you use the BMC Helix Digital Workplace login, follow this procedure to apply the customization to the login screen. This procedure uses the CSS files that you generated in To rebrand BMC Helix Digital Workplace. This procedure does not apply if you use an alternative sign-on process, such as BMC Helix Single Sign-On.

On the BMC Helix Digital Workplace server, run the following command:
```
(Windows) list_tenants.bat 
(Linux) list_tenants.sh 
```
The ID for the default tenant is 000000000000001, and the other ID values correspond to the other company tenants.
If %TOMCAT_HOME%/webapps/tenant-custom-res/ does not exist on your BMC Helix Digital Workplace server, create the tenant-custom-res directory.
Copy the CSS files to the tenant-custom-res directory.
Clear the Apache Tomcat cache by deleting the Catalina directory located at C:\Program Files\Apache Software Foundation\Tomcat8.0\work.
Restart the Apache Tomcat server.

To verify rebranding

Open http://localhost:9000/dwp/app in a browser.

Important

In multitenant environments, the login screen is the same for all tenants. To check the rebranding for a specific tenant, log in as a user who belongs to that tenant company.

To hide features from end users

Log in to the BMC Helix Digital Workplace Admin console, and select Configuration > Application Features to enable or disable the following features. For more information, see Enabling end user features.

Where to go from here

Configuring the user interface for BMC Helix Digital Workplace