Eind 2016 kondigde WordPress mede-oprichter en developer Matt Mullenweg het project ‘Gutenberg’ aan. Aanvankelijk was er de nodige terughoudendheid vanuit de WordPress-community over de zin van het project. Inmiddels kan de editor rekenen op veel ondersteuning. Elk element binnen een website kan inmiddels al bewerkt worden met Gutenberg. Tijd voor een nadere kennismaking!
Wat precies is Gutenberg voor WordPress?
Gutenberg is een WordPress block editor, gelanceerd als een geïntegreerd onderdeel van WordPress 5.0. Het is een van de meest moderne WordPress Content Management Systemen (CMS). De uitgangspunten van Gutenberg zijn gebaseerd op snelheid, flexibiliteit en toegankelijkheid. Om dit te realiseren bestaat de Gutenberg-editor uit samengestelde blokken op basis van CSS en HTML code. CSS wordt gebruikt om de prestaties van websites te verhogen. HTML is een stijlcode waarmee de structuur van een website wordt gemaakt. De Gutenberg blokken kun je zien als prefab, stapelbare bouwstenen. Het grote voordeel daarvan is snelheid. Niet alleen bij het maken van een website. Omdat de editor native integratie heeft met WordPress, ontstaan ook websites met een snelle laadtijd.
De mogelijkheden
Gutenberg werkt met modulaire inhoudsblokken die je naar het bewerkingsveld kunt slepen. Gratis plug-ins bieden al veel toepassingsmogelijkheden. Pro-versies bieden er uiteraard meer. Er zijn blokken voor tekst, afbeeldingen, video’s, knoppen, call-to-actions, listings, qoutes, muziek, enz. Elk blok is afzonderlijk te bewerken op bijvoorbeeld kleurgebruik. De samenstelling van de gekozen blokken bepaalt het design en de functionaliteiten.
WordPress block editor van de toekomst
Gutenberg is ook bekend als ‘WordPress block editor’ of, nog korter: ‘WordPress editor’. Nadat het project in 2016 werd geïntroduceerd duurde het tot 2018 voor het als vervanger van de klassieke WordPress editor (TinyBCE-editor) beschikbaar kwam. Gutenberg is een on-going project en geldt als de toekomst van WordPress dat zich steeds meer richt op ‘Full Site Editing’. Full Site Editing wil zeggen dat je een complete website kunt bouwen via blocks. Gutenberg is inmiddels al enige tijd de beta-fase ontstegen. Het is mogelijk om met de Gutenberg block editor een complete website te bouwen. Voor ontwikkelaars blijft het daarnaast mogelijk om eigen blokken te maken.
Gutenberg Full Site Editing Update
Gelijktijdig met de WordPress update naar WordPress 5.9 in januari 2022 kreeg ook Gutenberg een enorme update, namelijk de ‘Full Site Editing (FSE)’ update. Sinds deze update zijn de bewerkingsmogelijkheden zoals we die kennen voor afzonderlijke pagina’s en berichten, uitgebreid naar bewerkingsmogelijkheden voor volledige websites. Dit betekent dat er sinds de Full Site Editing update volledige ontwerptoepassingen mogelijk zijn. Met andere woorden, de Gutenberg block editor kan ook worden toegepast voor site-brede functies als headers, footers en site bars.
Het verschil tussen Gutenberg, WordPress Oxygen en een WordPress Thema
Zoals bekend heeft WordPress heel veel thema’s om uit te kiezen wanneer je een website wil (laten) maken. Een WP-thema is een ontwerp template, gemaakt door de WordPress-community. Een template definieert de basiselementen van een WordPress-website en zorgt daarmee voor een bepaald design.
Oxygen Builder voor WordPress is juist géén thema. Een Oxygen website wordt from scratch opgebouwd op een WordPress-core. Het is een modulair product waarmee we een volledig maatwerk website kunnen bouwen, zonder de beperkingen van een thema. Omdat we daarbij ook niet te maken hebben met overbodige elementen uit een thema, hebben WordPress Oxygen websites een erg snelle laadtijd.
Bricks Builder daarentegen kiest wel voor een Thema installatie maar dan zo efficiënt als het maar kan. En daarmee zijn ze evengoed als Oxygen Builder. Maar door de hoge ontwikkelsnelheid van Bricks Builder is dit zeker onze nieuwe favoriete WordPress Builder geworden dit jaar!
Binnen zowel Oxygen Builder voor WordPress als binnen een website met een WordPress thema kun je via een plug-in werken met de Gutenberg blokeditor. Maar het is ook mogelijk om, net als bij Oxygen Builder voor WordPress volledig vanaf nul een Gutenberg website te maken. De mogelijkheden zijn nog niet zo volledig doorontwikkeld als voor Oxygen Builder voor WordPress, maar dit is slechts een kwestie van tijd.
De voordelen van Gutenberg block editor
- Oorspronkelijk ontworpen als block editor voor de inhoud van WordPress pagina’s en berichtpagina’s is het inmiddels mogelijk om volledige websites te ontwerpen met Gutenberg.
- Gutenberg produceert schone code wat de laadsnelheid ten goede komt. Een snelle laadtijd speelt een belangrijke rol binnen SEO. Het bouncepercentage neemt sterk toe wanneer een pagina meer dan 3 seconden nodig heeft om te laden. Omdat er binnen het systeem nauwelijks gewerkt hoeft te worden met plug-ins, brengt dit duidelijk meetbare pagespeed-voordelen met zich.
- Geschikt voor blog-websites, informatie websites, complexe bedrijfswebsites en voor WooCommerce. Voor binnen webshops (WooCommerce) zijn er blokken voor geavanceerde knoppen, contactformulieren, reviews, tellers, inlog- en registratieblokken, video- en afbeeldingsblokken, socialmedialinks, inbeddingen, lightbox-blok enz.
Conclusie voor Gutenberg WordPress
Zoals je hebt gemerkt is dit artikel geen Gutenberg handleiding. We hebben je vooral willen informeren over de toekomstrichting die WordPress met de ontwikkeling van de block editor is ingeslagen. Het was al de editor bij uitstek om via ‘kies- en sleep’ de inhoud van WordPress berichten- en -pagina’s te bepalen. Sinds de update naar WordPress 5.9 biedt de editor Full Site Editing en is het ook mogelijk om met Gutenberg from de volledige inhoud van websites te bepalen.
Het systeem wordt verder ontwikkeld om dé editor te worden die snelle, modulair te bouwen websites oplevert die aan alle eisen op gebied van technisch webdesign, gebruiksvriendelijkheid en SEO kunnen voldoen.
Nog een reden waarom deze block editor de toekomst heeft: WordPress heeft aangegeven om de klassieke editor niet meer actief verder te ontwikkelen en dat het zwaarder zal leunen op het Gutenberg Project.
Wil je meer weten over Gutenberg of wil je weten wat bouwen met deze editor voor jouw (volgende) website kan betekenen? Wij vertellen je er graag alles over!