Rebranding the Universal Client
Areas that can be rebranded by using the BMC Digital Workplace Rebranding Tool
Click each tab to view the different areas that you can directly rebrand by using the BMC Digital Workplace Rebranding Tool:
The following image shows different buttons that you can rebrand directly from the BMC Digital Workplace Rebranding tool:
The following image shows various areas of the login page that you can rebrand directly from the BMC Digital Workplace Rebranding Tool:
The following image shows various areas of the top menu bar and side menu bar that you can rebrand directly from the BMC Digital Workplace Rebranding tool:
The rebranding process
Perform the procedures described in this section to rebrand the BMC Digital Workplace Universal Client. These procedures assume a basic knowledge of working with CSS. Although the BMC Digital Workplace Rebranding Tool generates the CSS required for rebranding, having CSS knowledge is essential to make any additional branding changes that are not available in the tool. Perform the following steps sequentially:
- Before you begin
- Step 1: Create a tenant directory
- Step 2: Create graphic files required for rebranding
- Step 3: Rebrand the BMC Digital Workplace Universal Client
- Step 4: Deploy and verify the rebranding changes
Before you begin
Ensure that you have MyIT Admin permissions and can access the BMC Digital Workplace Admin console.
Step 1: Create a tenant directory
For BMC Digital Workplace Cloud, this step is performed by BMC Digital Workplace Cloud operations.
Create the tenant directory in the Apache Tomcat server on the BMC Digital Workplace server computer. This procedure shows the required directory structure, which is /webapps/tenant-custom-res/<tenantDirectory>. If the directory structure is not present, you can create it manually. In single tenant environments the default tenant ID is 000000000000001. In multitenant environments, obtain the tenant IDs for each tenant.
(Optional) To obtain tenant IDs in a multitenant environment
- Configuring-multitenancy.
- Determine the tenant ID for each tenant.
- On the BMC 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.
To create a tenant directory
- If %TOMCAT_HOME%/webapps/tenant-custom-res/ does not yet exist on your BMC Digital Workplace server, create the tenant-custom-res directory.
- Create a new subdirectory in the tenant-custom-res directory, and name it with the ID of the tenant that you want to rebrand.
- If you are not configuring multitenancy, use the default tenant ID 000000000000001 to name the subdirectory.
- If you are configuring multitenancy, use the tenant ID of each tenant to name each subdirectory. For the procedure to obtain tenant IDs, see To obtain tenant IDs in a multitenant environment.
The name of each subdirectory must match the tenant ID of each tenant.
- If you created directories in steps 1 and 2, restart the Apache Tomcat service on the BMC Digital Workplace server.
- Create the graphics required for rebranding.
Step 2: Create graphic files required for rebranding
Create the graphics files required for rebranding for each tenant. The BMC Digital Workplace Rebranding Tool supports graphic file formats such as .png and .jpeg.
You can change the following default graphics available in the BMC Digital Workplace Universal Console directly from the BMC Digital Workplace Rebranding Tool:
- Login page logo image
- Background images for login page
- Main page header logo
You can also change any additional graphics, such as the background image of the main navigation bar or the bell notification icon. However, to change additional graphics, you must must add CSS code in the BMC Digital Workplace Rebranding Tool.
This section provides the following information:
Size guidelines for the rebranding graphics
The following table provides guidelines for creating the rebranding graphics:
To create graphic files required for rebranding
- Create the graphic files required for rebranding each tenant.
- Use the size guidelines to crop each customer name or logo image so that the image is small enough to be inserted into a style block.
Save the logo and background images in a location on your computer.
(Optional) If you are changing any additional graphics, such as the bell notification icon, create custom graphic files and place them in the tenant subdirectory you created earlier. For example 000000000000001 subdirectory, in the %TOMCAT_HOME%/webapps/tenant-custom-res/ directory.
- Rebrand the Universal Client.
Step 3: Rebrand the BMC Digital Workplace Universal Client
Use the BMC Digital Workplace Rebranding Tool to rebrand the BMC Digital Workplace Universal Client for each tenant. You can upload logo and background images, and choose colors of various elements. According to your selections, the BMC Digital Workplace Rebranding Tool automatically generates the CSS code required for rebranding and creates the style-myit.css file. This CSS file defines the design of BMC Digital Workplace Universal Client.
To rebrand the BMC Digital Workplace Universal Client
- Log in to the BMC Digital WorkplaceAdministration Console and navigate to More > Configuration > Rebranding Tool.
From different tabs in the BMC Digital Workplace Rebranding Tool, rebrand various elements in different areas of the BMC Digital Workplace Universal Client.
- To update colors, use the color picker tool or type a hexadecimal code.
- To update a logo image or a background image, browse and upload the image.
- Preview your changes in the images shown at the bottom of the page.
- Click Show compiled CSS to view the code generated in the CSS file for every change you make.
To make any additional changes that are directly not available in the BMC Digital Workplace Rebranding Tool, add the required CSS code in the Add additional CSS styles text box.
The following examples show how you can make additional changes by adding CSS code:- After you make all changes, click Download compiled style-myit.css and save the style-myit.css file to your computer.
- In multitenant environments, repeat steps 1 through 6 for each tenant and generate a separate CSS file for each tenant.
- Deploy and verify the rebranding changes.
Step 4: Deploy and verify the rebranding changes
- Copy the style-myit.css file to the tenant subdirectory in the Apache Tomcat server.
- If you are not configuring multitenancy, copy the style-myit.css file to the %TOMCAT_HOME%/webapps/tenant-custom-res/000000000000001 directory.
- If you are not configuring multitenancy, copy the style-myit.css file generated for each tenant to each respective <tenantDirectory> in the %TOMCAT_HOME%/webapps/tenant-custom-res/ directory.
- Restart the Apache Tomcat server.
- Clear the Apache Tomcat cache by deleting the Catalina directory located at C:\Program Files\Apache Software Foundation\Tomcat8.0\work.
To check your rebranding, open http://localhost:9000/ux/myitapp in a browser.
- If you further modify the style-myit.css file manually, save the file and then refresh the page in the browser.