Changing Logo and Colors in the WTC and Login Page

Rebranding the Web Transfer Client  (WTC) is a common request from customers. This topic provides the procedures for changing the logo and colors in the Login pages and in the WTC itself.

  • Please make a backup copy of any files that you plan to edit, in case you have to back out your edits.

  • Do not attempt to make changes to the JS or PS files unless you are well versed in doing so. Refer to 11520, Upgrading from v7 to v8: WTC - Workspaces Customizations for more information.

  • You will need to install PowerShell if you don't have it already.

  • When you upgrade from older versions to v8.0.5, the file paths that have changed. There is no longer an \EFTClient\ folder.

The customization folder contains the theme.json file and the customization-theme.ps1 file.

  • theme.json is used to define the colors used in the WTC

  • customization-theme.ps1 is a PowerShell script used to change the colors throughout the product

The procedures below describe how to change the colors, and then run the PowerShell script, as well as changing the logos.

The default colors in the theme.json file are in hexidecimal.

  • "primary":  "#00a8d4", - blue, used for input field outlines, e.g., the border around the password and username boxes

  • "accent": "#7400d4", - purple, used for check boxes

  • "warn":  "#f44336", - red, used as outline for input field errors, such as invalid characters in a password

  • "header": "#232323", light black background

  • "headerText": "#DAE0E2", the light gray text in the header, Web Transfer Client

  • "toolbar": "#FEFEFE", light gray background

  • "toolbarText": "#242424" light black text on the toolbar

To change the colors

  1. Open theme.json in a text editor such as Notepad.

  2. Edit the colors as desired. (You can find color numbers on the Internet or use Adobe PhotoShop to identify the color number.)

  3. Save the changes to theme.json.

  4. Open Windows PowerShell ISE (click Start, then Search to find it).

  5. In PowerShell, open customize-theme.ps1, then click the Run icon.

  6. Go to your WTC address (for example, https:\\mywtc), then click Forgot Password to open the forgot-username window. The text-entry boxes should be displayed in your new colors.

To change the logo

The logo next to Web Transfer Client (as shown above) is called logo.png. You can replace it with your company logo with the same file name (logo.png). The file is located in the \assets\images folders.

This will also change the logo that appears on forgot-username, reset-password (shown above), and other WTC pages.