Configure a navigation widget

You can configure a navigation widget to display links or buttons to other sites and pages nested directly below the current page's site.

Considerations

  • Nested sites: The widget will not display a site or page nested below the first level below the current site.

Who can do this?

  • Workplace administrators 
  • Site administrators

Set up

  1. In the Page Builder, select New Widget.
  2. From the Widget List, select the handlebars beside the navigation widget to drag and drop the widget into place on the Page Builder. See Widget placement on a page for more information on placing widgets on a page. 
  3. Select the placed widget's Edit button.
  4. Review and make changes to the settings in the Configuration side panel. See the Settings section below for more details. 
  5. In the Configuration side panel, select Save to apply your changes or Cancel to discard them.  
  6. At the top of the Page Builder, select Save Page to save your changes.

Settings

Setting Description
Expand / Collapse (Optional) Select to expand and collapse the configuration side panel for increased visibility. 
Widget Title

(Optional) Enter a title for the widget. The title appears as a heading above the widget's contents to provide context to the widget and structure the page's content with defined sections.

When entering a title, you do so only for the currently selected language. To enter the title for other languages, select the desired language from the Widget Title Languages dropdown and enter a title in Widget Title. 
Widget Title Text Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the title's text.

To enter a hexadecimal color code, use the format: #99FF33
Widget Title Bar Background Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the title bar's background color.

To enter a hexadecimal color code, use the format: #99FF33
Widget Title Languages (Optional) Select a language from the dropdown to enter a Widget Title translation in the currently selected language.
Make Widget Full Width

(Optional) Select to expand the widget to the full width of the available area or page.

 

Widget Layout:

Number of Columns

(Optional) Select the number of columns for the widget. Options include:

  • Auto
  • 1
  • 2
  • 3
  • 4
  • 5

The default value is Auto. 

Widget Style: 

Background Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the widget's background color.

To enter a hexadecimal color code, use the format: #99FF33

Link Style: 

Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the link or button's text color. 

To enter a hexadecimal color code, use the format: #99FF33

Link Style: 

Hover Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the link or button's text color when a mouse hovers above it.

To enter a hexadecimal color code, use the format: #99FF33

Link Style: 

Background Color

(Optional) Select a color swatch from the color palette or enter the color's hexadecimal color code to be used for the button's background color.

To enter a hexadecimal color code, use the format: #99FF33

Link Style: 

Apply Border Radius

 (Optional) Select to apply a rounded border radius to each button. 
Link Display

(Optional) Select a display style for the link or buttons. Options include: 

  • Dense: A minimal amount of space between links and within link items. 
  • Normal: A comfortable amount of space between links and within link items. 
  • Sparse: A generous amount of space between links and within link items. 

Navigation: 

Move

 (Optional) Select the handlebars to drag a link or button to rearrange the display order of the sites and pages. 

Navigation: 

Open in New Tab

 (Optional) Select to allow the site or page to be opened in a new tab in the user's browser.

Navigation: 

Hide

 (Optional) Select to prevent the site or page from being displayed in the widget. 
Configuration Settings

Note:

The digital workplace theme determines the appearance of the widget's content unless a widget setting specifically overrides a theme setting. See the Theme article for more information.

Related to