Gutenberg FSE: Framtiden för WordPress-design 2026

Full Site Editing (FSE) lanserades med WordPress 5.9. Tre år senare använder de flesta byråer det fortfarande inte korrekt — och de som gör det har en betydande konkurrensfördel.

Vad FSE faktiskt innebär

Före FSE styrde WordPress-teman huvuden, sidfötter och global layout via PHP-mallar. Gutenberg hanterade endast innehållsområdet. Du kunde redigera dina blogginlägg med block, men din navigering var låst i en PHP-fil.

FSE ändrar det. Med ett blocktema kan varje del av webbplatsen — huvud, sidfot, sidofält, arkivmallar, layout för enskilda inlägg — redigeras i Gutenberg-redigeraren med hjälp av block. Ingen PHP krävs för layoutändringar.

Detta är viktigt för AI-generering eftersom det innebär att hela webbplatsen kan uttryckas som block-JSON. Det finns inget hybridsystem där vissa delar är PHP-mallar och vissa är block. Allt är block, allt är JSON, allt kan genereras och redigeras programmatiskt.

Hur PAGEnza använder FSE

När PAGEnza genererar en webbplats skapar den inte bara en startsida. Den skapar ett komplett blocktema med:

• templates/index.html — standardmallen
• templates/single.html — layout för enskilda inlägg
• templates/archive.html — blogg/kategorilista
• templates/404.html — felsida
• parts/header.html — återanvändbart huvudblock
• parts/footer.html — återanvändbar sidfotsblock
• theme.json — globala stilar (färger, typografi, avstånd)

Alla dessa genereras från samma Design Mandate. Färgpaletten som definieras för startsidan är densamma som används i theme.json globala stilar. Fonttrion som valts för hjälten är densamma som laddas i blocktemats stilmall.

Detta är den avgörande fördelen med FSE för AI-generering: konsistens säkerställs av systemet, inte genom att hoppas att designern kom ihåg att applicera samma font överallt.

theme.json — den viktigaste filen du aldrig har redigerat

theme.json är en konfigurationsfil som definierar det globala designsystemet för ett blocktema. Den styr:

• Färgpalett — namngivna färger som visas i färgväljaren i redigeraren
• Typografi — typsnittsfamiljer, storlekar, radhöjder
• Avstånd — skalningssystemet som används av kontroller för stoppning och marginal
• Radie för kanter — standardvärden för hörnradie
• Layout — innehållsbredd, bred bredd

När PAGEnza genererar en webbplats byggs theme.json programmatiskt från Design Mandate. Färgerna ink, bg1, bg2 och accent registreras som namngivna palettfärger. Fonttrion registreras som typsnittsfamiljer med korrekta Google Fonts @import-URL:er.

Resultatet är att när en kund öppnar Gutenberg-redigeraren för att ändra text, visar färgväljaren exakt de fyra varumärkesfärgerna — inget annat. Fontväljaren visar de tre valda typsnitten. Avståndskontrollerna använder systemets skala. Designsystemet tillämpas på redigerarnivå.

Vad "redigera live i Gutenberg" faktiskt innebär

Varje webbplats som genereras av PAGEnza är en live WordPress-installation med Gutenberg FSE aktiv. Kunden kan:

• Klicka på valfri text och redigera den direkt
• Ändra sektionsbakgrunder genom att klicka och välja från varumärkesfärgpaletten
• Ändra ordning på sektioner genom att dra block
• Lägga till nya sektioner från blockinfogaren
• Ändra bilder genom att klicka på platshållaren

De kan inte av misstag bryta designsystemet genom att välja en färg utanför varumärket, eftersom de enda tillgängliga färgerna är de fyra varumärkesfärgerna. De kan inte välja en felaktig font, eftersom endast de tre varumärkesfontsen är registrerade.

Detta är vad som gör AI-genererade webbplatser praktiska för verkliga kunder — de begränsningar som gör designen fungerande bevaras efter överlämning.

Problemet med blocktäckning

FSE är kraftfullt, men det har ett täckningsproblem. Inte alla designmönster kan uttryckas rent i kärn-Gutenberg-block. Komplexa layouter, interaktiva komponenter och anpassade datavisningar kräver ofta anpassade block eller tredjepartsplugins.

PAGEnza hanterar detta på två sätt:

För layout: vi använder en kombination av Group, Cover, Columns och Media & Text-block med noggrant kontrollerade attribut. Cirka 95% av marknadsföringssideslayouter kan uppnås med enbart dessa fyra blocktyper.

För interaktiva komponenter: Plugin Builder genererar anpassade Gutenberg-block som PHP-plugins. En prislista, ett bokningsformulär, en testimonial-slider — dessa genereras som riktiga registrerade block som integreras med FSE-redigeraren, inte kortkoder som fästs vid sidan.

Målet är att allt en kund behöver redigera är redigerbart i den visuella redigeraren, utan att röra vid kod.