Een WordPress block theme is een thema dat volledig is opgebouwd uit blokken. Elk template (header, footer, single, archive, 404, zoeken) wordt opgeslagen als een HTML bestand in de mappen /templates en /parts binnen het thema. De hele site kan visueel worden bewerkt in de Site Editor op /wp-admin/site-editor.php zonder PHP te schrijven. Block themes werden geintroduceerd met WordPress 5.9 (januari 2022) en vereisen een theme.json bestand in de root van het thema dat globale stijlen (kleuren, typografie, spacing, layout) in JSON definieert. Het eerste standaard block theme was Twenty Twenty Two (januari 2022), gevolgd door Twenty Twenty Three, Twenty Twenty Four en Twenty Twenty Five (januari 2025). Full Site Editing (FSE) is de paraplu term voor de bewerkingservaring van block themes: Site Editor, globale stijlen, template bewerking, template parts, Navigation block, Query Loop block en het patterns register op wordpress.org/patterns. Block themes bestaan naast klassieke themas (PHP gebaseerd met header.php, footer.php, functions.php en Customizer). Beide werken in WordPress 6.x, maar nieuwe theme ontwikkeling is sinds 2022 overgegaan op block themes.
Wat veranderde in WordPress 5.9 (januari 2022)?
- De Site Editor vervangt de Customizer voor block themes.
- Templates zijn HTML bestanden met blokmarkup (
<!-- wp:paragraph -->), geen PHP. - Het nieuwe bestand
theme.jsondefinieert globale stijlen. - Widget gebieden worden vervangen door template parts en het Navigation block.
- Het Query Loop block vervangt aangepaste WP_Query lussen in de meeste gevallen.
Bestandsstructuur van een block theme
mijn-theme/
style.css
theme.json
functions.php
templates/
index.html
single.html
page.html
archive.html
404.html
search.html
parts/
header.html
footer.html
sidebar.html
patterns/
hero.php
assets/
fonts/, images/, css/, js/Wat bestuurt theme.json?
- settings.color.palette: het kleurenpalet.
- settings.typography.fontFamilies: lettertype families met ingebouwde font face declaraties. Sinds WordPress 6.5 (april 2024) installeert de Font Library Google Fonts lokaal.
- settings.spacing: spacing presets.
- settings.layout: contentSize en wideSize.
- styles: standaard stijlen globaal en per blok.
- customTemplates: extra templates voor de pagina editor.
- templateParts: declareert welke parts beschikbaar zijn.
Block theme tegenover klassiek thema
| Aspect | Klassiek thema | Block theme |
|---|---|---|
| Templates | PHP bestanden | HTML bestanden met blokmarkup |
| Personalisatie | Customizer | Site Editor en globale stijlen |
| Menus | wp_nav_menu() | Navigation block |
| Widgets | register_sidebar() | template parts en blokken |
| Globale stijlen | CSS | theme.json |
| Bewerking | code editor of Customizer | visuele Site Editor |
Hybride themas en block template parts
Tussen klassieke en volledige block themes bestaan hybride themas die FSE stapsgewijs adopteren: theme.json toevoegen, block_template_part() gebruiken of HTML templates in templates/ voor specifieke routes opnemen terwijl PHP behouden blijft voor de rest.
Patterns en het pattern register
Patterns zijn herbruikbare blok layouts. Sinds WordPress 6.0 (mei 2022) kunnen themas patterns leveren als PHP bestanden in patterns/. Het register wordpress.org/patterns bevat meer dan 600 community patterns. Synced patterns (voorheen Reusable Blocks, hernoemd in WordPress 6.3 augustus 2023) bewaren een enkele instantie die overal wordt bijgewerkt.
Block themes en prestaties
- WordPress laadt blok stylesheets alleen voor blokken die daadwerkelijk op een pagina worden gebruikt (sinds WordPress 5.8 augustus 2021).
theme.jsongenereert een inline CSS blok per pagina (5 tot 15 KB).- Navigation block en Query Loop block worden server side gerenderd.
- Twenty Twenty Four scoort ~99 op PageSpeed Mobile bij een basis installatie.
Populaire block themes in 2025
- Twenty Twenty Five: standaard thema van WordPress 6.7 (november 2024).
- Twenty Twenty Four: algemeen thema van januari 2024.
- Blocksy, Kadence, Ollie, Frost, Spectra One, Inspiro.
Migreren van een klassiek thema naar een block theme
- Audit het klassieke thema.
- Kies een basis block theme of genereer een nieuw met
npx @wordpress/create-block-theme. - Migreer het design system naar
theme.json. - Herbouw templates in
templates/. - Herbouw header en footer als template parts.
- Converteer PHP lussen naar Query Loop block of dynamische blokken.
- Test in staging.
Wat InspectWP controleert
InspectWP detecteert welk thema actief is, inclusief block themes, het parent en child thema en of het thema bekende beveiligingsproblemen heeft. Het rapport meldt verouderde themas, ontbrekende theme supports en signalen zoals ontbrekende theme.json op WordPress 6.x die op een klassiek thema duiden.