Gutenberg Editor Guide: Sådan bruger du WordPress blokeditor

Gutenberg Editor Guide: Sådan bruger du WordPress blokeditor

Gutenberg er WordPress' indbyggede blokeditor. Siden den blev introduceret i 2018, har den ændret måden, vi bygger indhold på WordPress – fra simple blog posts til komplette sidelayouts.

I denne guide lærer du alt om Gutenberg: fra de basale blokke til avancerede funktioner der gør dig hurtigere og mere effektiv.

Indholdsfortegnelse

1. Hvad er Gutenberg?
2. Kom godt i gang
3. De vigtigste blokke
4. Arbejd smartere med blokke
5. Mønstre og genbrugelige blokke
6. Full Site Editing
7. Keyboard genveje
8. Gutenberg vs page builders
9. Fejlfinding
10. FAQ

Hvad er Gutenberg?

Gutenberg er WordPress' standardeditor siden version 5.0. Den erstattede den klassiske "TinyMCE" editor med en blok-baseret tilgang.

Før Gutenberg: Du skrev i ét stort tekstfelt med en toolbar øverst – som et Word-dokument.

Med Gutenberg: Alt indhold består af "blokke" – uafhængige elementer du kan flytte, style og genbruge.

Hvorfor hedder den Gutenberg?

Den er opkaldt efter Johannes Gutenberg, opfinderen af den moderne bogtrykkerkunst. Ideen er, at blokke revolutionerer webudvikling ligesom trykpressen revolutionerede bøger.

Fordele ved Gutenberg

• Visuelt: Du ser nogenlunde, hvordan det færdige resultat ser ud
• Fleksibelt: Nemt at flytte rundt på elementer
• Konsistent: Blokke sikrer ensartet styling
• Fremtidssikret: WordPress investerer tungt i Gutenberg

Kom godt i gang

Åbn editoren

1. Gå til Indlæg → Tilføj nyt eller Sider → Tilføj ny
2. Du lander i Gutenberg editoren
3. Klik på det store "+" for at tilføje din første blok

Interface oversigt

Gutenberg har tre hovedområder:

Top toolbar:

• Tilføj blok (+)
• Fortryd/gentag
• Dokumentoversigt
• Udgiv/opdater

Canvas (midten):

• Her skriver og redigerer du
• Hver blok viser sin egen toolbar når valgt

Sidebar (højre):

• Indlæg/Side: Kategori, tags, udgivelsesstatus
• Blok: Indstillinger for den valgte blok

Pro tip: Tryk Ctrl + Shift + , for at skjule sidebaren og få mere plads.

De vigtigste blokke

Tekst-blokke

Afsnit (Paragraph) Den mest brugte blok. Skriv bare tekst direkte – WordPress opretter automatisk afsnit-blokke.

Overskrift (Heading) Vælg niveau (H1-H6). Husk: Kun én H1 per side (typisk titlen).

Liste Punktlister eller nummererede lister. Du kan neste lister ved at trykke Tab.

Citat (Quote) Fremhæv vigtige citater med styling. Fungerer godt til testimonials.

Medie-blokke

Billede Upload, vælg fra mediebibliotek, eller indsæt URL. Husk at udfylde alt-tekst for SEO.

Galleri Vis flere billeder i et grid. Vælg antal kolonner.

Video Embed videoer fra YouTube, Vimeo, eller upload direkte.

Cover Billede med tekst ovenpå – perfekt til hero-sektioner.

Layout-blokke

Kolonner Del indhold i kolonner (op til 6). Hver kolonne kan indeholde andre blokke.

Gruppe Saml blokke i en container. Nyttigt til styling (baggrund, padding).

Afstandsblok (Spacer) Tilføj vertikal plads mellem blokke. Definer højde i pixels.

Separator En vandret streg til at opdele sektioner.

Interaktive blokke

Knap (Button) Opret call-to-action knapper med link.

Tabel Opret simple tabeller. For komplekse tabeller, brug et plugin.

Formular Kræver et plugin som Bit Form, WPForms eller Contact Form 7.

Embed-blokke

Gutenberg kan automatisk embedde indhold fra:

• YouTube, Vimeo, TikTok
• Twitter/X, Instagram, Facebook
• Spotify, SoundCloud
• Google Maps
• Og mange flere...

Bare indsæt URL'en på en tom linje.

Arbejd smartere med blokke

Hurtig indsættelse med /

I stedet for at klikke på "+", skriv / på en tom linje:

• /heading → Overskrift
• /image → Billede
• /columns → Kolonner
• /button → Knap

Det er meget hurtigere når du kender blokkenes navne.

Transformer blokke

Mange blokke kan transformeres til andre:

1. Vælg blokken
2. Klik på blok-ikonet i toolbaren
3. Vælg "Transformer til..."

Eksempler:

• Afsnit → Overskrift, liste, citat
• Liste → Afsnit
• Billede → Galleri, cover

Flyt blokke

Fire måder at flytte blokke:

1. Pile: Klik op/ned pilene i block toolbar
2. Drag & drop: Træk med de 6 prikker
3. Keyboard: Ctrl + Shift + Alt + T/Y
4. List view: Træk i dokumentoversigten

Kopier og indsæt blokke

• Ctrl + C → Kopiér valgt blok
• Ctrl + V → Indsæt
• Ctrl + Shift + D → Duplikér blok

Du kan kopiere blokke mellem forskellige sider/indlæg.

Multi-select

Vælg flere blokke på én gang:

• Hold Shift og klik på start- og slutblok
• Eller brug Shift + pil-taster

Derefter kan du:

• Flytte dem samlet
• Slette dem
• Gruppere dem
• Transformere dem

Mønstre og genbrugelige blokke

Blokmønstre (Patterns)

Mønstre er færdige kombinationer af blokke – et header-layout, en prissidemodul, en testimonial-sektion osv.

Find mønstre:

1. Klik "+" for at tilføje blok
2. Vælg "Mønstre" (Patterns) fanen
3. Gennemse kategorier eller søg

Når du indsætter et mønster, kan du redigere alt frit.

Pro tip: Besøg WordPress Pattern Directory for flere mønstre.

Genbrugelige blokke (Synkroniserede mønstre)

Perfekt til indhold der skal være ens på flere sider – f.eks. en CTA eller kontaktinfo.

Opret genbrugelig blok:

1. Vælg blok(ke)
2. Klik "⋮" → "Opret mønster/genbrugelig blok"
3. Giv den et navn

Brug:

• Indsæt fra mønstre/genbrugelige blokke
• Ændringer synkroniseres automatisk!

Advarsel: Ændrer du en genbrugelig blok, ændres den alle steder. Hvis du vil have en unik kopi, klik "Konverter til almindelige blokke" efter indsættelse.

Full Site Editing

Siden WordPress 5.9 kan Gutenberg redigere hele dit site – ikke kun indhold. Dette kræver et "block theme" (f.eks. Twenty Twenty-Four).

Hvad kan du redigere?

• Header og footer: Logo, navigation, sociale ikoner
• Sideskabeloner: Hvordan blog posts, arkiver osv. vises
• Globale styles: Farver, fonte, spacing for hele sitet

Kom i gang

1. Gå til Udseende → Editor
2. Vælg hvad du vil redigere (templates, parts, styles)
3. Brug blokke som i den normale editor

Er Full Site Editing klar til produktion?

Det afhænger:

• Ja: Simple sites, blogs, brochure sites
• Nej: Komplekse sites der kræver pixel-perfekt kontrol

Mange bruger stadig page builders som Bricks eller Elementor til avancerede layouts.

Keyboard genveje

Bliv hurtigere med disse shortcuts:

Generelle

Blokke

Formatering

Se alle: Klik "⋮" i top toolbar → "Tastaturgenveje"

Gutenberg vs page builders

Hvornår Gutenberg er nok

• Blogs og artikler: Gutenberg er designet til dette
• Simple sider: Om os, kontakt, single pages
• Budgetbevidste: Ingen ekstra plugins/omkostninger
• Performance-fokus: Gutenberg er lettere end page builders

Hvornår du bør vælge en page builder

• Pixel-perfekte designs: Bricks/Elementor giver mere kontrol
• Avancerede layouts: Mega menus, komplekse grids
• Tid: Page builders har ofte færdige templates
• Kunder: Nemmere at låse ned og overlevere

Min anbefaling

Start med Gutenberg. Skift kun til page builder hvis du støder på begrænsninger.

Læs mere: Bricks vs Elementor sammenligning

Fejlfinding

"Min blok virker ikke"

1. Tjek browser-konsol: F12 → Console → se efter fejl
2. Deaktiver plugins: Test med kun standard plugins
3. Ryd cache: Browser cache og eventuelle caching plugins
4. Opdater WordPress: Kør på nyeste version

"Gutenberg er langsom"

• For mange blokke på én side (hold det under 100)
• Tunge plugins der kører i editoren
• Lavt server-memory (hæv PHP memory limit)

"Jeg savner den klassiske editor"

Installer "Classic Editor" plugin. Men overvej at give Gutenberg en chance – det er fremtiden.

"Blok styles ser anderledes ud på frontend"

Dit theme styler måske blokke anderledes. Tjek:

• Theme's editor styles
• CSS der overskriver blok-styling
• Cache der viser gammel version

FAQ

Er Gutenberg bedre end den klassiske editor?

For de fleste, ja. Gutenberg giver mere fleksibilitet og er fremtiden for WordPress. Den klassiske editor bliver ikke videreudviklet.

Kan jeg bruge Gutenberg og en page builder sammen?

Ja, men det giver sjældent mening. Vælg én tilgang for konsistens. Undtagelse: Gutenberg til blog, page builder til landing pages.

Virker mine gamle plugins med Gutenberg?

De fleste plugins er opdateret til Gutenberg. Tjek plugin-beskrivelsen for "Gutenberg compatible" eller "Block Editor ready".

Kan jeg deaktivere Gutenberg?

Ja, med "Classic Editor" plugin. Men WordPress anbefaler at bruge Gutenberg.

Hvad er forskellen på Gutenberg og Full Site Editing?

Gutenberg er blokeditoren. Full Site Editing bruger Gutenberg til at redigere hele sitet (header, footer, templates) – ikke kun indhold.

Har Gutenberg drag-and-drop?

Ja, du kan trække blokke rundt. Men det er ikke lige så frit som page builders – blokke stables stadig vertikalt inden for sektioner.

Næste skridt

Gutenberg bliver bedre for hver WordPress-opdatering. Start med at mestre de basale blokke, lær genvejene, og eksperimentér med mønstre.

Relaterede artikler

• WordPress guide for begyndere
• Bricks vs Elementor
• Sådan vælger du det rigtige theme