Skip to Content
SettingsAddonsCard design schemaElement typesBreadcrumb

This element renders the path where a certain file or document is stored. All the steps can be selected and each of them leads to the folder or location it shows.​​​​​​​

Interface

interface IBreadcrumb extends IElement {
  path: string;
  root?: string;
  siteTitle?: string;
  styles?: IBreadcrumbStyles;
}

Example

Breadcrumb
{
  "type": "Breadcrumb",
  "horizontalSeparator": "@eval({urls.fileLocation} || {urls.detailUrl} || {urls.downloadUrl})",
  "path": "@eval({urls.fileLocation} || {urls.detailUrl} || {urls.downloadUrl})",
  "siteTitle": "{siteTitle}",
  "visible": "@eval(window.innerWidth > 540 && ({urls.fileLocation} || {urls.detailUrl} || {urls.downloadUrl}))",
  "styles": {
    "itemLink": {
      "fontSize": "14px",
      "color": "#333",
      "fontWeight": "600",
      "lineHeight": "18px"
    },
    "root": {
      "marginTop": 0,
      "marginLeft": "-8px"
    },
    "chevron": {
      "color": "#333"
    },
    "overflowButton": {
      "color": "#333"
    }
  }
}

Properties

type

Must be “Breadcrumb”.

  • Type: "Breadcrumb"

  • Required: Yes

path

Allows specifying the site path

  • Type: string

  • Required: Yes

root

Allows specifying the root url

  • Type: string

  • Required: No

siteTitle

Site title of the path

  • Type: string

  • Required: No

styles

Allows adding styles and customize the breadcrumb

Last updated on
Accessibility guideColumn