Pages og blocks

← Editor-manual

3. Pages og blocks

Sider er hjørnestenen i CMS'et. Hver side er bygget af blocks — genbrugelige indholds-byggesten der kan konfigureres og kombineres frit. Det her er den længste sektion i Editor-manualen, fordi det er det du bruger mest tid på.

Side-typer: Frontpage vs ContentPage

I TesseraCMS findes der to konkrete page-typer (begge subtyper af den generelle Page):

Frontpage

Den ene side der renderer på tenant-roden (/palle_jacobsen). En tenant har præcis én Frontpage. Slug er typisk forside. Hvis du forsøger at navigere til /palle_jacobsen/forside direkte, får du 404 — frontpagen renderer kun på roden.

Frontpages har et mere begrænset block-palette (Hero, Columns, AboutRollup, ContactSection osv.) der er optimeret til en visuelt slående landingsside.

ContentPage

Alle andre sider — om, kontakt, gallerier, manualer, sub-pages osv. Slug bestemmer URL-segmentet. Parent-feltet (valgfrit) gør siden nested under en anden side.

ContentPages har det fulde block-palette inklusiv Text, Image, Spacer, Cta, RollupBlock, FormBlock, DocumentCard, SocialFeed osv.

Slug + parent — hvordan URL'en bygges

URL-tree'et bygges ved at gå op gennem parent-kæden:

slug="om"           parent=""             → /tesseracms/om
slug="medlemmer"    parent="om"           → /tesseracms/om/medlemmer
slug="bestyrelsen"  parent="om"           → /tesseracms/om/bestyrelsen
slug="log-ind"      parent="editor"       → /tesseracms/manualer/editor/log-ind

Regler

  • Slug skal være lowercase ASCII med bindestreger — pages-og-blocks, ikke Pages Og Blocks
  • Slug skal være unikt indenfor tenanten — to sider kan ikke have samme slug, selvom de har forskellige parents
  • Parent skal pege på en eksisterende side — du kan ikke have en kæde der peger på en slettet parent
  • Cykler er forhindret — du kan ikke sætte A som parent af B hvis B er parent af A

Reserverede slugs

Nogle slugs er reserverede fordi de bruges af platformen: admin, api, auth. Du kan ikke oprette sider med disse slugs.

Opret en ny side — step-by-step

  1. Gå til Pages på dashboardet
  2. Klik + Ny side øverst til højre
  3. Udfyld required-felter:
    • Titel — vises som <title> i browser-fanen og som SEO-default. Eksempel: "Om kunstneren"
    • Slug — URL-segmentet. Hvis tom, genereres automatisk fra titlen (Om kunstneren → om-kunstneren)
  4. Valgfrit:
    • Parent — vælg en eksisterende side hvis denne skal være nested
    • SEO-felter — kan udfyldes senere
  5. Klik Opret — du lander på rediger-siden hvor du kan tilføje blocks

Block-paletten

I rediger-vinduet finder du Add block-knappen. Klikker du, åbner et menu med de tilgængelige blocks for den aktuelle side-type:

Layout + struktur

  • Text — markdown-baseret tekst (overskrifter, lister, links, billeder, tabeller). Den mest brugte block.
  • Hero — stor visuel intro typisk øverst. Refererer en Hero-record (oprettes separat under Heroes-modulet)
  • Columns — del indholdet i 1-3 kolonner. Nested blocks går ind i hver kolonne
  • Image — enkelt billede med caption + alt-tekst
  • Spacer — tom vertikal plads (lille/medium/stor)
  • Cta — knap-style call-to-action med tekst + link

Indholds-blocks

  • RollupBlock — embed en eller flere Rollups (se Rollups-sektionen)
  • FormBlock — embed en formular (se Forms-sektionen)
  • DocumentCard / DocumentList / DocumentArchive — visning af PDF/DOCX-records

Social

  • SocialFeed — visning af FeaturedSocialPost-records
  • SocialCTA — ikoner med links til social-kanaler

Custom

  • Custom — fri HTML for sjældne tilfælde. Brug forsigtigt — bryder typografi-konsistens

BlockEditor-UI

Hver block i editoren har følgende kontroller:

  • Drag handle (venstre) — træk for at flytte block op/ned i side-rækkefølgen
  • Block-navn (klikbar overskrift) — fold konfiguration ind/ud
  • Anchor-felt — internt ID til scroll-til-section links (mere om dette nedenfor)
  • Slet (rød) — fjern blocken fra siden (med confirm)
  • Dupliker — lav en kopi lige efter

Når du folder en block ud, ser du dens konfiguration:

  • Text-block: ét stort markdown-felt med live-preview
  • Hero-block: dropdown til at vælge en Hero-record + view-vælger
  • Columns-block: layout-valg (1-2, 2-1, 1-1-1 osv.) + nested block-arrays for hver kolonne

Husk: Auto-save er IKKE aktiveret. Du skal klikke Gem øverst for at gemme ændringer. Hvis du forlader siden med ugemte ændringer, advarer browseren dig.

Anchors og scroll-til-section

Hver block har et valgfrit anchor-felt — et ID der gør det muligt at linke direkte til den block fra andre sider eller fra navigationen:

anchor: "galleri"

Når siden renderes, får blocken id="galleri". Du kan derefter:

  • Linke fra andre sider: [Se galleri](/tesseracms/om#galleri)
  • Linke fra header-menuen: opret et MenuItem med kind: anchor og anchor: "galleri" — fungerer KUN på Frontpage
  • Bruge browser-back-knappen til at hoppe rundt internt

Regler for anchor-navngivning: lowercase, tal og bindestreg. Skal starte med et bogstav. galleri-2026, kontakt, about-me.

SEO-felter

Øverst på rediger-siden finder du tre SEO-felter (alle valgfri):

  • seoTitle — overskriver <title> i browser-fanen og Google-resultatet. Hvis tom, bruges sidens titel. Anbefalet længde: 50-60 tegn
  • seoDescription — meta-description der vises i Google-resultatet. Hvis tom, bruges en automatisk udtræk fra første Text-block. Anbefalet længde: 150-160 tegn
  • seoOgImage — URL til billede der vises når siden deles på Facebook/LinkedIn/Twitter. Brug en URL fra dit Media-bibliotek. Anbefalet størrelse: 1200×630 px

Hvorfor det matter

Google bruger <title> og <meta description> til at vise søgeresultater. Hvis du ikke udfylder SEO-felterne, bruger Google sidens titel og en automatisk udtræk — det er sjældent optimalt.

TesseraCMS tilføjer automatisk JSON-LD structured data (TASK-135) — Article, Organization, BreadcrumbList — så Google kan parse din side korrekt.

Markdown i Text-blocks

Text-block accepterer GitHub-flavored markdown plus et par TesseraCMS-specifikke udvidelser.

Standard markdown

# H1
## H2
### H3

**fed** *kursiv* ***begge***

- punktliste
- punktliste

1. nummereret
2. nummereret

[link-tekst](https://example.com)
[intern](/tesseracms/manualer)

![alt-tekst](https://example.com/billede.jpg)

> blockquote / citat

| Kolonne 1 | Kolonne 2 |
| --------- | --------- |
| Data      | Data      |

TesseraCMS-udvidelser

Cards-syntaks (TASK-105):

::: cards
### Title 1
Body-tekst med [link til mere](/some-page).

### Title 2
For cards med en cover-billede, start linjen med ![alt](url).

![Cover](https://example.com/cover.jpg)
Nu har dette card et cover-billede.

[Read more](/destination)
:::

Hver ###-heading bliver til en card-title. Body kan indeholde almindelig markdown. Hvis sidste linje er et standalone link [text](url), bliver hele cardet klikbar med en CTA-pil.

Eksterne links åbner i ny fane

TesseraCMS rewriter automatisk <a href="https://..."> med target="_blank" rel="noopener noreferrer". Interne links (/...) og anchors (#...) åbner i samme fane.

Gem, Preview, Publicér

Øverst på rediger-siden har du tre knapper:

Gem

Skriver dine ændringer til storage. Siden er stadig i den status den havde (draft eller published). Klik dette ofte — der er ikke auto-save.

Preview

Åbner en preview-pane (TASK-107) ved siden af rediger-vinduet. Du ser sidens rendrerede output med dine ugemte ændringer. Praktisk når du eksperimenterer med blocks før commit.

Publicér

Skifter sidens status til published (hvis den var draft) og gør den synlig på det offentlige site. Publish er instant — der er ingen byggetid eller cache-invalidering at vente på.

Hvis siden allerede er published og du klikker Publicér igen, opdateres bare seneste version live.

Draft vs Published

  • Draft — synlig kun i admin (preview)
  • Published — synlig for besøgende

Draft-sider får 404 på det offentlige site, selvom URL'en findes. Det er din "work in progress"-tilstand.

Almindelige fælder

  • Ugemte ændringer ved navigation: browser-prompt advarer dig, men hvis du klikker OK uden at tænke, taber du ændringerne. Klik Gem først.
  • Slet en side der er referenceret fra navigation: hvis du sletter en ContentPage som et MenuItem peger på, viser menuen "(ingen side valgt)". Fix: gå til Navigation-modulet og fjern eller omdiriger linket først.
  • Slug-collision på rename: hvis du ændrer en sides slug, ændres URL'en. Eksisterende incoming-links bliver til 404'er. Overvej at lade slug stå hvis siden allerede er publiceret.
  • Frontpage-slug ændringer: Frontpage'n renderer på roden uanset slug — så ændring af slug har ingen effekt på public-URL, men kan forvirre admin-navigation.

← Naviger admin-dashboardet · Medie-billeder →

Application Pages — nyt i 2026-06

En subset af content-types kan nu deklareres som Application Pages med required blocks der ikke kan slettes. Bruges til strukturelt-krævede sider som forsider og link-hubs.

Se den dedikerede side Application Pages for fuld guide.