Fleksible innholdsblokker

På denne siden viser vi et basisoppsett der vi bruker fleksible innholdsblokker til å bygge innhold.

Scroll ned

https://customer-l2zi3fjpwik79r3f.cloudflarestream.com/05a4b27ae3f1b0d47c8e5d26f7c02b61

Oppbygging

Se på dette som et grunnoppsett for å lage gode komposisjoner og få ut innhold på en god og effektiv måte.

Likevel, spesielle behov dukker sannsynligvis opp som medfører at man må legge til innstillinger, egne layouts eller fields. Om du etter å ha tilpasset Bootstrap og CSS fortsatt ikke kan lage det du trenger med de mulighetene som ligger inne er det helt fint å legge til noe skreddersydd. Husk å lage Templates for innhold man typisk bruker på siden.

Systemet er bygget med følgende struktur:

Header/Section > Layout > Innhold. Dette betyr at man må holde tungen rett i munnen på hvilket nivå man er på i strukturen når man redigerer siden, men gir mye mer fleksibilitet. Og man kan gjenbruke layout og fields på en mye bedre måte.

Systemet gjør at man i praksis kan ende opp med container inne i en container, og dette er korrekt. På denne måten kan man lage hele layouts som ikke fyller hele bredden, men som er bredere enn standard containeren.

Lek med innstillingene på seksjonene og fieldsene så vil man se at det er enormt med muligheter rett ut av boksen. Husk at de fleste innstillingene er skjult bak Layout settings og drevet på fields.

Elementer ved siden av hverandre

Her er et eksempel på tre kolonners layout som eksempelvis kan benyttes til highlights eller lignende.

Overskrift

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Overskrift

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Overskrift

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Kontakter

Her er det brukt en swiper til å liste ut ansatte. Swiperen er fleksbel og kan benyttes til å liste ut forskjellige innholdstyper, eksempelvis ansatte eller artikler. Her kan man supplere med andre type utlistinger og repeatere for å enkelt legge til andre maler og innhold.

Eksempel på en tekstboks med CTA

Her er knapper lagt rett i editoren. Dette gjør man ved å lage en lenke og inne i redigeringsvinduet velge.

Knapp 1Knapp 2

Utlisting av ressurser

Dette er en fleksibel innholdsblokk for å liste ut ressurser. Denne kan brukes til å liste ut alt fra artikler, til undersider og ansatte. Man kan også skru på filtrering og søk om det er relevant.

Arrangement 1

Arrangement 1

Her er en kort beskrivelse til arrangementet.

Sted Tir. 15. april 2025 08:00 - 12:00

Arrangement 2

Arrangement 2

Her er en kort beskrivelse til arrangementet.

Sted Tor. 16. april 2026

Arrangement 3

Arrangement 3

Her er en kort beskrivelse til arrangementet.

Sted Lør. 17. - 18. april 2027

Diagram

Her er et enkelt eksempel med et diagram til høyre. Man kan enkelt lage kake-, stolpe- og linjediagrammer.

Man kan eventuelt enkelt legge til andre typer basert på støttens om ligger i Highcharts. Diagrammene er satt til stilgivning via CSS - det ligger noen basisstiler i site.css.

Skjema

Her kan vi legge inn et CB Field laget av Henning for å fleksibelt bygge skjemaer. Men denne må videreutvikles noe slik at den også tar høyde for type, tilbakemelding ved error, textarea, radios, checks, respnsive størrelser, implementering av Google Recaptcha, med mer. Men det vanskeligste er på plass. Den overstyrer også bootstrap-custom-stilene på siden, noe som også må fikses før deployment.