Centralized Branding for Hushly V3 Hubs

Modified on Mon, 18 Dec 2023 at 07:11 PM

With Centralized Branding on Hushly's V3 Hubs, you can apply the branding from your website including colors, fonts, header, footer, and favicon. Branding can be further enhanced with CSS Code.

In this document, you are going to learn how to apply Centralized Branding to a Hushly V3 Hub.

To set up Centralized Branding, follow the steps below:

  1. From the Left Nav Menu > Hubs.
     
  2. Select the Hub.
    Note: This Hub must be a V3 Hub. Go to Hubs > Options > Version to determine the version of the Hub.

  3. From the Hubs menu on the left, click Options.
  4. Expand the Branding section.

     
  5. Add the Company Logo by clicking the + symbol.

    You can either choose an image from the Library or Upload a File.
    Note: This Logo appears on your ABM Page.

  6. Next, enter the Favicon Url.

    The Favicon is displayed in the tab of your browser window.
     
  7. Add a Branding URL - Click here to learn more about the Branding URL.
     
  8. To replace a specific block on the page and embed the V3 Hub, you will use the Branding Content Selector.
     
    Locate the Branding Content Selector:
    • Go to the Branding URL. 
      The Branding URL will be a page comprised of a Header and a Footer, with a space in between to insert the V3 Hub code. In other cases, any section that is in between can also be replaced. 

    • Right-click anywhere on the Branding URL and select Inspect from the Context Menu to open the Developer Tools panel. Alternatively, you can press Ctrl+Shift+I (or Cmd+Option+I on macOS).

    • Identify the HTML element that you want to replace with the Hushly V3 code. Hover over the elements in the Inspect Tool to see the corresponding HTML code highlighted on the page. Copy the code.

    • Now, go back to the Branding Page on the Hushly app and add the copied code to the Branding Content Selector.
      Important: 
      • Use a dot (".") before a class name to select elements with that class.
      • Use a hash ("#") before an ID name to select the element with that ID.
      • Use only the tag name to select elements based on their tag type.

  9. Click Save

  10. Click on Open to preview the Page.

    You will see the Hub embedded in the Branding Page. 

Next Topic

Adding a Stream

Related Topics
Creating a Hushly V3 Hub
Hushly Themes for V3

Adding Custom Code to your V3 Hub

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article