{"id":41492,"date":"2022-01-05T21:34:09","date_gmt":"2022-01-05T20:34:09","guid":{"rendered":"https:\/\/kinsta.com\/nl\/?p=41492&#038;preview=true&#038;preview_id=41492"},"modified":"2023-05-23T10:26:33","modified_gmt":"2023-05-23T08:26:33","slug":"twenty-twenty-two-blokthema","status":"publish","type":"post","link":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/","title":{"rendered":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#8217;s"},"content":{"rendered":"<p>Hoewel iets later dan oorspronkelijk gepland, krijgen we een nieuw standaard WordPress thema. De naam is Twenty Twenty-Two!<\/p>\n<p>Het nieuwe standaard WordPress thema wordt geleverd met de <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-9\/\" target=\"_blank\" rel=\"noopener noreferrer\">WordPress 5.9 release<\/a>. We waren nieuwsgierig naar meer over het nieuwe thema, dus installeerden en testten we Twenty Twenty-Two op een <a href=\"https:\/\/kinsta.com\/nl\/devkinsta\/\">lokale ontwikkelomgeving<\/a> met <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-9\/\" target=\"_blank\" rel=\"noopener noreferrer\">WordPress 5.9<\/a>.<\/p>\n<p>We laten je onze resultaten zien voordat we onze gedachten delen om je een diepgaand overzicht te geven van de ins en outs van het nieuwe WordPress thema.<\/p>\n<figure id=\"attachment_110731\" aria-describedby=\"caption-attachment-110731\" style=\"width: 2560px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110731 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2.jpg\" alt=\"Een voorbeeld van Twenty Twenty-Two, het nieuwe standaard WordPress thema\" width=\"2560\" height=\"1752\"><figcaption id=\"caption-attachment-110731\" class=\"wp-caption-text\">Een voorbeeld van Twenty Twenty-Two, het nieuwe standaard WordPress thema (Bron afbeelding: <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">WordPress.org<\/a>)<\/figcaption><\/figure>\n<p><a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">Twenty Twenty-Two <\/a>is ontworpen om het meest flexibele, lichtgewicht en aanpasbare standaardthema ooit te zijn. Het biedt een geweldige speeltuin voor het testen van blokken, patronen en templates.<\/p>\n<p>Omdat het een blokthema is, kun je de full-site editing, global styles, navigatieblokken en de nieuwe afbeeldingsgalerijen, de meest verwachte features van WordPress 5.9, beter verkennen.<\/p>\n<p>We moeten meteen zeggen dat<strong> Twenty Twenty-Two het eerste standaardblokthema is<\/strong>!<\/p>\n<p>Een van de meest ambitieuze doelen van het nieuwe thema is om <strong>gebruikers in hun kracht te zetten<\/strong>. Met zoveel patronen en templates die direct beschikbaar zijn, kunnen gebruikers met slechts een paar klikken complexe lay-outs bouwen. De rest is stijlaanpassing.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-important\">\n            <h3>Important<\/h3>\n        <p>Twenty Twenty-Two wordt uitgebracht met WordPress 5.9. Het thema is op het moment van schrijven nog in ontwikkeling en wat hier wordt gerapporteerd, kan aanzienlijk veranderen v\u00f3\u00f3r de definitieve release.<\/p>\n<\/aside>\n\n<p>Vanuit technisch oogpunt verschilt het schrijven over Twenty Twenty-Two niet veel van het schrijven over de nieuwste en krachtigste features van WordPress 5.9. Maar Twenty Twenty-Two biedt ons een vergrootglas om de nieuwe features voor sitebewerking beter te waarderen en een beter idee te krijgen van de toekomst van het platform.<\/p>\n<p>Dus hier zijn we dan om je voor te stellen aan het nieuwe thema.<\/p>\n<p>Eerst zullen we de <strong>nieuwe sitebewerkingsflow <\/strong>verkennen die gebruikers zullen ervaren met WordPress 5.9 en Twenty Twenty-Two.<\/p>\n<p>Daarna kijken we naar de belangrijkste features van het bloktema die zijn ge\u00efmplementeerd in Twenty Twenty-Two. Je maakt kennis met <strong>global styles<\/strong>, <strong>blokpatronen<\/strong>, <strong>templates<\/strong> en <strong>template-onderdelen<\/strong>.<\/p>\n<p>Maar er is nog veel meer te zeggen over Twenty Twenty-Two en WordPressblokthema&#8217;s. Daarom geven we als bonushoofdstuk een snel overzicht van hoe je de functies van Twenty Twenty-Two kunt uitbreiden door gebruik te maken van het <strong>theme.json<\/strong> bestand.<\/p>\n<p>Laten we meteen aan het werk gaan en het gloednieuwe Twenty Twenty-Two WordPress standaardthema bekijken.<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Twenty Twenty-Two brengt een nieuwe sitebewerkingsflow<\/h2>\n<p>Verschillende functies voor full-site editing site worden toegevoegd aan de core met WordPress 5.9. Site-eigenaren die de nieuwste WordPress versie gebruiken met een blokthema zoals Twenty Twenty-Two ge\u00efnstalleerd, kunnen binnenkort:<\/p>\n<ul>\n<li><a href=\"https:\/\/kinsta.com\/nl\/blog\/gutenberg-wordpress-editor\/\">Berichten en pagina&#8217;s maken en bewerken<\/a> met meer blokken en patronen<\/li>\n<li>De <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-8\/#block-settings-and-styles-with-themejson\">instellingen en stijlen<\/a> aanpassen die zijn gedefinieerd in het bestand <strong>theme.json<\/strong> via de Global Styles interface<\/li>\n<li>Templates voor pagina&#8217;s en berichten maken en bewerken<\/li>\n<li>Template-onderdelen maken en bewerken voor header, footer en andere templategebieden<\/li>\n<\/ul>\n<p>Nu al deze functies tot de core zijn samengevoegd, hebben de core-bijdragers van WordPress de <a href=\"https:\/\/make.wordpress.org\/design\/2021\/10\/15\/site-editing-ia-concepts-how-to-surface-and-access-new-features\/\">evolutie van de informatie-architectuur <\/a>besproken en de hele <a href=\"https:\/\/make.wordpress.org\/design\/2021\/10\/22\/site-editing-ia-concepts-part-2\/\">sitebewerkingsflow<\/a> opnieuw ontworpen.<\/p>\n<p>Het eerste dat opvalt als je Twenty Twenty-Two hebt geactiveerd, is dat het toegangspunt tot de site-editor zich niet langer in het hoofdmenu van je WordPress dashboard bevindt, maar is verplaatst naar het <strong>Appearance<\/strong>\u00a0menu.<\/p>\n<figure id=\"attachment_110738\" aria-describedby=\"caption-attachment-110738\" style=\"width: 1980px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110738 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editor-menu-wp-59.jpg\" alt=\" Het nieuwe Appearance menu in WordPress 5.9\" width=\"1980\" height=\"952\"><figcaption id=\"caption-attachment-110738\" class=\"wp-caption-text\">Het nieuwe Appearance menu in WordPress 5.9<\/figcaption><\/figure>\n<p>Het samenbrengen van de template- en stijlaanpassingfeatures onder het <strong>Appearance\u00a0<\/strong>menu zou de bewerkingservaring moeten stoomlijnen. Het moet het makkelijker maken om te begrijpen dat de features die je gebruikt, verband houden met de <em>presentatie <\/em>van je pagina&#8217;s.<\/p>\n\n<p>Het <strong>Editor <\/strong>menu item opent de homepagetemplate van de site.\u00a0 Afhankelijk van je leesinstellingen kan dit je pagina met laatste berichten of een statische pagina zijn.<\/p>\n<figure id=\"attachment_110740\" aria-describedby=\"caption-attachment-110740\" style=\"width: 2130px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110740 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-site-editor.jpg\" alt=\" De site-editor in WordPress 5.9 in Twenty Twenty-Two\" width=\"2130\" height=\"1002\"><figcaption id=\"caption-attachment-110740\" class=\"wp-caption-text\">De site-editor in WordPress 5.9 in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Als je nu op het WordPress pictogram in de linkerbovenhoek klikt, wordt een nieuw <a href=\"https:\/\/make.wordpress.org\/design\/2021\/10\/22\/site-editing-ia-concepts-part-2\/\">navigatiemenu <\/a>voor de site-editor weergegeven, inclusief drie menu items: <strong>Site<\/strong>,\u00a0<strong>Templates,<\/strong>\u00a0and\u00a0<strong>Template Parts<\/strong>.<\/p>\n<p>Laten we deze eens van dichterbij bekijken.<\/p>\n<figure id=\"attachment_110741\" aria-describedby=\"caption-attachment-110741\" style=\"width: 2318px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110741 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editor-navigation-menu.jpg\" alt=\"Het Editor navigatiemenu\" width=\"2318\" height=\"1046\"><figcaption id=\"caption-attachment-110741\" class=\"wp-caption-text\">Het Editor navigatiemenu<\/figcaption><\/figure>\n<p>De <strong>Site <\/strong>optie opent de template van de homepagina (nieuwste blogartikelen of statische startpagina).<\/p>\n<p>Via het menu-item <strong>Templates<\/strong> krijg je een lijst met de beschikbare templates. Je kunt op elke template in de lijst klikken om deze in de editor te starten.<\/p>\n<p>Op het moment van schrijven biedt Twenty Twenty-Two 11 templates.<\/p>\n<figure id=\"attachment_110746\" aria-describedby=\"caption-attachment-110746\" style=\"width: 2132px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110746 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-templates.jpg\" alt=\" Twenty Twenty-Two templates\" width=\"2132\" height=\"1218\"><figcaption id=\"caption-attachment-110746\" class=\"wp-caption-text\">Twenty Twenty-Two templates<\/figcaption><\/figure>\n<p>Door op het ellipspictogram (<strong>\ufe19<\/strong>) aan de rechterkant te klikken, kun je je aanpassingen wissen.<\/p>\n<figure id=\"attachment_111357\" aria-describedby=\"caption-attachment-111357\" style=\"width: 1378px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111357 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-template-clear-customizations.jpg\" alt=\"Template-aanpassingen wissen\" width=\"1378\" height=\"686\"><figcaption id=\"caption-attachment-111357\" class=\"wp-caption-text\">Template-aanpassingen wissen<\/figcaption><\/figure>\n<p>In tegenstelling tot thematemplates kunnen aangepaste templates alleen worden hernoemd of verwijderd (maar je kunt <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-8\/#template-editing-mode\">aangepaste templates bewerken<\/a> in de berichteditor).<\/p>\n<figure id=\"attachment_111356\" aria-describedby=\"caption-attachment-111356\" style=\"width: 1368px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111356 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/wp-59-delete-rename-custom-template.jpg\" alt=\"Aangepaste templates hernoemen\/verwijderen\" width=\"1368\" height=\"382\"><figcaption id=\"caption-attachment-111356\" class=\"wp-caption-text\">Aangepaste templates hernoemen\/verwijderen<\/figcaption><\/figure>\n<p>Het <strong>Template Parts <\/strong>menu-item vermeldt de beschikbare template-onderdelen die je in de editor kunt openen voor je aanpassingen.<\/p>\n<p>Standaard zijn er vier template-onderdelen toegevoegd aan Twenty Twenty-Two. Als je de cursor over een gewijzigde template beweegt, wordt er een tooltip weergegeven om je te laten weten dat de template is aangepast.<\/p>\n<figure id=\"attachment_110747\" aria-describedby=\"caption-attachment-110747\" style=\"width: 2128px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110747 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-template-parts.jpg\" alt=\"Twenty Twenty-Two Template Parts.\" width=\"2128\" height=\"1120\"><figcaption id=\"caption-attachment-110747\" class=\"wp-caption-text\">Twenty Twenty-Two Template Parts.<\/figcaption><\/figure>\n<p>Je kunt deze aanpassingen wissen door op het ellipspictogram (<strong>\ufe19<\/strong>) aan de rechterkant te klikken.<\/p>\n<figure id=\"attachment_111354\" aria-describedby=\"caption-attachment-111354\" style=\"width: 2214px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111354 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-template-parts-clear-customizations.jpg\" alt=\"Aanpassingen van template-onderdelen wissen\" width=\"2214\" height=\"1118\"><figcaption id=\"caption-attachment-111354\" class=\"wp-caption-text\">Aanpassingen van template-onderdelen wissen<\/figcaption><\/figure>\n<h3>Templates en template-onderdelen bewerken<\/h3>\n<p>De <strong>Editor <\/strong>biedt de interface om de structuur van je <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/create-block-theme\/#required-files-and-file-structure\">templates en template-onderdelen<\/a> aan te passen.<\/p>\n<p>Hier kun je eenvoudig blokken en patronen toevoegen of bewerken, en je wijzigingen worden automatisch toegepast op elke pagina die dat template gebruikt.<\/p>\n<figure id=\"attachment_110836\" aria-describedby=\"caption-attachment-110836\" style=\"width: 2534px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110836 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editing-single-post-template.jpg\" alt=\" De template voor een enkel bericht bewerken\" width=\"2534\" height=\"1294\"><figcaption id=\"caption-attachment-110836\" class=\"wp-caption-text\">De template voor een enkel bericht bewerken<\/figcaption><\/figure>\n<p>De afbeelding hieronder toont de template van de 404 pagina in de editor. Het is een vrij eenvoudige template, met alleen een kop, een alinea en een zoekvak. Toch geeft het ons een goed begrip van hoe de gebruikersinterface werkt.<\/p>\n<figure id=\"attachment_110826\" aria-describedby=\"caption-attachment-110826\" style=\"width: 1796px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110826 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/404-page-template.jpg\" alt=\" Twenty Twenty-Two's 404 bloktemplate in de template-editor\" width=\"1796\" height=\"1350\"><figcaption id=\"caption-attachment-110826\" class=\"wp-caption-text\">Twenty Twenty-Two&#8217;s 404 bloktemplate in de template-editor<\/figcaption><\/figure>\n<p>Hier kun je bewerkingen uitvoeren en templates aanpassen aan jouw behoeften. Je wilt bijvoorbeeld misschien een <strong>raster van afbeeldingsberichten <\/strong>toevoegen om de betrokkenheid van je bezoekers te vergroten en ze uit te nodigen om door de content van je website te bladeren.<\/p>\n<figure id=\"attachment_111351\" aria-describedby=\"caption-attachment-111351\" style=\"width: 2872px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111351 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/grid-of-image-post-pattern.jpg\" alt=\" De 404 bloktemplate van Twenty Twenty-Two aanpassen\" width=\"2872\" height=\"1314\"><figcaption id=\"caption-attachment-111351\" class=\"wp-caption-text\">De 404 bloktemplate van Twenty Twenty-Two aanpassen<\/figcaption><\/figure>\n<p>De dropdown voor de header boven aan de template-editor geeft een lijst weer van de beschikbare <strong>templategebieden<\/strong>. Dezelfde lijst verschijnt op het <strong>Template <\/strong>tabblad in de\u00a0<strong>Settings <\/strong>zijbalk.<\/p>\n<figure id=\"attachment_110761\" aria-describedby=\"caption-attachment-110761\" style=\"width: 2242px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110761 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/template-areas.jpg\" alt=\"Templategebieden in Twenty Twenty-Two\" width=\"2242\" height=\"1036\"><figcaption id=\"caption-attachment-110761\" class=\"wp-caption-text\">Templategebieden in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Door op een templategebied te klikken (bijv. Header), word je direct naar het templategedeelte gebracht dat je wil bewerken.<\/p>\n<p>Als je op het ellipspictogram aan de rechterkant klikt, krijg je toegang tot de <strong>Isolated template part editor.<\/strong><\/p>\n<figure id=\"attachment_110748\" aria-describedby=\"caption-attachment-110748\" style=\"width: 2292px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110748 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editing-template-parts.jpg\" alt=\"Het ellipspictogram start de Isolated template part editor\" width=\"2292\" height=\"1316\"><figcaption id=\"caption-attachment-110748\" class=\"wp-caption-text\">Het ellipspictogram start de Isolated template part editor<\/figcaption><\/figure>\n<p>De editor van dit template-onderdeel editor biedt ook een paar versleepbare handles, zodat je kunt controleren hoe de template zich gedraagt bij verschillende schermresoluties.<\/p>\n<figure id=\"attachment_110762\" aria-describedby=\"caption-attachment-110762\" style=\"width: 2130px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110762 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/adjusting-preview-dimension-1.jpg\" alt=\"Voorbeeld aanpassen van resolutie bij een template-onderdeel\" width=\"2130\" height=\"1196\"><figcaption id=\"caption-attachment-110762\" class=\"wp-caption-text\">Voorbeeld aanpassen van resolutie bij een template-onderdeel<\/figcaption><\/figure>\n<p>Als je tevreden bent met je aanpassingen, sla je je bewerkingen op en ga je terug naar de hoofd template-editor om het eindresultaat te controleren.<\/p>\n<p>Als je meer informatie wil over de nieuwe informatiearchitectuur, kun je de volgende artikelen raadplegen:<\/p>\n<ul>\n<li><a href=\"https:\/\/make.wordpress.org\/design\/2021\/10\/15\/site-editing-ia-concepts-how-to-surface-and-access-new-features\/\">Site editing IA concepts: How to surface and access new features<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/design\/2021\/10\/22\/site-editing-ia-concepts-part-2\/\">Site Editing iA concepts \u2013 Part 2<\/a><\/li>\n<\/ul>\n<h2>Twenty Twenty-Two in de kern: een snel overzicht van theme.json<\/h2>\n<p>Laten we, om volledig te begrijpen hoe Twenty Twenty-Two en blokthema&#8217;s (zoals <a href=\"https:\/\/www.anarieldesign.com\/themes\/block-based-wordpress-theme\/\">Bricksy<\/a>) werken, een blik werpen op de nieuwe themaconfiguratie en het nieuwe stijlmechanisme op basis van het <strong>theme.json <\/strong>bestand.<\/p>\n<p>Dit nieuwe mechanisme dat ge\u00efntroduceerd werd met <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-8\/#block-settings-and-styles-with-themejson\">WordPress 5.8<\/a> stelt themaontwikkelaars in staat om de editor te configureren en featureondersteuning toe te voegen vanaf een <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/25\/introducing-theme-json-in-wordpress-5-8\/\">centraal configuratiepunt.<\/a><\/p>\n<p>In Twenty Twenty-Two heeft het <strong>theme.json<\/strong> bestand de volgende structuur:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 2,\n\t\"settings\": {},\n\t\"styles\": {},\n\t\"customTemplates\": {},\n\t\"templateParts\": {}\n}<\/code><\/pre>\n<p>Laten we snel naar elke sectie kijken.<\/p>\n<h3>Version<\/h3>\n<p>Het <code>version<\/code>\u00a0veld beschrijft de specificatieversie, die momenteel <code>2<\/code> is.<\/p>\n<h3>Settings<\/h3>\n<p>Het <code>settings<\/code> gedeelte <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#settings\">definieert instellingen<\/a> op globaal of blokniveau. Instellingen die op het hoogste niveau zijn gedefinieerd, zijn van invloed op alle blokken, maar losse blokken kunnen algemene instellingen overschrijven. In Twenty Twenty-Two vind je de volgende instellingen:<\/p>\n<pre><code class=\"language-json\">{\n\t\"settings\": {\n\t\t\"appearanceTools\": true,\n\t\t\"color\": {\n\t\t\t\"duotone\": [...],\n\t\t\t\"gradients\": [...],\n\t\t\t\"palette\": [...]\n\t\t},\n\t\t\"custom\": {...},\n\t\t\"spacing\": {...},\n\t\t\"typography\": {\n\t\t\t\"dropCap\": false,\n\t\t\t\"fontFamilies\": [...],\n\t\t\t\"fontSizes\": [...]\n\t\t},\n\t\t\"layout\": {...}\n\t}\n}<\/code><\/pre>\n<p><a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#css-custom-properties-presets-custom\">Standaardinstellingen<\/a> worden <strong>presets <\/strong>genoemd en worden gebruikt om <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#the-naming-schema-of-css-custom-properties\">aangepaste CSS eigenschappen en klassenamen te genereren<\/a> op basis van een specifieke <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#the-naming-schema-of-css-custom-properties\">naamgevingsconventie<\/a>:<\/p>\n<ul>\n<li>CSS custom property: <code>--wp--preset--{preset-category}--{preset-slug}<\/code><\/li>\n<li>CSS class name: <code>.has-{preset-slug}-{preset-category}<\/code><\/li>\n<\/ul>\n<p>Zodra een thema zijn presets heeft gedefinieerd, kunnen de bijbehorende aangepaste CSS properties worden gebruikt om blokken en elementen in de <code>styles<\/code> \u00a0sectie op te maken.<\/p>\n<h3>Styles<\/h3>\n<p>In de <code>styles<\/code> sectie defini\u00ebren thema&#8217;s de <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#styles\">default styles<\/a> voor blokken en elementen. Zie bijvoorbeeld de volgende Twenty Twenty-Two stijlen voor het Button blok van de core:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 2,\n\t\"styles\": {\n\t\t\"blocks\": {\n\t\t\t\"core\/button\": {\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"radius\": \"0\"\n\t\t\t\t},\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--primary)\",\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--background)\"\n\t\t\t\t},\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--typography--font-size--normal)\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>Je zult de custom CSS properties opmerken die worden gebruikt in de property declarations.<\/p>\n<h3>Custom templates<\/h3>\n<p>De <code>customTemplates<\/code> sectie is waar een thema zijn <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#customtemplates\">aangepaste templates<\/a> declareert.\u00a0 De\u00a0<code>name<\/code>\u00a0 en <code>title<\/code>\u00a0velden zijn verplicht. Thema&#8217;s kunnen ook aangeven welk berichttype de template kan gebruiken door de <code>postTypes<\/code> property.<\/p>\n<p>Twenty Twenty-Two biedt vier custom templates:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 2,\n\t\"customTemplates\": [\n\t\t{\n\t\t\t\"name\": \"blank\",\n\t\t\t\"title\": \"Blank\",\n\t\t\t\"postTypes\": [\n\t\t\t\t\"page\",\n\t\t\t\t\"post\"\n\t\t\t]\n\t\t},\n\t\t{\n\t\t\t\"name\": \"page-large-header\",\n\t\t\t\"title\": \"Page (Large Header)\",\n\t\t\t\"postTypes\": [\n\t\t\t\t\"page\"\n\t\t\t]\n\t\t},\n\t\t{\n\t\t\t\"name\": \"single-no-separators\",\n\t\t\t\"title\": \"Single Post (No Separators)\",\n\t\t\t\"postTypes\": [\n\t\t\t\t\"post\"\n\t\t\t]\n\t\t},\n\t\t{\n\t\t\t\"name\": \"page-no-separators\",\n\t\t\t\"title\": \"Page (No Separators)\",\n\t\t\t\"postTypes\": [\n\t\t\t\t\"page\"\n\t\t\t]\n\t\t}\n\t]\n}<\/code><\/pre>\n<p>Je vindt de bijbehorende <strong>.html <\/strong>bestanden in de map <strong>block-templates<\/strong>.<\/p>\n<figure id=\"attachment_111516\" aria-describedby=\"caption-attachment-111516\" style=\"width: 1224px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111516 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-block-templates-folder.jpg\" alt=\" Twenty Twenty-Two\u2019s block-templates map\" width=\"1224\" height=\"587\"><figcaption id=\"caption-attachment-111516\" class=\"wp-caption-text\">Twenty Twenty-Two\u2019s <strong>block-templates<\/strong> map<\/figcaption><\/figure>\n<h3>Template parts<\/h3>\n<p>De <code>templateParts<\/code> sectie bevat <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/#templateparts\">definities van template-onderdelen<\/a>:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 2,\n\t\"templateParts\": [\n\t\t{\n\t\t\t\"name\": \"header\",\n\t\t\t\"title\": \"Header\",\n\t\t\t\"area\": \"header\"\n\t\t},\n\t\t{\n\t\t\t\"name\": \"header-large-dark\",\n\t\t\t\"title\": \"Header (Dark, large)\",\n\t\t\t\"area\": \"header\"\n\t\t},\n\t\t{\n\t\t\t\"name\": \"header-small-dark\",\n\t\t\t\"title\": \"Header (Dark, small)\",\n\t\t\t\"area\": \"header\"\n\t\t},\n\t\t{\n\t\t\t\"name\": \"footer\",\n\t\t\t\"title\": \"Footer\",\n\t\t\t\"area\": \"footer\"\n\t\t}\n\t]\n}<\/code><\/pre>\n<p>De\u00a0<code>name<\/code>\u00a0 en <code>title<\/code>\u00a0velden zijn verplicht. Thema&#8217;s kunnen ook een <code>area<\/code> term declareren, waarbij het template-onderdeel in de editor wordt gerenderd.<\/p>\n<figure id=\"attachment_111360\" aria-describedby=\"caption-attachment-111360\" style=\"width: 1616px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-111360\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-template-parts-1.jpg\" alt=\"Twenty Twenty-Two template parts\" width=\"1616\" height=\"1128\"><figcaption id=\"caption-attachment-111360\" class=\"wp-caption-text\">Twenty Twenty-Two template parts<\/figcaption><\/figure>\n<p>De <strong>.html <\/strong>bestanden van template-onderdelen bevinden zich in de <strong>template-parts <\/strong>map.<\/p>\n<p>Nu je meer weet over <strong>theme.json <\/strong>van Twenty Twenty-Two, kunnen we de features van het thema en de nieuwe bewerkingsinterface grondiger verkennen.<\/p>\n<p>Laten we kijken naar <strong>Twenty Twenty-Two\u2019s Global Styles<\/strong>.<\/p>\n<h2>Global Styles in Twenty Twenty-Two<\/h2>\n<p>Als je naar de style.css van Twenty Twenty-Two kijkt<strong>, zal het je misschien verbazen dat het een minimaal aantal CSS declarations bevat. De reden is dat stijlen van block-based thema&#8217;s in het <em>theme.json<\/em> bestand worden gedeclareerd<\/strong>.<\/p>\n<p>WordPress 5.9 gaat een stap verder en introduceert een nieuwe functie waarmee gebruikers van blokthema&#8217;s het uiterlijk van site-elementen kunnen aanpassen vanuit een gebruikersinterface genaamd <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-8\/#block-settings-and-styles-with-themejson\">Global Styles<\/a>.<\/p>\n<p>De Global Styles interface is toegankelijk via het nieuwe <strong>Styles <\/strong>pictogram in de rechterbovenhoek van de Editor (zie ook <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">The Global Styles Interface<\/a>).<\/p>\n<p>Als je op dat pictogram klikt, wordt een nieuwe <strong>Styles <\/strong>zijbalk weergegeven, inclusief drie afzonderlijke vensters:<\/p>\n<ul>\n<li>Een <strong>Preview <\/strong>venster met een voorbeeld van je aanpassingen<\/li>\n<li>Een <strong>Global Styles<\/strong>\u00a0venster dat toegang biedt tot specifieke groepen bedieningselementen voor <strong>typografie<\/strong>, <strong>kleuren <\/strong>en <strong>lay-out<\/strong><\/li>\n<li>Een <strong>Blocks<\/strong>\u00a0item dat toegang biedt tot stijlinstellingen op blokniveau<\/li>\n<\/ul>\n<figure id=\"attachment_110852\" aria-describedby=\"caption-attachment-110852\" style=\"width: 1606px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110852 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/styles-sidebar.jpg\" alt=\"De Styles zijbalk in Twenty Twenty-Two\" width=\"1606\" height=\"1336\"><figcaption id=\"caption-attachment-110852\" class=\"wp-caption-text\">De Styles zijbalk in Twenty Twenty-Two<\/figcaption><\/figure>\n<h3>Twenty Twenty-Two&#8217;s kleurenpalet<\/h3>\n<p>Het <strong>Colors<\/strong>\u00a0venster kan je helpen bij het bewerken van de beschikbare paletten en het toewijzen of wijzigen van kleuren voor <strong>Background<\/strong>, <strong>Text <\/strong>of <strong>Links<\/strong>.<\/p>\n<p>In het <strong>Palette<\/strong> venster kun je de <strong>Theme<\/strong> of <strong>Default <\/strong>paletten aanpassen en zelfs je eigen palet maken.<\/p>\n<figure id=\"attachment_110941\" aria-describedby=\"caption-attachment-110941\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110941 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-color-settings.jpg\" alt=\" Kleurinstellingen in Twenty Twenty-Two\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-110941\" class=\"wp-caption-text\">Kleurinstellingen in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Heb je de code die de kleurcontroles genereert al gevonden?<\/p>\n<p>Zo niet, open dan Twenty Twenty-Two&#8217;s <strong>theme.json<\/strong> in je favoriete <a href=\"https:\/\/kinsta.com\/nl\/blog\/beste-teksteditors\/\">code-editor<\/a>. Je vindt de volgende declarations voor het kleurenpalet:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 2,\n\t\"settings\": {\n\t\t\"color\": {\n\t\t\t\"palette\": [\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"foreground\",\n\t\t\t\t\t\"color\": \"#000000\",\n\t\t\t\t\t\"name\": \"Foreground\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"background\",\n\t\t\t\t\t\"color\": \"#ffffff\",\n\t\t\t\t\t\"name\": \"Background\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"primary\",\n\t\t\t\t\t\"color\": \"#1a4548\",\n\t\t\t\t\t\"name\": \"Primary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"secondary\",\n\t\t\t\t\t\"color\": \"#ffe2c7\",\n\t\t\t\t\t\"name\": \"Secondary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"tertiary\",\n\t\t\t\t\t\"color\": \"#F6F6F6\",\n\t\t\t\t\t\"name\": \"Tertiary\"\n\t\t\t\t}\n\t\t\t]\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>De afbeelding hieronder laat zien hoe de bovenstaande code overeenkomt met het kleurenpalet van Twenty Twenty-Two.<\/p>\n<figure id=\"attachment_111011\" aria-describedby=\"caption-attachment-111011\" style=\"width: 1314px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111011 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-color-palette.jpg\" alt=\" Twenty Twenty-Two's kleurenpalet\" width=\"1314\" height=\"972\"><figcaption id=\"caption-attachment-111011\" class=\"wp-caption-text\">Twenty Twenty-Two&#8217;s kleurenpalet<\/figcaption><\/figure>\n<p>Laten we nu aannemen dat je de standaard achtergrondkleur voor een bepaald blok wilt wijzigen. Als je een andere kleur kiest voor de achtergrond van het blok, wordt simpelweg een andere <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/--*\">CSS variabele<\/a> toegewezen aan de property <code>background color<\/code> van het element. Onderstaande afbeelding geeft daar een voorbeeld van:<\/p>\n<figure id=\"attachment_111012\" aria-describedby=\"caption-attachment-111012\" style=\"width: 2036px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111012 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-custom-property.jpg\" alt=\"De primaire kleur van Twenty Twenty-Two gebruikt als achtergrondkleur\" width=\"2036\" height=\"860\"><figcaption id=\"caption-attachment-111012\" class=\"wp-caption-text\">De primaire kleur van Twenty Twenty-Two gebruikt als achtergrondkleur<\/figcaption><\/figure>\n<p>En dat is alles! Je hoeft geen enkele regel custom CSS code aan de Customizer toe te voegen of daarvoor een childthema te maken.<\/p>\n<p>Laten we de Global Styles van Twenty Twenty-Two verder verkennen met enkele aanvullende voorbeelden.<\/p>\n<h3>Typography instellingen<\/h3>\n<p>In het <strong>Typography <\/strong>venster kun je typografiestijlen aanpassen voor de <strong>Text <\/strong>en <strong>Links <\/strong>elementen van je website op globaal niveau.<\/p>\n<p>Elk item biedt toegang tot een groep controls waarmee je de lettertypefamilie, grootte en regelhoogte kunt aanpassen.<\/p>\n<figure id=\"attachment_110847\" aria-describedby=\"caption-attachment-110847\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110847 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-typography-settings.jpg\" alt=\" Typografie-instellingen in Twenty Twenty-Two\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-110847\" class=\"wp-caption-text\">Typografie-instellingen in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Vraag je je af welke code deze controls genereert?<\/p>\n<p>Open Twenty Twenty-Two&#8217;s <strong>theme.json<\/strong> en zoek de <code>typography<\/code>. Je zult de volgende instellingen zien:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 1,\n\t\"settings\": {\n\t\t\"appearanceTools\": true,\n\t\t\"typography\": {\n\t\t\t\"dropCap\": false,\n\t\t\t\"fontFamilies\": [\n\t\t\t\t{\n\t\t\t\t\t\"fontFamily\": \"-apple-system,BlinkMacSystemFont,\\\"Segoe UI\\\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\\\"Helvetica Neue\\\",sans-serif\",\n\t\t\t\t\t\"name\": \"System Font\",\n\t\t\t\t\t\"slug\": \"system-font\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fontFamily\": \"\\\"Source Serif Pro\\\", serif\",\n\t\t\t\t\t\"name\": \"Source Serif Pro\",\n\t\t\t\t\t\"slug\": \"source-serif-pro\"\n\t\t\t\t}\n\t\t\t],\n\t\t\t\"fontSizes\": [\n\t\t\t\t{\n\t\t\t\t\t\"name\": \"Small\",\n\t\t\t\t\t\"size\": \"1rem\",\n\t\t\t\t\t\"slug\": \"small\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"name\": \"Normal\",\n\t\t\t\t\t\"size\": \"1.125rem\",\n\t\t\t\t\t\"slug\": \"normal\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"name\": \"Medium\",\n\t\t\t\t\t\"size\": \"1.75rem\",\n\t\t\t\t\t\"slug\": \"medium\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"name\": \"Large\",\n\t\t\t\t\t\"size\": \"clamp(1.75rem, 3vw, 2.25rem)\",\n\t\t\t\t\t\"slug\": \"large\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"name\": \"Huge\",\n\t\t\t\t\t\"size\": \"clamp(2.5rem, 4vw, 3rem)\",\n\t\t\t\t\t\"slug\": \"huge\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n}<\/code><\/pre>\n<p>Je mag uit de bovenstaande code twee lettertypefamilies en vijf lettergroottes verwachten. En je had het goed geraden.<\/p>\n<p>Hier zie je hoe de bovenstaande code zich vertaalt naar instellingen voor Global Styles <strong>Typography<\/strong>:<\/p>\n<figure id=\"attachment_110848\" aria-describedby=\"caption-attachment-110848\" style=\"width: 1300px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-110848 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/font-family-font-size.jpg\" alt=\" Typografiestijlen in Twenty Twenty-Two\" width=\"1300\" height=\"1196\"><figcaption id=\"caption-attachment-110848\" class=\"wp-caption-text\">Typografiestijlen in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Je kunt raden welke instelling de controls van de <strong>Line height <\/strong>genereert. In Twenty Twenty-Two zul je daar geen specifieke instelling voor vinden omdat het wordt ingeschakeld door de property <code>appearanceTools<\/code>, wat een shortcut is voor verschillende instellingsdeclarations (zie volgende sectie).<\/p>\n<h3>Layout en Appearance tools<\/h3>\n<p>Het laatste element in de zijbalk Global Styles is de <strong>Layout<\/strong>. Op het moment van schrijven bevat het alleen een <code>padding<\/code> control.<\/p>\n<figure id=\"attachment_111192\" aria-describedby=\"caption-attachment-111192\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111192 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/layout.jpg\" alt=\" Lay-outinstellingen in Twenty Twenty-Two\" width=\"1790\" height=\"1212\"><figcaption id=\"caption-attachment-111192\" class=\"wp-caption-text\">Lay-outinstellingen in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>In Twenty Twenty-Two wordt het Layout venster ingeschakeld door de <code>appearanceTools<\/code> <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/36646\">setting property<\/a>, een boolean die kan worden gebruikt om <a href=\"https:\/\/github.com\/WordPress\/twentytwentytwo\/issues\/261\">meerdere instellingen tegelijk in te schakelen<\/a>:<\/p>\n<pre><code class=\"language-json\">{\n\t\"settings\": {\n\t\t\"appearanceTools\": true\n\t}\n}<\/code><\/pre>\n<p><code>\"appearanceTools\": true<\/code> vervangt gewoon het <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/36646\">volgende blok declaraties<\/a>:<\/p>\n<p><code class=\"language-json\">{<br \/>\n'settings': {<br \/>\n'border': {<br \/>\n'color': true,<br \/>\n'radius': true,<br \/>\n'style': true,<br \/>\n'width': true<br \/>\n},<br \/>\n'color': {<br \/>\n'link': true<br \/>\n},<br \/>\n'spacing': {<br \/>\n'blockGap': true,<br \/>\n'margin': true,<br \/>\n'padding': true<br \/>\n},<br \/>\n'typography': {<br \/>\n'lineHeight': true<br \/>\n}<br \/>\n}<br \/>\n}<\/code><\/p>\n<p>OK &#8211; je begrijpt nu hopelijk hoe de instellingen die zijn gedeclareerd in het <strong>theme.json <\/strong>bestand overeenkomen met de corresponderende Global Styles controls.<\/p>\n<p>Er ontbreekt nog een stukje van onze puzzel om een compleet beeld te krijgen van het nieuwe standaard WordPress thema: <strong>blokpatronen<\/strong>.<\/p>\n<h2>Twenty Twenty-Two blokpatronen<\/h2>\n<p>Je zou kunnen zeggen dat Twenty Twenty-Two voornamelijk <a href=\"https:\/\/wordpress.org\/news\/2021\/11\/episode-21-all-things-block-themes\/\">een verzameling patronen<\/a> is &#8211; en dat is het eigenlijk ook. In Twenty Twenty-Two vind je talloze kant-en-klare <a href=\"https:\/\/kinsta.com\/nl\/blog\/wordpress-5-5\/#block-patterns\">blokpatronen<\/a> waaruit je kunt kiezen om verbazingwekkende en onvoorspelbare structuren van nested blokken voor je webpagina&#8217;s te bouwen.<\/p>\n<p>De sleutelterm hier is <strong>empowerment van de gebruiker<\/strong>. En dat zien we terug, want met blokpatronen kun je van alles bouwen, van een aansprekend portfolio tot een promotionele website met maar \u00e9\u00e9n pagina, ook als je geen verstand hebt van HTML of CSS!<\/p>\n<p>En WordPress 5.9 brengt aanzienlijke verbeteringen aan het patroonsysteem met de nieuwe <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35773\">Pattern Explorer<\/a>, een tool waarmee je door patronen kunt bladeren in een full-screen modus.<\/p>\n<figure id=\"attachment_111407\" aria-describedby=\"caption-attachment-111407\" style=\"width: 2442px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111407 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/pattern-explorer.jpg\" alt=\" De Pattern Explorer in Twenty Twenty-Two\" width=\"2442\" height=\"1378\"><figcaption id=\"caption-attachment-111407\" class=\"wp-caption-text\">De Pattern Explorer in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>De nieuwe tool stelt je ook in staat om snel en eenvoudig blokpatronen rechtstreeks uit de <a href=\"https:\/\/wordpress.org\/patterns\/\">Pattern Directory<\/a> te importeren. Dit opent nieuwe mogelijkheden voor zowel WordPress gebruikers als <a href=\"https:\/\/kinsta.com\/nl\/blog\/gutenberg-blokken\/\">ontwikkelaars<\/a>, dus het gebruik ervan zal in de toekomst waarschijnlijk aanzienlijk toenemen.<\/p>\n<figure id=\"attachment_111408\" aria-describedby=\"caption-attachment-111408\" style=\"width: 2880px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111408 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/wordpress-patterns-directory.jpg\" alt=\" WordPress Patterns Directory\" width=\"2880\" height=\"2959\"><figcaption id=\"caption-attachment-111408\" class=\"wp-caption-text\">WordPress Patterns Directory<\/figcaption><\/figure>\n<p>Twenty Twenty-Two bevat <a href=\"https:\/\/github.com\/WordPress\/twentytwentytwo\/pull\/204\">tal van patronen<\/a> (meer dan 65) in vijf categorie\u00ebn.<\/p>\n<figure id=\"attachment_111409\" aria-describedby=\"caption-attachment-111409\" style=\"width: 1522px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111409 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/pattern-categories-dropdown.jpg\" alt=\"Twenty Twenty-Two patrooncategorie\u00ebn\" width=\"1522\" height=\"1250\"><figcaption id=\"caption-attachment-111409\" class=\"wp-caption-text\">Twenty Twenty-Two patrooncategorie\u00ebn<\/figcaption><\/figure>\n<p>Deze solide set patronen past perfect bij de templates en template-onderdelen die worden geleverd met het nieuwe standaardthema, wat zorgt voor een fantastische bewerkingservaring.<\/p>\n<figure id=\"attachment_111410\" aria-describedby=\"caption-attachment-111410\" style=\"width: 2880px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111410 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/layered-images-with-duotone-pattern.jpg\" alt=\"Gelaagde afbeeldingen met duotone \" width=\"2880\" height=\"1332\"><figcaption id=\"caption-attachment-111410\" class=\"wp-caption-text\">Gelaagde afbeeldingen met duotone<\/figcaption><\/figure>\n<figure id=\"attachment_111411\" aria-describedby=\"caption-attachment-111411\" style=\"width: 2880px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111411 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/video-with-header-and-details.jpg\" alt=\"Video met header en details \" width=\"2880\" height=\"2544\"><figcaption id=\"caption-attachment-111411\" class=\"wp-caption-text\">Video met header en details<\/figcaption><\/figure>\n<figure id=\"attachment_111412\" aria-describedby=\"caption-attachment-111412\" style=\"width: 2002px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111412 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/two-images-with-text.jpg\" alt=\"Twee afbeeldingen met tekst\" width=\"2002\" height=\"2160\"><figcaption id=\"caption-attachment-111412\" class=\"wp-caption-text\">Twee afbeeldingen met tekst<\/figcaption><\/figure>\n<p>Als je nog niet de kans hebt gehad om met blokpatronen te experimenteren, laten we je met een eenvoudig voorbeeld zien waarom ze als zulke krachtige tools worden beschouwd.<\/p>\n<p>Stel dat je de standaard header uit de Index en Single Post templates wilt verwijderen en deze wilt vervangen door een ander Twenty Twenty-Two blokpatroon.<\/p>\n<p>Start de site-editor vanuit het <strong>Appearance<\/strong>\u00a0menu of de werkbalkknop van de WordPress frontend om de indextemplate aan te passen.<\/p>\n<p>Klik op de <strong>Index<\/strong> knop om de dropdown voor de header weer te geven met de lijst met beschikbare templategebieden op de pagina. Klik op de ellips knop naast <strong>Footer<\/strong>\u00a0en vervolgens op <strong>Edit Footer<\/strong>.<\/p>\n<figure id=\"attachment_111413\" aria-describedby=\"caption-attachment-111413\" style=\"width: 1534px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111413 size-full\" style=\"font-family: Roboto, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;font-size: 1rem\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/template-inspector.jpg\" alt=\"De Template Inspector\" width=\"1534\" height=\"812\"><figcaption id=\"caption-attachment-111413\" class=\"wp-caption-text\">De Template Inspector<\/figcaption><\/figure>\n<p>Zoals hierboven vermeld, wordt hiermee de Isolated template parts editor gestart.<\/p>\n<figure id=\"attachment_111414\" aria-describedby=\"caption-attachment-111414\" style=\"width: 2358px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111414 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/isolated-template-part-editor.jpg\" alt=\"De standaard Twenty Twenty-Two footer in de Isolated template parts editor\" width=\"2358\" height=\"848\"><figcaption id=\"caption-attachment-111414\" class=\"wp-caption-text\">De standaard Twenty Twenty-Two footer in de Isolated template parts editor<\/figcaption><\/figure>\n<p>Open nu de Block inserter en klik op <strong>Patterns<\/strong>.<\/p>\n<p>Start de nieuwe <strong>Pattern Explorer<\/strong> tool, selecteer de categorie <strong>Twenty Twenty-Two Footers <\/strong>en kies de footer van je keuze.<\/p>\n<figure id=\"attachment_111415\" aria-describedby=\"caption-attachment-111415\" style=\"width: 2360px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111415 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2-pattern-explorer.jpg\" alt=\"De Pattern Explorer in Twenty Twenty-Two\" width=\"2360\" height=\"1338\"><figcaption id=\"caption-attachment-111415\" class=\"wp-caption-text\">De Pattern Explorer in Twenty Twenty-Two<\/figcaption><\/figure>\n<p>Voeg nu de blokken toe en bewerk ze volgens naar wens.<\/p>\n<figure id=\"attachment_111416\" aria-describedby=\"caption-attachment-111416\" style=\"width: 2360px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111416 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/new-footer-in-isolated-template-editor.jpg\" alt=\"De footer bewerken in de Isolated template parts editor\" width=\"2360\" height=\"996\"><figcaption id=\"caption-attachment-111416\" class=\"wp-caption-text\">De footer bewerken in de Isolated template parts editor<\/figcaption><\/figure>\n<p>Sla de header op en controleer je site opnieuw wanneer je tevreden bent met je wijzigingen.<\/p>\n<p>De onderstaande afbeelding vergelijkt drie templates (index, single post en post en single post zonder separators) met verschillende aanpassingen voor header en footer:<\/p>\n<figure id=\"attachment_111417\" aria-describedby=\"caption-attachment-111417\" style=\"width: 2400px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111417 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/template-comparison.jpg\" alt=\"Aanpassingen aan header en footer vergeleken in verschillende Twenty Twenty-Two templates\" width=\"2400\" height=\"2223\"><figcaption id=\"caption-attachment-111417\" class=\"wp-caption-text\">Aanpassingen aan header en footer vergeleken in verschillende Twenty Twenty-Two templates<\/figcaption><\/figure>\n<h2>Twenty Twenty-Two uitbreiden met een childthema<\/h2>\n<p>Het maken van een <a href=\"https:\/\/developer.wordpress.org\/themes\/advanced-topics\/child-themes\/\">childthema voor een blokthema<\/a> is heel wat anders dan het maken van een <a href=\"https:\/\/kinsta.com\/nl\/blog\/child-thema-wordpress\/\">childthema voor een klassiek thema<\/a>.<\/p>\n<p>Maar als je eenmaal een goed begrip hebt van de <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/block-theme-overview\/#what-is-the-structure-of-a-block-theme\">structuur van een blokthema<\/a>, zul je het niet moeilijk vinden om een childthema te maken voor Twenty Twenty-Two of een ander blokthema.<\/p>\n<p>Laten we dus eens kijken hoe je het uiterlijk van je op Twenty Twenty-Two gebaseerde website kunt aanpassen.<\/p>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"3\" sub-toc=\"true\"><\/kinsta-auto-toc>\n<h3>1. Een childthema instellen voor Twenty Twenty-Two<\/h3>\n<p>Maak in je<strong> \/wp-content\/themes <\/strong>directory <a href=\"https:\/\/developer.wordpress.org\/themes\/advanced-topics\/child-themes\/#1-create-a-child-theme-folder\">een nieuwe map<\/a> en noem deze zoals je wilt (volgens de <a href=\"https:\/\/codex.wordpress.org\/Theme_Development#Theme_Development_Standards\">standaarden voor themaontwikkeling<\/a>). In dit voorbeeld noemden we de onderliggende-themamap <em>Twentytwentytwo-child<\/em>.<\/p>\n<p><a href=\"https:\/\/developer.wordpress.org\/themes\/advanced-topics\/child-themes\/#2-create-a-stylesheet-style-css\">Nu heb je een<\/a> <strong>style.css<\/strong> bestand nodig.\u00a0 Open je favoriete code editor en maak de volgende stylesheet:<\/p>\n<pre><code class=\"language-css\">\/*\nTheme Name: Twenty Twenty-Two Child\nTheme URI: https:\/\/example.com\/\nAuthor: Your name\nAuthor URI: https:\/\/example.com\/\nDescription: A child theme for TT2.\nRequires at least: 5.8\nTested up to: 5.9\nRequires PHP: 5.6\nVersion: 0.2\nLicense: GNU General Public License v2 or later\nLicense URI: http:\/\/www.gnu.org\/licenses\/gpl-2.0.html\nText Domain: twentytwentytwo-child\nTemplate: twentytwentytwo\nTags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments\n\nTwenty Twenty-Two Child WordPress Theme, (C) 2021 WordPress.org\nTwenty Twenty-Two Child is distributed under the terms of the GNU GPL.\n*\/<\/code><\/pre>\n<p>Zoals altijd kun je velden aanpassen aan je behoeften.<\/p>\n<p>Je childthema is nu beschikbaar om te bekijken. Je kunt het activeren in het admin scherm <strong>Appearance &gt; Themes<\/strong>.<\/p>\n<h3>2. Algemene instellingen aanpassen<\/h3>\n<p>Vanaf WordPress 5.9 zullen childthema\u2019s met een <strong>theme.json<\/strong> bestand de instellingen van het parent thema overnemen. Als de <strong>theme.json<\/strong> van het childthema een set stijlen definieert, worden die stijlen toegepast bovenop de stijlen van het parent thema.<\/p>\n<p>We kunnen dus een <strong>theme.json<\/strong> bestand maken dat slechts een klein aangepast blok met instellings- en stijldefinities bevat in plaats van al onze oorspronkelijke keuzes opnieuw te defini\u00ebren.<\/p>\n<h4>Zo declareer je een custom kleurenpalet<\/h4>\n<p>Bij het bouwen van een childthema voor Twenty Twenty-Two is de eenvoudigste taak het vervangen van het kleurenpalet. Het enige dat je hoeft te doen, is een nieuw kleurenpalet defini\u00ebren in het <strong>theme.json <\/strong>van je childthema, zoals hieronder weergegeven:<\/p>\n<pre><code class=\"language-json\">{\n\"version\": 2,\n\t\"settings\": {\n\t\t\"color\": {\n\t\t\t\"palette\": [\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"foreground\",\n\t\t\t\t\t\"color\": \"#FFFFFF\",\n\t\t\t\t\t\"name\": \"Foreground\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"background\",\n\t\t\t\t\t\"color\": \"#001F29\",\n\t\t\t\t\t\"name\": \"Background\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"primary\",\n\t\t\t\t\t\"color\": \"#D6FDFF\",\n\t\t\t\t\t\"name\": \"Primary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"secondary\",\n\t\t\t\t\t\"color\": \"#FDFCDC\",\n\t\t\t\t\t\"name\": \"Secondary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"tertiary\",\n\t\t\t\t\t\"color\": \"#FED9B7\",\n\t\t\t\t\t\"name\": \"Tertiary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"slug\": \"accent\",\n\t\t\t\t\t\"color\": \"#E94435\",\n\t\t\t\t\t\"name\": \"Accent\"\n\t\t\t\t}\n\t\t\t]\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>Sla je bestand op en ga terug naar de site-editor. Het hierboven gedefinieerde kleurenpalet had het standaardkleurenpalet van Twenty Twenty-Two moeten vervangen.<\/p>\n<figure id=\"attachment_111460\" aria-describedby=\"caption-attachment-111460\" style=\"width: 2264px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111460 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/child-theme-color-palette.jpg\" alt=\"Een kleurenpalet van het childthema\" width=\"2264\" height=\"1076\"><figcaption id=\"caption-attachment-111460\" class=\"wp-caption-text\">Een kleurenpalet van het childthema<\/figcaption><\/figure>\n<p>De kleuren worden in <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-support\/#block-color-palettes\">volgorde op het palet zelf weergegeven<\/a> en hun namen moeten de <a href=\"https:\/\/fullsiteediting.com\/lessons\/theme-json-color-options\/#h-frequently-asked-questions\">best practices<\/a> en <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/29568\">naamgevingsconventies volgen die op Github<\/a> zijn besproken, volgen.<\/p>\n<p>Je kunt nog veel meer lezen over de kleuropties van <strong>theme.json<\/strong> in dit <a href=\"https:\/\/fullsiteediting.com\/lessons\/theme-json-color-options\/\">uitgebreide overzicht van Carolina Nymark<\/a>.<\/p>\n<h4>Zo declareer je custom duotoonfilters<\/h4>\n<p>Je kunt ook de standaard duotoonkleuren vervangen door je aangepaste set filters.<\/p>\n<p>Om dat te doen, voeg je eenvoudig de volgende code toe aan de <strong>theme.json<\/strong> instellingen van je childthema op hetzelfde niveau als de <code>palette<\/code> property:<\/p>\n<pre><code class=\"language-json\">{\n\"version\": 2,\n\t\"settings\": {\n\t\t\"color\": {\n\t\t\t\"palette\": [...],\n\t\t\t\"duotone\": [\n\t\t\t\t{\n\t\t\t\t\t\"colors\": [\n\t\t\t\t\t\t\"#001F29\",\n\t\t\t\t\t\t\"#FFFFFF\"\n\t\t\t\t\t],\n\t\t\t\t\t\"slug\": \"default-filter\",\n\t\t\t\t\t\"name\": \"Default filter\"\n\t\t\t\t}\n\t\t\t]\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>Sla je bestand op en controleer het resultaat in de blokeditor. Je zou slechts \u00e9\u00e9n duotoonfilter moeten zien.<\/p>\n<figure id=\"attachment_111461\" aria-describedby=\"caption-attachment-111461\" style=\"width: 1564px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111461 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/child-theme-duotone-filter.jpg\" alt=\"Een duotoonfilter van het childthema \" width=\"1564\" height=\"1122\"><figcaption id=\"caption-attachment-111461\" class=\"wp-caption-text\">Een duotoonfilter van het childthema<\/figcaption><\/figure>\n<h3>3. Blokstijlen aanpassen<\/h3>\n<p>Zoals we eerder vermeldden, kun je met WordPress 5.9 nu de instellingen en stijlen van <strong>theme.json <\/strong>aanpassen vanuit de Global Styles interface.<\/p>\n<p>Blokstijlen kunnen alleen worden aangepast vanuit de Global Styles interface als het <strong>blok ondersteuning voor specifieke functionaliteit aangeeft<\/strong> in het bijbehorende <strong>block.json<\/strong> bestand. Maar je kunt de standaardblokinstellingen overschrijven in de <strong>theme.json<\/strong> van je childthema.<\/p>\n<p>Stel nu dat je de blokstijlen Post Title en Group wilt overschrijven. Het enige dat je hoeft te doen, is de stijlen defini\u00ebren die je wilt toevoegen of overschrijven, zoals hieronder wordt weergegeven:<\/p>\n<pre><code class=\"language-json\">{\n\"version\": 2,\n\t\"settings\": {...},\n\t\"styles\": {\n\t\t\"blocks\": {\n\t\t\t\"core\/post-title\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontFamily\": \"Roboto,Oxygen-Sans,Ubuntu,Cantarell,\\\"Helvetica Neue\\\",sans-serif\"\n\t\t\t\t},\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--tertiary)\"\n\t\t\t\t},\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"padding\": \"var(--wp--custom--spacing--small)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"core\/group\": {\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"margin\": {\n\t\t\t\t\t\t\"top\": \"0\",\n\t\t\t\t\t\t\"bottom\": \"0\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>In het bovenstaande voorbeeld hebben we de waarden van de lettertypefamilie, achtergrondkleur en padding voor <code>core\/post-title<\/code> gewijzigd, evenals de boven- en ondermarges voor <code>core\/group<\/code>.<\/p>\n<p>The image below shows the result as it would look on the public site:<\/p>\n<figure id=\"attachment_111462\" aria-describedby=\"caption-attachment-111462\" style=\"width: 2264px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-111462 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/child-theme-styles-post-title.jpg\" alt=\"Een custom Post Title blok\" width=\"2264\" height=\"832\"><figcaption id=\"caption-attachment-111462\" class=\"wp-caption-text\">Een custom Post Title blok<\/figcaption><\/figure>\n<p>En dat was het wat betreft onze review!<\/p>\n<p>We zullen voorlopig niet dieper ingaan op childthema&#8217;s, omdat dit buiten het bestek van dit bericht zou vallen. Ondertussen vind je meer voorbeelden van<a href=\"https:\/\/github.com\/WordPress\/theme-experiments\/tree\/add\/tt2-child-themes\"> Twenty Twenty-Two childthema&#8217;s<\/a> op Github.<\/p>\n\n<h2>Samenvatting<\/h2>\n<p>Terwijl we het nieuwe WordPress standaardthema Twenty Twenty-Two en de bijbehorende features (waardoor het het meest flexibele standaardthema ooit is uitgebracht) onder de loep nemen, hebben we de nieuwe informatiearchitectuur onthuld die is ge\u00efntroduceerd met WordPress 5.9. We kregen zelfs een voorproefje van de nieuwe Global Styles interface.<\/p>\n<p>Er komen veel spannende nieuwe features aan en het lijkt duidelijk dat de nieuwe bewerkingsomgeving in de loop van de tijd robuuster, betrouwbaarder en functioneler wordt.<\/p>\n<p>Hoewel er veel nieuwe WordPress features op komst zijn, verdwijnen andere of nemen ze in belang af. Veel gebruikers vragen zich af wat er met de <a href=\"https:\/\/kinsta.com\/nl\/blog\/hoe-je-je-wordpress-thema-kan-customizen\/#customizing-your-theme-via-the-customizer\">Customizer<\/a> zal gebeuren en hoe ze de achterwaartse compatibiliteit met bestaande thema&#8217;s het beste kunnen behouden.<\/p>\n<p>Je moet echter niet verwachten dat we plotseling in \u00e9\u00e9n keer van traditionele thema&#8217;s naar blockthema\u2019s springen. We hebben momenteel vier verschillende soorten thema&#8217;s om uit te kiezen:<\/p>\n<ul>\n<li><strong>Blokthema&#8217;s<\/strong>: Thema&#8217;s ontworpen voor Full-Site Editing<\/li>\n<li><strong>Universele thema&#8217;s<\/strong>: thema&#8217;s die werken met zowel de Customizer als de Site Editor<\/li>\n<li><strong>Hybride thema&#8217;s<\/strong>: klassieke thema&#8217;s die FSE features ondersteunen, zoals <strong>theme.json<\/strong><\/li>\n<li><strong>Klassieke thema&#8217;s<\/strong>: thema&#8217;s met PHP templates, functions.php, enz.<\/li>\n<\/ul>\n<p>Dus vrees niet &#8211; er zijn nog steeds genoeg oplossingen om uit te kiezen als je nog niet klaar bent om over te schakelen naar blokthema&#8217;s.<\/p>\n<p><em>En nu is het aan jou! Ben je klaar om de grote sprong te maken en nu blokthema&#8217;s te gaan gebruiken? Deel je mening met ons in de onderstaande comments.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hoewel iets later dan oorspronkelijk gepland, krijgen we een nieuw standaard WordPress thema. De naam is Twenty Twenty-Two! Het nieuwe standaard WordPress thema wordt geleverd met &#8230;<\/p>\n","protected":false},"author":36,"featured_media":41493,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[518,190],"topic":[902],"class_list":["post-41492","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-twenty-twenty-two","tag-wordpress-themes","topic-wordpress-themas"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#039;s<\/title>\n<meta name=\"description\" content=\"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#039;s\" \/>\n<meta property=\"og:description\" content=\"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-01-05T20:34:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-05-23T08:26:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Carlo Daniele\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\" \/>\n<meta name=\"twitter:creator\" content=\"@carlodaniele\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_NL\" \/>\n<meta name=\"twitter:label1\" content=\"Geschreven door\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carlo Daniele\" \/>\n\t<meta name=\"twitter:label2\" content=\"Geschatte leestijd\" \/>\n\t<meta name=\"twitter:data2\" content=\"26 minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\"},\"author\":{\"name\":\"Carlo Daniele\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\"},\"headline\":\"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#8217;s\",\"datePublished\":\"2022-01-05T20:34:09+00:00\",\"dateModified\":\"2023-05-23T08:26:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\"},\"wordCount\":3727,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\",\"keywords\":[\"Twenty Twenty-Two\",\"wordpress themes\"],\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\",\"url\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\",\"name\":\"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\",\"datePublished\":\"2022-01-05T20:34:09+00:00\",\"dateModified\":\"2023-05-23T08:26:33+00:00\",\"description\":\"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg\",\"width\":1460,\"height\":730,\"caption\":\"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/nl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"WordPress thema's\",\"item\":\"https:\/\/kinsta.com\/nl\/onderwerpen\/wordpress-themas\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#8217;s\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/nl\/#website\",\"url\":\"https:\/\/kinsta.com\/nl\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Snelle, veilige, premium hostingoplossingen\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/nl\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/nl\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/\",\"https:\/\/x.com\/Kinsta_NL\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\",\"name\":\"Carlo Daniele\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"caption\":\"Carlo Daniele\"},\"description\":\"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.\",\"sameAs\":[\"https:\/\/frammentidicodice.com\/\",\"https:\/\/x.com\/carlodaniele\"],\"url\":\"https:\/\/kinsta.com\/nl\/blog\/author\/carlodaniele\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's","description":"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/","og_locale":"nl_NL","og_type":"article","og_title":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's","og_description":"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.","og_url":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/","article_published_time":"2022-01-05T20:34:09+00:00","article_modified_time":"2023-05-23T08:26:33+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","type":"image\/jpeg"}],"author":"Carlo Daniele","twitter_card":"summary_large_image","twitter_description":"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.","twitter_image":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","twitter_creator":"@carlodaniele","twitter_site":"@Kinsta_NL","twitter_misc":{"Geschreven door":"Carlo Daniele","Geschatte leestijd":"26 minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/"},"author":{"name":"Carlo Daniele","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63"},"headline":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#8217;s","datePublished":"2022-01-05T20:34:09+00:00","dateModified":"2023-05-23T08:26:33+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/"},"wordCount":3727,"commentCount":1,"publisher":{"@id":"https:\/\/kinsta.com\/nl\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","keywords":["Twenty Twenty-Two","wordpress themes"],"inLanguage":"nl-NL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/","url":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/","name":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's","isPartOf":{"@id":"https:\/\/kinsta.com\/nl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","datePublished":"2022-01-05T20:34:09+00:00","dateModified":"2023-05-23T08:26:33+00:00","description":"Twenty Twenty-Two is het standaard blokthema dat wordt ge\u00efntroduceerd met WordPress 5.9. Bekijk alle belangrijke features in deze uitgebreide handleiding.","breadcrumb":{"@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/"]}]},{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#primaryimage","url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","contentUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2022\/01\/twenty-twenty-two-a-deep-dive-wp.jpeg","width":1460,"height":730,"caption":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema's"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/nl\/blog\/twenty-twenty-two-blokthema\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/nl\/"},{"@type":"ListItem","position":2,"name":"WordPress thema's","item":"https:\/\/kinsta.com\/nl\/onderwerpen\/wordpress-themas\/"},{"@type":"ListItem","position":3,"name":"Een diepgaande uitleg over Twenty Twenty-Two en WordPress blokthema&#8217;s"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/nl\/#website","url":"https:\/\/kinsta.com\/nl\/","name":"Kinsta\u00ae","description":"Snelle, veilige, premium hostingoplossingen","publisher":{"@id":"https:\/\/kinsta.com\/nl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/nl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/nl\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/nl\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/","https:\/\/x.com\/Kinsta_NL","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63","name":"Carlo Daniele","image":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","caption":"Carlo Daniele"},"description":"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.","sameAs":["https:\/\/frammentidicodice.com\/","https:\/\/x.com\/carlodaniele"],"url":"https:\/\/kinsta.com\/nl\/blog\/author\/carlodaniele\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/41492","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/users\/36"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/comments?post=41492"}],"version-history":[{"count":6,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/41492\/revisions"}],"predecessor-version":[{"id":43900,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/41492\/revisions\/43900"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/en"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/de"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/fr"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/pt"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/es"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/nl"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/jp"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/se"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/translations\/dk"},{"href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/41492\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/media\/41493"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/media?parent=41492"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/tags?post=41492"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/topic?post=41492"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}