Skip to main content

Website Help

Deutsch Español Français Italiano Português 繁體中文

Help Center

How can we help you?

Search

Breadcrumbs Widget

  • Updated

The Breadcrumbs widget can be added to a site so the site visitor can easily understand their location and explore the site effectively, and as a result improve the site's SEO. The Breadcrumbs widget displays the site hierarchy on a trail based on the user's current location. Breadcrumbs should not be used on sites with flat hierarchies (only 1 or 2 levels deep). In this case, the navigation bar can clearly indicates what section a page lives within.

Note

The Breadcrumbs widget cannot be used in fixed headers. For other header types, the header must be converted to a row before you can add the Breadcrumbs widget. To learn more about the header types, see Headers.

Breadcrumbs displays the names of the following:

  • Pages and sub-pages
  • Folders
  • Dynamic pages
  • Store pages (for native store)
Note

For the Breadcrumbs widget to display dynamic pages, you need to enable the Show on all setting:

  1. In the side panel, click Pages.
  2. Click the gear icon next to the dynamic page.
  3. Click Hide/Show in navigation, and select Show on all.

To add the Breadcrumbs widget:

  1. In the side panel, click Widgets.
  2. Click and drag the Breadcrumbs widget into your site. If you are working in Flex mode, point to the container, and click + to select the Breadcrumbs widget.

To learn more about adding widgets to your site, see Add Widgets.

Content Editor

To access the content editor:

  1. Right-click the widget, and click Edit Content.
  2. Select the items you want visible on the breadcrumbs. You have the following options:
    • Home Page. Always show the home page in the breadcrumbs.
    • Current Page. Show the current page in the breadcrumbs.
    • Hide the breadcrumbs when there isn't a parent page. Enables breadcrumbs for all pages except the homepage or pages on the first level of navigation.

Design Editor

To access the design editor:

  1. Right-click the widget, and click Edit Design.
  2. In the Links section, select the font and text options.
  3. Select a Divider style for the divider between each page in the breadcrumbs.
  4. In the Current Page, Hover, and Folder sections, select a font color and font format.

For information about design options that are not specific to this widget (for example, layout, style, or spacing), see Widget Design.