Client Portal White Labelling
This guide describes how the partners of Berkeley can be branded.
If they do not provide theme colors – the default unbranded theme will be used. If they do not provide a subdomain, then Berkeley will select one for them.
All of the Client Side Applications in the Platform can be white labeled.
There are 2 components to the White labeling setup for a Company. The Theme File which determines the colors and assets used in the applications, and the Sub Domain that the applications will be served under.
Each Company that signs up for the Platform will be asked to supply a subdomain, and theme colors. If they do not provide theme colors then they will use the default unbranded theme. If they do not provide a subdomain, then we will select one for them.
Companies will NOT be able to use their own domain name for the applications.
Theme Colors/Images
When a company is onboarded they will be asked to supply us with the following theme colors and images.
Name | Description | Data Type |
Logo | company logo in png format | file |
Favicon | 64x64 pixel company favicon displayed in browser tabs | file |
Background Color | Color displayed for: Authorization screens (login, register, reset password, etc) in client and cardholder portal. All virtual card screens. | string as a hex or rgb color |
Header Background | color displayed in header for all private screens in the client and cardholder portal. | string as a hex or rgb color |
Header Text | For text within the header for all screens | string as a hex or rgb color |
Title colour | For title (h3) text elements within all screens | string as a hex or rgb color |
Text colour | For all other text elements within all screens | string as a hex or rgb color |
Primary colour | To be used for primary buttons, links, and is used within the date picker | string as a hex or rgb color |
Primary Text | Text color for primary elements Not required and defaults to white (#FFFFFF) Good to use if a primary color needs a dark text color within it for accessibility reasons | string as a hex or rgb color |
Secondary colour | To be used for secondary buttons and links | string as a hex or rgb color |
Secondary Text | Text color for secondary elements Not required and defaults to white (#FFFFFF) Good to use if a secondary color needs a dark text color within it for accessibility reasons | string as a hex or rgb color |
Tertiary | For: Widget icons on dashboard in Cardholder Portal Side navigation bar icons in Client Portal * Background color of side navigation in Cardholder Portal on smaller screens. | string as a hex or rgb color |
Footer Text | For issuer statement and terms and conditions and privacy policy links on: Authorization screens (login, register, reset password, etc) in client and cardholder portal. All virtual card screens. | string as a hex or rgb color |
Virtual Card Text | Text that sits on top of a company’s virtual card image. | string as a hex or rgb color |
Sub Domains
Each new company will need to determine which subdomain they would like their application to be served under.
Sub domains are a first come first serve basis and it is a one to one link for a subdomain to a company.
For Example, say we have a client Acme Bank.
Acme Bank could choose the subdomain acme
if no other company is using that yet. Once the subdomain acme
is setup for Acme Bank no other company can use that subdomain.
The same subdomain is used for all applications in the platform. For example (client portal, cardholder portal, virtual card, etc).
The subdomain is stored on the company record. And will be used to help decide the theme to use for an application.
The client will also receive a white labeled site in the staging environment with their custom subdomain followed by .staging
. For example the subdomain for Acme Bank would look like acme.staging.payhubportal.io
Updated over 2 years ago