Branding a Hub

A Hub includes default branding elements and looks as follows:

Branding enhances visual appeal, increases mindshare, and promotes brand recall. Therefore, it follows that branding a Hub is essential. Using Hushly, you can define a Hub's fav icon, header, footer, menu, and content area.

To define your Hub's brand elements:

1. From the Hubs page, select the Hub.
   
   
2. From the Hubs menu, click Branding to view the Hub Branding page. You can select the header background color, main menu text color, button text color, menu background color, button text color, and button background color.
   • Enter the color code using RGB, HEX, or HSB schemes.
   • Use the cursor to select the color.
   • Move the arrow marks to define the color.  
3. Enter the font family that your brand uses for all communications. You can paste the font family details in Font Family. You can refer to Google for Font families.
   • For a generally available font from the Google fonts family, enter the font family name in the Font Family field.
     Example: "Courier New", Courier, monospace
   • For a custom font family, enter the font-family value and the Font Family and URL in the Header section, and Save it:
     Example: Font Family: 'Roboto Slab', serif;
     Header: <link href="  https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap ">
     
     
4. Enter the fav icon URL. The fav icon is displayed in the tab title when you open a web page using a browser’s tab. 
   After adding the fav icon, the browser tab displays the fav icon.  
5. Add a Branding URL - Click here to learn more about the Branding URL
   
6. Click Show Advanced Options to define the head, header, footer, the Cascading Style Sheet (CSS), and JavaScript. Copy the code into the respective windows.
   
   Adding a Head
   Any metadata content can be placed in the Head section, paste the JavaScript code to define a head.
   
   Adding a Header
   Paste HTML code to define a header.
   After Adding a Header
   Adding a Footer
   Paste HTML Code to define a footer.
   After Adding the Footer
   
   Adding a CSS
   Paste the Cascading Style Sheet (CSS) code to configure the display styles on the page.
   After Adding a CSS
   Adding JavaScript
   Paste JavaScript code, if any.
   
   Adding ABM Page Head
   Paste the code, if any. 
7. Click Save. You can preview the Hub page and it looks as follows:
   

Next Topic

Adding a Stream