English version of this page

Faktaboks

Der du har behov for å trekke frem noe av innholdet kan du bruke en faktaboks. Her er de ulike mulighetene som finnes i designet for å legge en faktaboks inn i artikler og arrangement.

Fullbredde faktaboks

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In varius imperdiet nulla, lacinia aliquet augue pharetra id. Aenean cursus dolor in imperdiet cursus. Etiam sed sapien in nisl commodo condimentum fringilla eu mauris. Nullam viverra congue tempus. Vivamus et vulputate arcu, quis posuere leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper vel eros commodo interdum. Donec vitae mi condimentum, tincidunt est at, malesuada elit. Suspendisse potenti.

Slik setter du inn vanlig faktaboks

Legg inn denne koden der du ønsker å sette inn faktaboksen:
<div class="vrtx-facts-container vrtx-container-right info-fullwidth">
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Ekspanderbar faktaboks

Quisque maximus urna quis auctor interdum. Aliquam consectetur porta ligula sed mattis. Morbi odio turpis, mollis in sem et, dictum facilisis erat. Vivamus odio nisl, porttitor ac facilisis sed, tincidunt eget eros. Etiam quis arcu sit amet libero tempor gravida. Integer in ex ex. Donec tristique faucibus porta. Vivamus elementum ornare est ut volutpat. Etiam tincidunt, velit eu cursus vehicula, arcu ipsum posuere lacus, et congue sem massa et nisi. Praesent scelerisque eu erat non blandit. Aenean consectetur egestas dapibus. Integer sodales eros non magna fermentum mattis.

Etiam venenatis at est id ultrices. Donec egestas neque a condimentum condimentum. Duis at mauris a urna ultricies egestas. Fusce feugiat risus eget purus tempus, malesuada interdum nisi vulputate. Maecenas quis vestibulum quam. Suspendisse potenti. Morbi lorem ex, laoreet a orci placerat, commodo bibendum orci. Nunc tempor ac tellus eget feugiat. Sed semper metus in tincidunt volutpat. Vivamus tristique elit vitae lorem porta imperdiet. Nunc ullamcorper vehicula libero, feugiat sollicitudin elit bibendum eget. Etiam efficitur ante a enim lacinia, eget pellentesque justo tincidunt. Morbi in urna quis ipsum gravida posuere.

Slik setter du inn ekspanderbar faktaboks

Legg inn denne koden der du ønsker å sette inn faktaboksen:
<div class="vrtx-facts-container vrtx-container-right toggle-container info-fullwidth">.
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Ekspanderbar faktaboks med bilde

Computer parts lit by the light of a monitor

Ekspanderbar faktaboks med bilde

Slik setter du inn ekspanderbar faktaboks med bilde

Legg inn koden under der du ønsker å sette inn faktaboksen.
Legg inn inn url til bildet du vil ha inn i koden. Bildet må være 690 piksler bredt, høyde kan variere, men 16:9 format er anbefalt.
Kode: <div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img"><p><img alt="Alternativ tekst skrives inn her" src="Her legges bildeURL"/></p>
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Faktaboks med svart bakgrunnsfarge

Fullbredde vanlig faktaboks med svart bakgrunnsfarge

Slik setter du inn vanlig faktaboks med svart bakgrunnsfarge

Legg inn koden der du ønsker å sette inn faktaboksen
<div class="vrtx-facts-container vrtx-container-right info-fullwidth info-black">
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Svart ekspanderbar faktaboks

Slik setter du inn svart ekspanderbar faktaboks

Legg inn denne koden der du ønsker å sette inn faktaboksen:
<div class="vrtx-facts-container vrtx-container-right toggle-container info-fullwidth info-black">
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Svart ekspanderbar faktaboks med bilde

Computer parts lit by the light of a monitor

Ekspanderbar faktaboks med bilde

Slik setter du inn svart ekspanderbar faktaboks med bilde

Legg inn koden under der du ønsker å sette inn faktaboksen.
Legg inn inn url til bildet du vil ha inn i koden. Bildet må være 690 piksler bredt, høyde kan variere, men 16:9 format er anbefalt på uio.no.
Kode: <div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img info-black"><p><img alt="Alternativ tekst skrives inn her" src="Her legges bildeURL"/></p>
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Faktaboks med rød bakgrunnsfarge

Fullbredde vanlig faktaboks med rød bakgrunnsfarge

Slik setter du inn vanlig faktaboks med rød bakgrunnsfarge

Legg inn denne koden der du ønsker å sette inn faktaboksen:
<div class="vrtx-facts-container vrtx-container-right info-fullwidth info-red">
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Rød ekspanderbar faktaboks

Slik setter du inn rød ekspanderbar faktaboks

Legg inn denne koden der du ønsker å sette inn faktaboksen:
<div class="vrtx-facts-container vrtx-container-right toggle-container info-fullwidth info-red">
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Rød ekspanderbar faktaboks med bilde

Computer parts lit by the light of a monitor

Ekspanderbar faktaboks med bilde

Slik setter du inn rød ekspanderbar faktaboks med bilde

Legg inn koden under der du ønsker å sette inn faktaboksen.
Legg inn inn url til bildet du vil ha inn i koden. Bildet må være 690 piksler bredt, høyde kan variere, men 16:9 format er anbefalt på uio.no
Kode: <div class="vrtx-facts-container vrtx-container-left toggle-container info-fullwidth full-width-img info-red"><p><img alt="Alternativ tekst skrives inn her" src="Her legges bildeURL"</p>
Legg inn teksten du ønsker å inkludere i faktaboksen etter koden (vanlig formatering).
Sett inn </div> der du ønsker at faktaboksen skal slutte.

Publisert 29. des. 2021 11:20 - Sist endret 18. okt. 2022 15:11