Gutenberg – WordPress

Gutenberg er den indbyggede blokeditor i WordPress, der gør det muligt at opbygge og redigere sider i et visuelt miljø via såkaldte “blokke”. Frem for en simpel tekstboks, som man kendte fra tidligere versioner af WordPress, kan du med Gutenberg trække og slippe elementer – fra simple tekstafsnit til komplekse layout-strukturer med kolonner og tabeller – direkte ind på din side. Målet er at give dig fuld kontrol over hjemmesidens indhold og design, uden at du behøver en webudvikler til at foretage enhver lille rettelse.

Siden introduktionen i slutningen af 2018 (med WordPress 5.0) har Gutenberg udviklet sig fra at være et relativt simpelt skriveværktøj til at være en fuldbyrdet motor for hjemmesidedesign. For virksomhedsejere og marketingansvarlige betyder dette en kortere vej fra idé til færdig side, væsentligt hurtigere indlæsningstider og en mere strømlinet redigeringsproces i det daglige arbejde.

Hvad er WordPress Gutenberg helt præcist?

I mange år blev hjemmesider på WordPress styret gennem den såkaldte “Classic Editor”. Denne ældre editor mindede mest af alt om Microsoft Word: et stort, blankt tekstfelt med en række formateringsknapper i toppen. Selvom det system fungerede fint til simple blogindlæg af ren tekst, kom det hurtigt til kort, når der skulle bygges flotte landingssider med avanceret layout som kolonner, billedgallerier, prislister og “Call to Action”-knapper. Dengang krævede det enten komplekse “shortcodes” eller at man installerede tunge tredjeparts “page builders”.

Gutenberg ændrede fundamentalt denne præmis ved at introducere blok-konceptet. Nu eksisterer alt indhold på din side – uanset om det er en overskrift, et baggrundsbillede, et video-element eller et citat – i sin helt egen, isolerede blok.

Dette modulære system gør det utroligt nemt at:

• Flytte rundt på elementer og afsnit uden at hele opsætningen bryder sammen.
• Ændre baggrundsfarve, margin og skrifttype på specifikke, individuelle sektioner.
• Dele og genbruge indhold på tværs af flere forskellige sider på websitet.

Det vigtigste at forstå er, at Gutenberg ikke er et ekstra plugin, du skal ud at investere i; det er selve kernen i nutidens og fremtidens WordPress.

Blokke: Byggeklodserne på dit website

For at mestre Gutenberg skal du forstå konceptet bag en blok. Hver gang du trykker på “Enter” på dit tastatur for at starte et nyt afsnit, opretter Gutenberg automatisk en ny, tom paragraf-blok, som du kan skrive i. Hvis du klikker på det lille ”+” ikon oppe i hjørnet af editoren eller direkte på siden, får du adgang til et massivt bibliotek af specialiserede blokke, der er inddelt i logiske kategorier.

Her er de mest udbredte typer af blokke, du vil arbejde med i det daglige:

1. Tekstblokke: Standard afsnit, overskrifter (H1-H6 til SEO-brug), punktopstillinger, citater og datatabeller.
2. Medieblokke: Enkeltstående billeder, dynamiske gallerier, lydklip, video og vedhæftede filer til download. Du kan nemt uploade medier og justere deres beskæring og størrelse direkte inde i blokken.
3. Design- og layoutblokke: Kolonner (f.eks. til at sætte tekst og billede side om side), grupper til at samle elementer, rækker, afstandsstykker for vertikal luft, og separator-linjer. Disse bruges til at bygge selve “skelettet” på din side.
4. Widgets og dynamisk indhold: Seneste blogindlæg, formularer, indlejring af YouTube-videoer, søgefelter og specialiserede kortkoder.

Når du klikker på en given blok, fremkommer der typisk en lille flydende værktøjslinje lige over den, som giver dig genveje til hurtige formateringer. Samtidig vil du i skærmens højre side få vist et menu-panel, der rummer mere avancerede indstillinger for den valgte blok (f.eks. præcise farvekoder, kantafrunding, typografiske detaljer og padding).

Overgangen fra Classic Editor: Hvad du skal vide

Nogle virksomheder, der har drevet deres hjemmeside i mange år, benytter fortsat den gamle Classic Editor ved at holde et specifikt “Classic Editor” plugin aktivt. Det kan føles trygt at blive i det kendte, men på længere sigt udgør det en direkte begrænsning for websitets ydeevne, dets tekniske sikkerhed og ikke mindst mulighederne for moderne funktionalitet.

Hvis du står over for at skulle slå Classic Editor fra og skifte fuldt ud til Gutenberg, er processen designet til at være gnidningsfri. Når du åbner en eksisterende side med Gutenberg, vil WordPress automatisk genkende det gamle indhold og placere det i én samlet “Classic”-blok. Herfra kan du med et enkelt klik vælge “Konverter til blokke”, hvorefter systemet automatisk opsplitter din lange tekst i individuelle afsnits- og overskriftsblokke.

Vigtigt: Inden du vælger at deaktivere Classic Editor-pluginnet eller laver fundamentale ændringer i, hvordan dit kernesystem fungerer, bør du altid sørge for at have en testet og dugfrisk backup af både din hjemmeside og din database. Skiftet forløber oftest uden de store problemer, men hvis du har et ældre eller specialkodet tema, kan der opstå kompatibilitetsfejl, som forskyder sidens layout. Hvis du finder tekniske ændringer risikable, anbefales det at få hjælp via professionelle WordPress serviceaftaler til at sikre en tryg overgang.

Gutenberg vs. Page Builders (som Elementor og Divi)

Før Gutenberg for alvor fik fodfæste, var tunge tredjeparts “page builders” (som Elementor, Divi og WPBakery) de eneste reelle valgmuligheder for virksomheder, der ønskede avanceret design uden at kode. Disse værktøjer er stadig populære, men de har mærkbare ulemper – især når det handler om webydelse og kodestruktur.

Hvorfor foretrækker flere virksomheder Gutenberg over tunge page builders?

• Hurtigere load-tider (Core Web Vitals): Gutenberg genererer langt renere og markant lettere kode (HTML) end de fleste page builders, der ofte “pakker” simpelt indhold ind i hundredvis af unødvendige kodestykker. En lettere kodebase resulterer i en hurtigere hjemmeside, hvilket er vitalt for både konverteringsrater og Googles vurdering af sitet.
• Indbygget stabilitet: Fordi Gutenberg er en integreret del af selve WordPress-kernen, er du ikke afhængig af, at en ekstern virksomhed husker at udsende sikkerhedsopdateringer og kompatibilitetsrettelser til tiden.
• Undgå “Lock-in” effekten: Vælger du at deaktivere en traditionel page builder, efterlades dit indhold stort set altid som et rodet sammensurium af uigennemskuelige kortkoder (f.eks. [vc_row]...[/vc_row]), som skal renses manuelt. Gutenberg-indhold efterlades som ren og brugbar HTML, som ethvert system kan læse.
• Høj funktionalitet uden licenser: Du får direkte adgang til professionelle layoutfunktioner og designopsætninger, som tidligere påkrævede årlige og til tider dyre premium-abonnementer på plugins.

Det er dog værd at nævne, at page builders stadig har deres berettigelse for nogle virksomheder. Kræver dit design ekstremt avancerede scroll-animationer, tunge visuelle lag eller fuldstændig pixel-perfekt kontrol af hvert element over alle enhedstyper uden en dråbe CSS-erfaring, kan eksempelvis Elementor i visse situationer være mere intuitivt for den enkelte. Men for den generelle SMB-virksomhed, der blot ønsker et professionelt, hastighedsoptimeret og smukt præsentabelt website, er Gutenberg i dag oftest mere end rigeligt.

Synkroniserede mønstre (Genanvendelige blokke)

En af de mest tidsbesparende og kraftfulde funktioner for en marketingafdeling i det daglige er Gutenbergs evne til at gemme specifikke blokke til senere brug.

Synkroniserede mønstre (tidligere kendt som “Genanvendelige blokke”): Forestil dig, at du udarbejder en specifik “Call to Action”-boks indeholdende et nyhedsbrevs-tilmelding, som du gerne vil placere i bunden af alle virksomhedens 40 blogindlæg. I stedet for manuelt at skulle genbygge og tilpasse designet hver gang, designer du den blot én gang og gemmer den i dit bibliotek som et “Synkroniseret mønster”. Du kan herefter nemt indsætte dette færdige mønster alle steder på hjemmesiden. Det geniale er: Ændrer du på et tidspunkt knappens tekst fra “Tilmeld nu” til “Få nyheder” i dit mønster, opdateres det øjeblikkeligt på alle de 40 sider, hvor mønsteret er brugt.

Standard Blokmønstre (Block Patterns): Ud over de synkroniserede elementer finder du “Mønstre”. Mønstre er foruddefinerede layouts sammensat af adskillige blokke – for eksempel en imponerende fuldskærms-header med tekst, knapper og baggrundsbillede, eller måske en detaljeret prissætningstabel i tre kolonner. Rigtig mange moderne temaer inkluderer professionelt designede mønstre “ud af boksen”, så du kan sammensætte og lancere en flot designet landingsside på et par minutter blot ved at udvælge 3-4 mønstre fra biblioteket. I modsætning til synkroniserede mønstre fungerer disse helt uafhængigt, når de først er indsat på siden, hvilket betyder, at du frit kan slette eller ændre komponenter i dem, uden det påvirker andre sider.

Fra tekstredigering til Full Site Editing (FSE)

Oprindeligt var formålet med Gutenberg blot at udskifte redigeringsfeltet for indlæg og sider. Men med de seneste års systemopdateringer er projektet skaleret til at omfatte Full Site Editing (FSE).

Hvor du tidligere udelukkende kunne designe indholdet på siden med blokke, mens du var afhængig af temaets stive indstillinger (eller webudvikleren) for at ændre udseendet på din header, din menu og din footer, giver FSE dig nu mulighed for at redigere hele hjemmesidens globale struktur udelukkende ved hjælp af blokke.

Hvis virksomheden benytter et tema, der understøtter FSE (kaldet et “Block Theme”), betyder det at du kan:

• Opbygge og tilpasse hjemmesidens globale navigation (header) og bund (footer) direkte i editoren uden overhovedet at skulle læse eller rette i PHP-skabeloner.
• Designe grundskabeloner (Templates) for, hvordan eksempelvis blogindlæg konsekvent skal fremstå layoutmæssigt (f.eks. med en forfatterboks fast placeret i højre kolonne).
• Opsætte unikke, varemærketilpassede 404-fejlsider og søgeresultatsider med almindelige Gutenberg-blokke.

Denne tilgang medfører en enorm teknisk uafhængighed. Hvor du førhen var tvunget til at hyre et eksternt bureau bare for at ændre lidt farver i menulinjen eller tilføje et nyt element i footeren, kan disse opgaver nu ofte løses internt af den ansvarlige.

Bedste praksis for virksomheder der bruger Gutenberg

For at få det optimale ud af Gutenberg og bevare en høj ydeevne i driften, bør du følge disse råd:

1. Minimer mængden af ekstra blok-plugins: Selvom der eksisterer tusindvis af gratis udvidelser (plugins), der lover flere bloktyper, bør du være påpasselig. Installér kun dem, du strengt har behov for. Jo flere “libraries” af blokke du tvinger WordPress til at indlæse, desto mere forringer du en af Gutenbergs største fordele: Hastigheden.
2. Benyt Listevisning for nem navigation: Når landingssider vokser og fyldes med komplekse grupper og kolonner, kan det være uoverskueligt at klikke på præcis dét ene baggrundselement, du vil redigere. Væn dig til at åbne “Listevisning” (ikonet med tre skrå streger i toppen af skærmen). Herfra kan du se den præcise, trådede struktur for hele siden og nemt trække rundt på blokke uden at skulle “ramme” dem på lærredet.
3. Skriv i Fuldskærm / Distraktionsfri tilstand: Hvis du skal skrive længere, dybdegående artikler, kan de mange paneler omkring indholdet tage fokus. Ved at klikke på valgmulighederne øverst til højre og vælge “Fuld skærm” eller “Distraktionsfri”, fjernes unødige menuer og paneler, så du kan fokusere på teksten.
4. Hold maskinrummet opdateret: WordPress forbedrer løbende Gutenberg betragteligt – særligt hvad angår hastighedsoptimering og nye layout-muligheder. Sørg derfor for, at hjemmesiden altid holdes ved lige og opdateres ansvarligt, eventuelt med professionel WordPress support.
5. Gode SEO-rutiner i medier: Sørg for aktivt at udfylde “alt-tekst” direkte i billedblokkene, når du uploader, og vær opmærksom på at den valgte serverinfrastruktur (for eksempel din udbyder af webhotel) understøtter komprimering. Gutenberg opstiller i sig selv koden optimalt, men serverens ydeevne er mindst ligeså vigtig for brugeroplevelsen.

Gutenberg er ikke kun et tekstbehandlingsværktøj; det er en direkte invitation til hurtigere administration, pænere design og væsentlig bedre webydelse for din virksomhed. Det kræver kort tilvænning, hvis man kommer direkte fra den klassiske editor, men udbyttet på den anden side er en strømlinet og fremtidssikret hjemmeside.