Branding the Panel with Your Logo and Colours
Your customers should see your brand when they log in, not ours. Branding covers your business name, logos, colours and the links in the menu. Your customers get it automatically, and so do their customers if they're resellers too.
Before you start
Have these ready:
- A logo for light backgrounds and one for dark backgrounds: about 80×80 px, as JPEG, SVG or PNG, under 200 KB
- A favicon: 32×32 px, as an .ico file, under 200 KB
- A small icon for when the menu is collapsed: 32×32 px, as JPEG, SVG or PNG
- Optionally, a login page image: 960×1200 px, as JPEG or PNG, under 2 MB
- Your brand colour codes, such as #C62A2F
Step 1: open Branding
Click Settings in the left-hand menu, then click the Branding card. The page has three sections: Organization, Control panel and Styling. Each section has its own Save button, so save before you move on to the next one.
Step 2: your organisation details
- Organization name: your customer-facing brand name
- Support URL: adds a help icon to the menu that links here, such as your support or contact page
- eCommerce URL: adds a Buy package button for your customers, linking to your shop or order page
- System generated emails from address: the address the panel's automatic emails come from. Use one on your own domain.
- Billing URL: adds a billing icon to the menu that links to your billing portal
- Create account URL: adds a "Don't have an account? Sign up" link to the login page
Click Save.
Step 3: logos and the login page
- Default to dark mode: customers start in dark mode, and they can still switch
- Logo: shown on light backgrounds
- Inverse logo: shown on dark backgrounds
- Favicon: the little icon in the browser tab
- Inverse icon: shown when the side menu is collapsed
- Log out destination URL: where people land after logging out, such as your website
- Login page image: replaces the picture on the login page
Click Select next to each image to upload it, then click Save.
Step 4: colours and style
- Font family: the typeface used in the panel
- Border radius: from 0 px for square corners up to 30 px for very rounded ones
- Color: Brand: used for big buttons and status indicators, such as switched-on toggles
- Color: Secondary: used for all other buttons
The preview beside the settings updates as you go, and you can switch it to dark mode to check both. If you don't like the result, Reset to default puts everything back. Click Save when you're happy.
Check it
Open your control panel address in a private browser window to see the login page as a customer would. Then log in as a customer to see the inside.
Troubleshooting
- Your logo upload is refused. Check the file type and size. Logos must be JPEG, SVG or PNG under 200 KB, and the favicon must be an .ico file.
- Changes didn't stick. Each section saves on its own. Go back and click Save in that section.
- Customers still see the old logo. Their browser may be showing a saved copy. Ask them to refresh, or to try a private window.