Wikier

Innsida...

Accordion på wikiside

Detaljer Skriv ut
(Videresendt fra Toggler på wikiside)
Det er flere som koder inn accordion (også kalt toggler eller trekkspill) på wikisider. Dette er ikke en del av malverket for wiki, og NTNU IT anbefaler ikke bruk av accordion på wikisider. 

Samleside om innholdsarbeid på Innsida | Sider merket med wiki

Om accordion

Accordion er en del av malverket på eksterne nettsider, men ikke for wikisider på intranettet. For å legge til en accordion på en wikiside kreves det HTML-kunnskap, og det er lett å gjøre feil i koden. NTNU IT tilbyr ikke brukerstøtte for dette.

Anbefalingen er derfor å ikke bruke accordion på wikisider. Dersom du likevel velger å gjøre det, vær oppmerksom på at nettleserens interne søkefunksjon (Ctrl + F / Cmd + F) ikke finner informasjon som ligger skjult i en accordion når du bruker koden fra denne veiledningen.

Hvis du velger å bruke accordion: Husk at en accordion kun skal inneholde enkel tekst og eventuelt lenker – aldri bilder, tabeller eller video. Accordion er ment for korte tekster og informasjon som henger sammen, men som kan kategoriseres.

 

Slik ser en accordion ut
 

Tittel på meny 1

Innhold

Tittel på meny 2

Innhold

Tittel på meny 3

Innhold

 

Bruk HTML

Wikisiden må være i HTML (ikke Kreole) for at du skal kunne ta i bruk accordion. Dette endrer du nederst på sida. Merk at du mister formatteringen på innholdet når du endrer fra Kreole til HTML vice-a-versa.

 

Koden på accordion

Under finner du koden som du kan legge inn i "source".

Merk at du må tilpasse H-nivå til øvrig innhold på siden. Tittelen på selve sida er H1, og du markerer mellomtitler på nivået under som H2. Det er naturlig å ha en H2-tittel over toggleren som forklarer hva toggleren inneholder. Da blir det naturlig at titlene på hver nedtrekksmeny blir satt som H3. Men dette må du altså tilpasse til øvrig innhold.

 <div class="ntnuToggler">
<h3 class="header toggler-header-collapsed toggler-header">Tittel på meny 1</h3>

<div class="content toggler-content-collapsed ntnuToggler_contents toggler-content">
<p>Innhold</p>
</div>
</div>

<div class="ntnuToggler">
<h3 class="header toggler-header-collapsed toggler-header">Tittel på meny 2</h3>

<div class="content toggler-content-collapsed ntnuToggler_contents toggler-content">
<p>Innhold</p>
</div>
</div>

<div class="ntnuToggler">
<h3 class="header toggler-header-collapsed toggler-header">Tittel på meny 3</h3>

<div class="content toggler-content-collapsed ntnuToggler_contents toggler-content">
<p>Innhold</p>
</div>
</div>
 
 

Se også

4635 Visninger
Målgruppe: Medarbeidere Tema: Web
Tagger
wiki toggler