Customizing AdvocateHub Branding

So you’ve got your new AdvocateHub, and you’re excited to get going, but it doesn’t look quite right yet. Maybe your logo would help? What about changing up the colour scheme? It's time to settle in and make yourself at home. 

It’s easy to customize your AdvocateHub with your company logo and colour scheme.

All of these options are options are located in the Branding section of your Hub's settings area. To get there navigate to  Settings > Advocate Program > Branding.

Customizing the Colour Scheme

In the first section of the branding page you will find the colour scheme settings. There are a few preset schemes, but we strongly recommend to use your organization's or advocacy program's branding colours. When specifying your own colours, you will see a preview of the three colours to the left of the colour fields.

Header Background: The colour used in the header of your AdvocateHub.

Primary Colour: The colour used for buttons and accents in your AdvocateHub.

Secondary Colour: The colour used in on the left side of your Hub's sign in page.

Note: You can see a preview of your header colour in the "AdvocateHub Logo" section just below the colour scheme section.

Adding Logos to your AdvocateHub

In the "Upload Logos" section, there are four options. To ensure that the desktop, mobile, and email experience looks the best, you should upload properly formatted logos to all of these sections. 

AdvocateHub Logo

This will appear in the header area of your Hub. 

• Recommended Ratio: 17:1
• Maximum Height: 60px
• Maximum Width: 1024px

By default, this logo will also be used as your email header . If you wish to use a different logo as a header in email communications from your AdvocateHub, select, "Use a different logo for emails" and upload a custom email header.

Social Share and Preview Logo

This logo will appear as the default social share preview image when the AdvocateHub link is shared. Please allow a few hours for the logo preview to update.

Here's an example of the logo preview displayed in Social media platforms:

Email Logo

This will be displayed in emails from your AdvocateHub. If you have not uploaded a different logo for emails, your AdvocateHub logo will be used. Given the different format, we highly recommend uploading a separate email logo.

Note: Click on "Use a different logo for emails" to upload your email logo.

• Maximum Height: 60px
• Maximum Width: 550px

Mobile Logo

This will be displayed on the mobile version of AdvocateHub (i.e when viewed on a mobile device's browser). 

Note: For the best advocate experience, ensure that the mobile logo can be contrasted against a white background.

• Recommended Ratio: 3:1
• Maximum Height: 324px
• Maximum Width: 108px

Favicon: The favicon will be displayed beside your AdvocateHub's title in the browser window / tab's title bar.

Recommended Ratio: 1:1 (All images will be resized to a height of 16px )

The favicon will be displayed beside your AdvocateHub's title in the browser's title bar.

After you have uploaded your files for the logo and favicon, make sure to click  Save Changes at the bottom of the page to save your changes.