Breadcrumbs

Egnet til:

• å vise brukeren hvor de er i sidestrukturen
• å la brukeren hoppe direkte til et nivå som ligger høyere i sidestrukturen

Uegnet til:

• lineær navigasjon i et skjema eller prosess, for eksempel stegene i en StepList.
• tilfeller der du bare har ett eller to nivåer i løsningen. 

Teknisk dokumentasjon

Se Breadcrumbs i Storybook for tekniske detaljer.

Hvordan bruke komponenten  

Plassering

Brødsmulestien skal alltid ligge øverst på siden – rett under toppbanneret og over sidetittelen.

Når skal den vises?

Bruk brødsmulesti på alle sider, unntatt:

• Forsiden
• i stegvis flyt eller prosess der brukeren skal fullføre noe før de kan navigere videre, for eksempel et skjema
  

Dette bidrar til en forutsigbar og oversiktlig navigasjon.

Bruk tilbakelenke i stedet for brødsmulesti når:

• Brukeren befinner seg i en prosess eller et skjema.
• Informasjonsstrukturen har kun ett eller to nivåer.

Eksempel på tilbakelenke: «Gå til Min side».

Innloggede sider:

På innloggede sider skal brødsmulestien alltid starte med Min side, etterfulgt av domenet og eventuelle undersider.

Eksempel på brødsmule på innlogget side

Tilbakelenken på innloggede sider skal gå tilbake til hovedsiden for tjenesten, hvis en slik finnes og hvis ikke, skal den peke tilbake til Min side.

Håndtering av lange brødsmulestier:

Brødsmulestien forkortes automatisk (kollapser) dersom den inneholder mange lenker (standard). Brukeren kan utvide stien ved å trykke på ekspander-ikonet.

Ønsker du å alltid vise hele stien kan du sette shouldCollapse-propen til false.

Plassering i toppen

Universell utforming  

• Komponenten er bygget opp ved hjelp av et <nav>-element, og vil lese opp «Jeg er her» på valgt språk.
• Siste element representerer aktiv eller åpen side som standard. Teknisk sett får elementet da aria-current="page" for å støtte opplesing. Du kan skru av denne mekanismen ved å bruke propen showLastItemAsCurrentPage. 
• På mobil settes fokus til første brødsmule, dersom bruker velger å vise hele stien.