Navigationsfaner og guidede forløb
Navigationsfaner · Sæt navigationsfaner op · Indhold under fanerne · Guidet forløb med navigationsfaner · Guidet forløb med en formular · Spørgsmål, der afhænger af hinanden
Med Navigationsfaner samler du links og indhold under en række faner på en sektionsside. Det giver overblik over et større emne og dets undersider, og du kan linke direkte til en bestemt fane fra andre sider.
Du kan også bruge navigationsfaner til et guidet forløb, hvor brugeren klikker sig frem til netop de oplysninger, der passer til dem. Et guidet forløb kan også laves med en formular, hvor brugeren svarer på spørgsmål og får et svar til sidst.
Artiklen er delt op sådan:
- Sæt navigationsfaner op og Indhold under fanerne – sådan bygger du komponenten.
- Guidet forløb med navigationsfaner – faner med underfaner, der leder brugeren frem til et svar.
- Guidet forløb med en formular – spørgsmål og svar, der afhænger af hinanden.
- Gode råd – sådan gør du forløbet nemt at bruge.
Nederst på siden kan du se eksempler. På billederne af backoffice er der en rød markering om det sted, du skal klikke eller udfylde.
Sæt navigationsfaner op
Navigationsfaner kan kun bruges på sektionssider. Find eller opret den sektionsside, hvor fanerne skal være. Klik på Tilføj indhold, og skriv fx Navig i søgefeltet. Vælg Navigationsfaner.

- Aktiv – når den er slået til, vises komponenten på hjemmesiden. Slår du den fra, bliver komponenten liggende i backoffice uden at blive vist.
- Margin bund – vælg, om der skal være luft under komponenten.
- Sektions baggrundsfarve – vælg, om sektionen skal have en baggrundsfarve.
- Ikon – vælg et ikon, der vises ved overskriften.

- Custom ikon – her kan du i stedet bruge dit eget ikon fra mediearkivet.
- Sektionstitel – overskriften over fanerne. Lader du feltet være tomt, bruges sidens navn.
- Sektions anchor ID – et kort navn uden mellemrum, fx skole. Så kan du linke direkte ned til komponenten fra andre sider.

- Sektionsbeskrivelse – en kort tekst under overskriften.
- Åben første navigationsfane på default – slå den til, hvis indholdet i den første fane skal vises med det samme, når brugeren kommer ind på siden. Er den slået fra, vises fanerne som en række bokse på tværs af siden.
- Indrammet – slå den til, hvis indholdet under fanerne skal samles i én stor ramme. Det gør det tydeligere, hvilke links der hører til hvilken fane.

Slå Tab design: Små knapper til, hvis fanerne skal vises som mindre knapper i stedet for store bokse.
Selve fanerne laver du under Faner. Klik på Tilføj indhold for at oprette en ny fane.

Når du tilføjer en fane, skal du vælge mellem to typer:
- #TabItem – en almindelig fane, hvor du kan lægge links og indhold ind. Det er den, du oftest skal bruge.
- #TabLink – en fane, der kun er et link. Når brugeren klikker på fanen, kommer de direkte videre til en anden side.

- Ikon – vælg et ikon fra ikonbiblioteket, der passer til fanens emne.
- Specielt ikon – billede – brug dit eget ikon fra mediearkivet i stedet. Udfyld kun ét af de to ikonfelter, for et ikon fra ikonbiblioteket bliver vist i stedet for dit eget.
- Overskrift – fanens navn, fx Vuggestuer og dagplejer. Hold den kort.

Du tilføjer flere faner ved at klikke på Tilføj indhold under Faner.
Pas på, når du har en fane åben: Der er også en Tilføj indhold-knap inde i fanen. Den tilføjer indhold til den åbne fane – ikke en ny fane. Brug knappen i niveauet over.
Indhold under fanerne
Inde i hver fane vælger du, hvad der skal vises. Der er to steder at lægge det:
- Linkbokse – links til undersider. De vises altid øverst i fanen.
- Indhold – andre elementer, fx en formular eller et kontaktkort.
Klik på Tilføj indhold under det felt, du vil bruge.

Under Linkbokse kan du vælge mellem:
- Linkkort – et kort med ét link og en kort tekst.
- Linkboks – en boks med flere links.

Klik på Vælg ved Artikelvælger, og vælg den side, kortet skal linke til. Så henter kortet selv sidens overskrift og beskrivelse.
Under Sideikon kan du vælge, om sidens ikon skal vises på kortet. Ikonet vælger du på selve siden under fanen Sideinfo. Du kan også bruge dit eget ikon under Custom ikon.

Vil du selv skrive teksten, lader du Artikelvælger være tom. Skriv i stedet en Overskrift og en kort Tekst, og vælg til sidst, hvor kortet skal linke hen under Link.
OBS: Du kan ikke bruge begge dele. Har du valgt en side i Artikelvælger, bliver dine egne tekster ikke vist.

Under Indhold kan du vælge mellem:
- Formular – fx en tilmelding eller et spørgeskema.
- Linkbokse – automatisk – henter selv links til artiklerne i en mappe, du vælger. Nye artikler i mappen kommer automatisk med.
- Navigationsfaner – nye faner inde i fanen. Det bruges til guidede forløb, se længere nede.
- Kontaktkort – kontaktoplysninger fra mappen med personer og enheder.
- Linkbokse – manuel – mange slags kort og bokse, fx linkkort med billede, CTA-kort, video og citat.
- Tidslinje – en række trin eller begivenheder i rækkefølge.

Formularen skal være oprettet, før du kan sætte den ind. Vælg den under Vælg formular. Du kan skrive en Beskrivelse over formularen, og vælge om den skal stå i midten af fanen (Centrér) og have gennemsigtig baggrund (Transparent baggrund).

Vælg en eller flere kontakter fra mappen med personer og enheder i træstrukturen. Findes kontakten ikke endnu, skal den oprettes først.
Guidet forløb med navigationsfaner
I et guidet faneforløb kan hver fane have sine egne underfaner. Brugeren klikker sig frem trin for trin og ender ved de oplysninger, der passer til netop dem. Forløbet virker som en filtrering, der bygger på spørgsmål i stedet for kategorier.
Det er godt til emner, hvor forskellige brugere har brug for forskellig viden, fx:
- Kontakt og hjælp – hvem skal jeg kontakte, og hvornår er der åbent?
- Vejledninger – trin-for-trin-guides eller forløbet i en byggesag.
- Indhold tilpasset brugerens situation – hvilke muligheder har jeg?
Se et eksempel på Horsens Kommunes side om familie.
Gør dig klart, hvem forløbet er til. Målgruppen afgør, hvad der skal med.
Tegn gerne et lille flowchart, før du går i gang: Hvilke spørgsmål skal brugeren igennem, og hvilket svar ender de med? Svaret kan fx være links til mere viden, kontaktoplysninger eller et forslag til, hvad brugeren kan gøre. Husk, at forskellige veje godt kan føre til det samme svar.
Indsæt komponenten Navigationsfaner på sektionssiden, som beskrevet øverst. Opret derefter fanerne til det første trin under Faner. Hver fane er et svar på det første spørgsmål, fx Borger, Virksomhed og Forening.

Åbn den fane, der skal have underfaner. Klik på Tilføj indhold under Indhold, og vælg Navigationsfaner igen. De nye faner fungerer på samme måde som de første.

Giv underfanerne en Sektionstitel, der hjælper brugeren videre. Et spørgsmål virker godt, fx Hvad drejer din henvendelse sig om?

Opret underfanerne under Faner i den nye komponent. Du kan gentage det i flere niveauer, men hold dig til højst tre niveauer i alt.

I det sidste trin sætter du svaret ind under Linkbokse eller Indhold i fanen – fx:
- Linkbokse, der sender brugeren videre til en side med svaret.
- Kontaktkort med telefonnummer og åbningstider.
- Formular, hvis brugeren skal sende noget ind.
Guidet forløb med en formular
En formular kan også bruges som guidet forløb. Brugeren svarer på en række spørgsmål, og svarene afgør, hvilke spørgsmål der kommer bagefter. Til sidst får brugeren et svar med fx links eller kontaktoplysninger, der passer til deres situation.
Formularer er egentlig lavet til at indsamle oplysninger. Når du bruger dem til et guidet forløb, skal du derfor huske at slå indsendelse af data fra og tilpasse knapteksterne. Det kan du læse om længere nede.
Planlæg forløbet med et flowchart, før du går i gang, ligesom ved navigationsfaner.
Formularerne ligger i menuen øverst i backoffice. Klik på … og vælg Formularer.

Til venstre ser du alle formularer. Her kan du åbne en formular og rette i den senere.

Klik på … ud for mappen med formularer, og vælg Opret. Vælg Ny formular… for at starte med en tom formular.

Klik på Tilføj spørgsmål. Med Tilføj en ny gruppe kan du samle spørgsmål i grupper, så du har bedre overblik i backoffice.

Skriv spørgsmålet i feltet Navn. Har brugeren brug for en forklaring, kan du skrive den i Hjælpetekst.

Under Svartype vælger du, hvordan brugeren svarer. Til et guidet forløb er disse to bedst:
- Single choice – brugeren kan vælge ét svar.
- Multiple choice – brugeren kan vælge flere svar.

Under Værdier skriver du de svar, brugeren kan vælge imellem – ét svar pr. linje.

Selve svaret til brugeren laver du med svartypen Rich text. Her kan du skrive tekst og sætte links ind, så brugeren kommer videre.
Saml gerne alle resultater på en side for sig selv til sidst i forløbet.

Spørgsmål, der afhænger af hinanden
Slå Obligatorisk til, hvis brugeren skal svare på spørgsmålet for at komme videre. Du kan skrive en tekst, der vises, hvis feltet ikke er udfyldt, fx Du skal vælge et svar.

Her bruger du dit flowchart. Slå Betingelser til på det spørgsmål eller resultat, der kun skal vises nogle gange. Vælg, om det skal vises eller skjules, og klik på Tilføj betingelse.
Vælg derefter det tidligere spørgsmål, fx Hvem er du?, og det svar, der skal give adgang, fx Jeg har børn. Så vises spørgsmålet kun for de brugere, der har svaret det.
Tip: Skal et resultat vises efter flere forskellige svar, så vælg, at det skal vises, hvis hvilken som helst af betingelserne passer.
Har brugeren svaret ja til flere ting, vises alle de resultater, der passer. Sådan får brugeren et svar, der er sat sammen til netop dem.
Nederst på formularen finder du Ved indsendelse. Her vælger du, om brugeren skal se en besked eller sendes videre til en side. Klik på Konfigurer workflow for at se, hvad der sker med svarene.

Formularer sender normalt svarene videre på mail. Det er ikke nødvendigt i et guidet forløb. Fjern derfor de trin, der sender svarene videre, så der ikke bliver sendt eller gemt oplysninger, du ikke skal bruge.

Under Besked ved indsendelse skriver du den tekst, brugeren ser til sidst. Der står Thank you fra start, så husk at skrive en dansk tekst.
Vil du i stedet sende brugeren til en bestemt side, vælger du den under Gå til side. Det er altid den samme side, uanset hvad brugeren har svaret. Derfor skal resultaterne stå i formularen som tekst.

Slå Gem besvarelser fra, når formularen bruges som guidet forløb.
Under Etiketter kan du ændre teksterne på knapperne Send, Næste og Forrige. Knappen til at sende kan ikke fjernes. Skriv derfor fx Luk eller Afslut, så det er tydeligt, at forløbet slutter her.

Du kan fordele spørgsmålene på flere sider med knapperne i bjælken øverst. Saml gerne alle resultater på den sidste side. Giv kun sider og grupper en titel, hvis det hjælper brugeren.
Brug Sortér, hvis du vil flytte rundt på spørgsmålene. Træk dem på plads, og afslut sorteringen.
Når formularen er klar, sætter du den ind på en side med komponenten Formular – eller i en fane i navigationsfaner, som beskrevet ovenfor.
Gode råd
Brug højst tre niveauer af faner. Flere niveauer gør det svært at bevare overblikket – især på mobil.
Vælg korte og tydelige titler på fanerne. Lange titler kan blive vist dårligt på små skærme.
Hold dig til ét emne pr. fane. Det giver overblik og gør siden lettere at bruge for alle.
Slå Indrammet til. Det gør det tydeligere, hvilket indhold der hører til hvilken fane – især når der er flere niveauer.
Klik dig selv igennem alle veje i forløbet, før du udgiver det – også på mobil. Tjek, at alle svar fører til et resultat.
Se eksempler på navigationsfaner og guidede forløb her
Herunder ser du et guidet forløb med en formular. Under artiklen ser du eksempler på navigationsfaner.
Eksempel på et guidet forløb med en formular
Her ser du en formular, der er sat op som et guidet forløb. Svar på spørgsmålene, og se hvordan de næste spørgsmål og resultatet ændrer sig efter dine svar.
