Portal branding

Portal branding

Maintain your brand's identity in your custom portal with customizable logo, banners, and color selection capabilities. Creating a branded portal helps build a connection with your external users and promotes brand identity and trust. 

Zoho Learn allows you to change the default header logo, banner image, and favicon with your custom images in your custom portal. You can also change the color theme in your portal and customize the navigation tabs.

To change logo preferences:

  1. Navigate to the portal from the Custom Portal tab.
  2. Go to the Branding tab.
  3. Go to the Logo Preferences section.
  4. To display the logo with portal name, select the Logo with portal name option.
  5. To display only the logo, select the Logo only option.
  6. To change the logo image, click the Change button and select an image from your device.
  7. To remove the current logo image, click the Remove button.
  8. View the changes in the Preview section.


To change favicon preferences:

  1. Navigate to the portal from the Custom Portal tab.
  2. Go to the Branding tab.
  3. Go to the Favicon Preferences section.
  4. To change the favicon image, click the Change button and select an image from your device.
  5. To remove the current favicon image, click the Remove button.
  6. View the changes in the Preview section.


To change the color theme:

  1. Navigate to the portal from the Custom Portal tab.
  2. Go to the Branding tab.
  3. Go to the Themes section.
  4. To change to dark mode or light mode, switch the Mode button to Dark or Light.
  5. To select a theme, go to the Pick a Theme section and pick a color theme from the palette.  
  6. To set a custom theme, click Custom, then select the Accent Color, Header Background color, Header Text color, and Selected Tab color.
  7. View the changes in the Preview section, then click Save in the top-right corner.


To customize the navigation tabs:

  1. Customize the navigation of your custom portal in a way that works best for your organization. You can reorder, rename, or hide the default tabs in your portal depending on what resources you want to deliver to your external users.
  2. Navigate to the portal from the Custom Portal tab.
  3. Go to the Branding tab.
  4. Go to the Navigation Tabs section.
  5. To show or hide a tab, select or unselect the tab from the list.
  6. To rename a tab, hover over the tab and click the Edit icon. Type the new name and press Enter.
  7. To rearrange the tabs, drag and drop the tabs.
  8. View the changes in the Preview section, then click Save in the top-right corner.


To change the banner image:

  1. Navigate to the portal from the Custom Portal tab.
  2. Go to the Landing page tab.
  3. Go to the Banner Image section.
  4. Click the Change Banner button and select an image from your device.
  5. Set the Overlay and Text Color for your portal name.
  6. View the changes in the Preview section.
  7. Click Save.



Banner image is only available for public portals.
You have the option to enhance your custom portal by adding a footer section, which will appear at the bottom of your portal. This footer section provides a valuable space for you to convey additional information to your users. You can include both a footer image and footer text in this section.

The footer text can be customized to share any important details or messages you want your learners to know about your portal. For instance, you might use this space to provide a brief overview of your portal, offer contact information or include copyright information or legal disclaimers.

Beyond just adding content, you have the flexibility to personalize the appearance of the footer. You can customize both the background color and the text color of the footer section to ensure it aligns with your portal's overall design and branding.

To add a footer section:

1. Navigate to your custom portal.
2. Click on the Landing Page tab under Customization.
3. Enable the footer option.
4. Click on Upload Image to upload a footer image of your choice.
5. Enter the footer text in the text box provided.
6. Additionally, you can also choose to change the background color of the footer and the footer text color.
7. Click Save.