Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

Defining a portal header

Updated on December 13, 2022
Applicable to Cosmos React and Theme Cosmos applications

Set a header to give your portals a distinct visual identity. By applying an application header (the top bar that spans the entire width of a page), you ensure that users can quickly distinguish between different portals.

Alternatively, you can add a combination of a logo and an icon to the main navigation menu. Each portal has a separate header, and different portals in the same application can use different header styles.
Important: For section-based Theme Cosmos, using the application header requires you to update the theme ruleset to version 04. For more information, see Updating Theme Cosmos in your application.
Header types
The application header is a bar on top of the page. The portal header is displayed on top of the application menu only.
  1. Open your portal:
    1. In the navigation pane of App Studio, click Channels.
    2. In the Current channel interfaces section, click the icon that represents the portal for which you want to edit the header.
  2. On the Configuration tab, in the Logo list, select the type of logo that you want to use:
    Note: When you use Theme Cosmos, the default portal logo is the same as the application logo. If you use a separate logo for your portal, the portal settings take precedence over the application settings. For more information on selecting a logo for your application, see Defining a logo for an application.
    • To use the application logo, select Use default logo.
    • To use a separate logo for your portal, select Custom logo, and then upload the icon you want to use.
  3. Select the header type:
    • To use the application header, select the Display application header checkbox.
    • To use the banner in the navigation menu, clear the Display application header checkbox.
    Note: In Theme Cosmos, the search popover provides a consolidated list of search results in a table. The table supports filtering and is customizable. You can also use a link to open the advanced search results page in a new browser tab.
  4. In the Channel header list, select the name that is displayed in the portal header.
  5. Click Save.

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best.

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us