Modify the topic header widget display
The topic header widget displays the topic and its child topics, including all the connected content associated with the topics. You can configure the instance options to control the appearance of the topic header widget, such as the topic description and the topic banner and icon.
Before you begin
Role required: sp_admin or admin
About this task
You can configure the topic header widget display using the following steps. To edit the banner image, page header, or description, see Create and associate topics.
Procedure
Navigate to All > Self-Service > Employee Center.
The Employee Center home page is displayed.
Click a topic on the primary navigation bar.
The topic page is displayed.
Press and hold the control key, right-click the topic widget, and then select Instance Options.
Topic widget instance options. The HR topic is shown as an example.
- Configure the instance options.
| Instance option | Description |
|---|---|
| Include Description | Description of the topic. Select this check box to show the description for the topic. This check box is selected by default. |
| Primary Display | This setting applies to all the topics. The choices are:- Text Only: Select to display only the topic name. - Icon: Select to display an icon beside the topic name. - Banner: Select to display a banner in the background with the topic name. Default value: Icon |
| Secondary Display | Provides the flexibility to apply this setting only to a select few topics. This setting overrides the primary display setting. The choices are:- Text Only: Select to display only the topic name. - Icon: Select to display an icon beside the topic name. - Banner: Select to display a banner in the background with the topic name. Default value: Banner |
| Select list of topics | Search for and select the topics to which you want to apply the secondary display setting. |
| Banner Background Color | Background color for the banner. The choices are:- Brand Primary - Brand Primary Darker - Brand Primary Lightest - Custom, Enter a hex code Default value: Brand Primary |
| Banner Background Color Hexcode | Specify a hex code for the banner background color. Enter a value in this field only if you select Custom, Enter a hex code in the Banner Background Color field. |
| Banner Image Position | How you want to position the banner in the widget. The choices are: - Left Top - Left Center - Left Bottom - Center Top - Center Center - Center Bottom - Right Top - Right Center - Right Bottom Default value: Center Center |
| Banner Image Display | The choices are:- Scale to fit: Scales the image to fit the entire widget. - Original size: Displays the original image in the widget. Default value: Scale to fit |
| Banner Text Overlay Color | Overlay color for the banner text. The choices are:- Overlay Dark - Overlay Light Default value: Overlay Dark |
| Banner Text Overlay Opacity | Opacity of the banner text overlay. The choices are:- 0 - 0.1 - 0.2 - 0.3 - 0.4 - 0.5 - 0.6 - 0.7 - 0.8 - 0.9 - 1 Select 0 for full transparency and 1 for no transparency. Default value: 0.5 |
| Icon Background Color | Background color for the icon. The choices are:- Background Primary - Background Secondary - Background Tertiary - Custom, Enter a hex code Default value: Background Primary |
| Icon Background Color Hexcode | Specify a hex code for the icon background color. Enter a value in this field only if you select Custom, Enter a hex code in the Icon Background Color field. |
- Click Save.
Parent Topic:Employee Center browse experience widgets