What We’ll Cover
With any successful business, having consistent branding across all of their platforms is important. With the Branding page, you can create this consistency by adding your brand’s colors and logos.
You can also edit the background images to certain pages and widgets that an associate will see in their Web Office, as well as the rank icons that appear in the Web Office Visual Tree.
Watch the video:
In Web Office Admin, navigate to: Web Office Configuration > Branding
There are four main colors that affect different areas of the Web Office and Corporate Office.
- Main Color: Changes the application bar, headers, and text links.
- Accent Color #1: Changes the buttons and application bars when called from a button.
- Accent Color #2: Changes the selected state, application bar when the action is a pop-up (modal) or temporary window.
- Accent Color #3: Changes the selected item in sidebar list.
Step-by-step guide: How to Add Branding Colors
Logos appear across various locations in the Web Office and Corporate Office, as well.
- Large Logo - Color (230 x 230 PNG): Fully colored logo used on a white background and Login page.
- Small Logo - White (80 x 80 PNG): Typically an all white logo that will be used on a dark backgrounds and the Web Office navigation bar.
- Favicon Logo - Color (32 x 32 PNG): Small logo that will be displayed on the browser tab.
Logos be a PNG file type with the exact pixel specifications above. Alpha channel transparency is recommended. Maximum file size is 2 MB.
Step-by-step guide: How to Add Branding Logos
Add your own custom background images for the Calendar page and widget, associate profile background, and Share Page background.
- Calendar Large Background (2560 x 415 JPG): This will be used as the primary image on the large calendar view on the main Calendar page.
- Calendar Small Background (612 x 344 JPG): This will be used as the primary image on the Home > Calendar widget.
- Profile Background (1000 x 250 JPG): Used as the primary image on the user profile background in the Team Dashboard.
- Share Page Background (1280 x 720 JPG): Used as the background image of the Share page used to display shared Documents and Media.
Must be a compressed JPG. Maximum file size is 2 MB. Each image has pixel specifications above and will only accept images of that exact specification.
Step-by-step guide: How to Add Branding Images to the Web Office
Icons are used for the Visual Tree in the Web Office.
You can upload SVG icons for each rank and customer type. These icons will replace the generic profile shadow image that may be in the Visual Tree for all tree members.
Your ranks and customer types are configured in Corporate Office. Ranks are defined in your compensation plan. For customer types, navigate to: Administration > Advanced Settings > Associate Types.
If there is not an icon added for a rank, it will default to the customer type icon. At minimum, you need to have the customer type icons added.
Step-by-step guide: How to Add Visual Tree Rank Icons
- How to Add Branding Colors
- How to Add Branding Logos
- How to Add Branding Images to the Web Office
- How to Add Visual Tree Rank Icons