Op 6 december 2018 is WordPress 5.0 ‘Bebo’ gelanceerd! Mocht je alle andere updates van het jaar gemist hebben, dan is nu een goed moment om er even voor te gaan zitten en op te letten. Dit is namelijk de meest ingrijpende update van 2018. WordPress heeft de manier waarop gebruikers en ontwikkelaars omgaan met de CMS helemaal omgegooid door de Gutenberg-editor toe te voegen. De editor draait nu om blokken. Ook is er een fris nieuw thema, Twenty Nineteen, die automatisch wordt geactiveerd op nieuwe installaties.

Bijwerken: Wat is er nieuw in WordPress 5.3

Zoals met elke nieuwe versie van WordPress, raden we je altijd aan om deze eerst uit te testen. Dit heb je misschien al vaker gehoord, maar omdat deze lancering van invloed is op alles wat met de editor te maken heeft, van externe plugins tot je thema, je zal het eerst moeten testen! Als je het namelijk niet test, kunnen er gemakkelijk dingen foutgaan. Dit is een release waar je niet zomaar op de ‘update’-knop wil drukken.

Laten we eens een kijkje nemen en zien wat de nieuwe WordPress 5.0 allemaal voor ons in petto heeft

WordPress 5.0 Verandert Alles (Wat Is Er Nieuw?)

Met WordPress 4.8 (Evans) hebben we een groot aantal nieuwe widgets en verbeteringen gekregen, samen met een handige verbetering van hoe links in de visuele editor werken.

Met WordPress 4.9 (Tipton) zetten we een belangrijke stap naar een meer gebruiksvriendelijke manier om websites aan te passen en te beheren, met verbeteringen om iets aan te passen, nieuwe functionaliteiten voor widgets en een krachtige teksteditor voor het bewerken van code.

De meeste van de eerdere updates waren relatief klein en hebben op velen van ons beperkte invloed gehad. Met WordPress 5.0 is dat anders. In plaats van hier en daar kleine verbeteringen toe te voegen, is deze uitgave volledig gericht op de volgende twee dingen:

  1. De nieuwe Gutenberg WordPress editor
  2. Twenty Nineteen WordPress thema

Verder worden de kleine veranderingen en bugfixes alleen in kleinere updates behandeld. Deze update draait dus vooral om Gutenberg. 📇

In eerste instantie klinkt dit misschien alsof er niet veel verandert, maar dat is verre van waar! Gutenberg is een belangrijke stap om WordPress als CMS (contentmanagementsysteem) naar een hoger niveau te tillen als het gaat om het makkelijk bouwen en beheren van websites. Ze hebben echter ook gezegd dat het plan is om twee keer per maand een kleinere WordPress-update uit te brengen nu WordPress 5.0 is uitgebracht. Je kan de complete planning voor Gutenberg Fase 2 inzien.

Maar wat is Gutenberg nu precies? Het handboek van Gutenberg levert een prima samenvatting:

Gutenberg begon als een transformatie van de WordPress-editor – een nieuwe interface voor het toevoegen, bewerken en manipuleren van content. Het wil het voor iedereen gemakkelijk maken om relevante, flexibele lay-outs voor zijn content te kunnen maken en het gebruikt daarvoor een op blokken gebaseerde gebruikersinterface. Onderdelen van de pagina’s worden als modulaire blokken weergegeven, wat betekent dat ze vanuit een uniform blokmenu toegankelijk zijn, overal op een pagina kunnen worden neergezet en direct kunnen worden bewerkt om de gewenste presentatie neer te kunnen zetten.

Het is een fundamentele modernisering en transformatie van de WordPress-ervaring waardoor er nieuwe kansen voor zowel gebruikers als ontwikkelaars worden gecreëerd. Gutenberg introduceert dus, in het kort, nieuwe frameworks, interactiepatronen, functionaliteit en gebruikerservaringen voor WordPress.

Met andere woorden, in WordPress 5.0 heb je niet langer dezelfde klassieke WordPress-editor of teksteditor, die je in het afgelopen decennium bent gewend.  😱 Het gaat er nu zo uitzien:

Gutenberg Editor
Gutenberg Editor

Misschien heb je in het WordPress-dashboard er al een melding over gezien. Deze is toegevoegd aan de WordPress versie 4.9.8 om gebruikers op de hoogte te stellen dat de nieuwe editor eraan komt.

WordPress 5.0 Gutenberg callout
WordPress 5.0 Gutenberg callout

Gutenberg is de standaard – en enige – editor van nieuwe WordPress 5.0-installaties. Maak je echter geen zorgen, je kan nog steeds gebruik maken van de Classic Editor-plugin, mocht je dat willen. Deze kun je dan naast de nieuwe Gutenberg-editor blijven gebruiken.

Echter, het WordPress-team heeft wel gezegd dat ze deze plugin officieel zullen ondersteunen tot slechts 31 december 2021. Om die reden raden we aan om zo snel mogelijk over te stappen op Gutenberg en WordPress 5.0 en niet te lang te wachten.

Waarom deze nieuwe Gutenberg-editor? Hiervoor zijn een aantal redenen.

1. WordPress Moet Concurreren

De eerste reden is dat, hoewel de zelf-gehoste versie van WordPress een open source is, Automattic, het team achter WordPress.com nog altijd een bedrijf is. Het moet dus concurreren met alle andere oplossingen voor het bouwen van websites, zoals Wix en Squarespace. Als je kijkt naar het marktaandeel van WordPress, ligt de jaarlijkse groei van 2017 tot 2018 rond de 17,3%. Hoewel dat geweldig lijkt, moet je eens naar enkele van de concurrenten kijken. Squarespace groeide met 180% en Wix groeide met maar liefst 233%.

En hoewel het open source-project is en het bedrijf technisch gezien gescheiden is, zijn ze toch met elkaar verbonden. Met andere woorden, WordPress mag niet achterop raken! Waarom denk je dat alle plugins voor het bouwen van pagina’s ongelofelijk snel groeien? Dat komt omdat mensen eenvoudigere manieren nodig hebben om hun websites te kunnen bouwen en om content te kunnen schrijven. Zelfs andere publicatieplatforms, zoals Medium en Ghost, bieden als je alleen maar wilt bloggen een veel betere schrijfervaring.

Dit is niet noodzakelijk een slechte zaak. De concurrentie zorgt immers dat WordPress sneller innoveert, iets waar het product en de gemeenschap van profiteren.

2. Veranderingen Waren Nodig

Ten tweede, Gutenberg is gebouwd op React, een erg populair JavaScript-framework dat wordt gebruikt en onderhouden door bedrijven als Facebook en Instagram. Onze ontwikkelaars bij Kinsta zijn fan van React en in feite gebruikten we het al toen we besloten om ons eigen affiliatiesysteem te gaan ontwikkelen. Daarnaast profiteert Gutenberg ook nog van een heleboel andere moderne technologieën zoals de REST API, ESnext + JSX, WebPack, enz. Riad Benguella heeft een geweldige post geschreven over hoe Gutenberg de ontwikkeling van WordPress verandert.

Door de manier waarop het is gestructureerd, opent het in termen van ‘blokontwikkeling’ een hele nieuwe wereld voor ontwikkelaars. Onthoud dat alles in Gutenberg om blokken draait. Dus je zult die term waarschijnlijk nog vaak horen.

Maar het kan de dingen ook bemoeilijken, omdat ontwikkelaars meestal nieuwe talen moeten leren. Gelukkig is de WordPress-gemeenschap erg behulpzaam en zijn er geweldige open source-projecten zoals create-guten-block van de grond gekomen. In essentie is dit een zero-configuratie dev-toolkit (# 0CJS) om de WordPress Gutenberg-blokken in een kwestie van minuten te kunnen ontwikkelen zonder React, webpack, ES6/7/8/Next, ESLint, Babel enz. te moeten configureren.

Het volgende is ook de moeite waard om te bekijken:

Atomic Blocks
Atomic Blocks

Hoe zit het dan met snelheid? Je zult waarschijnlijk denken dat WordPress altijd als doel heeft om de prestaties te verbeteren. Toch? Hoewel we hopen dat dit het geval zal zijn, wijzen veel rapporten echter (tot nu toe) op slechtere prestaties.

Opmerking: een aantal hiervan kunnen met een korreltje zout worden genomen, omdat het Gutenberg-team veel updates heeft uitgebracht. En nu WordPress 5.0 officieel is gelanceerd, kan je nog veel meer verwachten.

Het andere nadeel van de update is dat de meeste (niet alle) WordPress-thema’s en -plugins moeten worden herschreven om compatibel met Gutenberg te kunnen zijn – vooral degenen die communiceren met de WordPress-editor. Yoast SEO is een geweldig voorbeeld van een ontwikkelaar van WordPress plugins, die vanaf het allereerste begin heeft meegedaan. Ze kwamen in juli 2017 met hun eerste Gutenberg-update en hebben sindsdien steeds nieuwe updates uitgebracht. Ook al waren ze in het begin wel wat bezorgd over de toegankelijkheid. Het team van WordPress heeft nu met betrekking tot de toegankelijkheid in Gutenberg een verklaring afgegeven.

Als je alle functies van Gutenberg eens echt wilt bekijken en wilt zien hoe het werkt, bekijk dan ons artikel: De Gutenberg WordPress editor nader uitgelegd.

Mocht je er nog niet klaar voor zijn, dan kan je deze verandering uitstellen door de Gutenberg WordPress-editor uit te schakelen.

Het Twenty Nineteen Thema

WordPress 5.0 bevat ook het nieuwe Twenty Nineteen-basisthema. Het wordt van begin tot het eind geleverd met volledige Gutenberg-ondersteuning. We zullen in een volgende post dieper op dit thema ingaan. 😉

Twenty Nineteen WordPress theme
Twenty Nineteen WordPress thema

Hoe Denkt De Gemeenschap Over Gutenberg?

Aangezien WordPress meer dan 32% van alle websites op het internet aandrijft, zal elke belangrijke verandering zoals deze ongetwijfeld voor enige controverse zorgen. Want laten we eerlijk zijn, de WordPress-editor is het afgelopen decennium niet echt veel veranderd.

Als je de Gutenberg WordPress plugin bekijkt, met meer dan 700.000 actieve installaties, heeft deze een waardering van 2,3 van de 5 sterren gekregen. Met maar liefst meer dan 900 beoordelingen met maar 1 ster. Hoewel dit er niet goed uitziet, is het wel belangrijk om te beseffen dat deze mensen Gutenberg hebben beoordeeld toen het nog in beta was. Met zo’n enorme verandering zijn er natuurlijk ook enkele recensies van gebruikers, die eenvoudigweg niet van verandering houden.

Gutenberg WordPress ratings
Gutenberg WordPress ratings

We vroegen gebruikers in een Twitter-poll wat ze vinden van Gutenberg. Van de 450 stemmen zei 42% dat ze er nog niet veel gebruik van hadden gemaakt en dus nog niet echt een mening hadden gevormd. Met de komst van WordPress 5.0 en Gutenberg is dit enigszins beangstigend. 28% zei dat ze negatief tegenover Gutenberg staan, 19% had een positieve houding en 11% was voorzichtig positief.

Ian van Declious Brains heeft ook een zeer goed artikel geschreven waarin hij veel bedenkingen over Gutenberg deelt. Omdat WordPress nieuwe programmeertalen en technologieën implementeert, ontkom je er niet aan dat veel websites bij een upgrade naar WordPress 5.0 niet meer zullen werken. Het is gewoon niet te voorkomen. Tenzij elke afzonderlijke plugin en elk thema dat je gebruikt volledig is bijgewerkt, wat in de meeste gevallen niet het geval zal zijn, kun je moeilijkheden ervaren als het gaat om het oplossen van problemen.

Wie krijgen er het meest te maken met Gutenberg? Bureaus, freelancers en ontwikkelaars. Om die reden is misschien wel goed om er eens goed naar te kijken.

Alsof dat allemaal nog niet genoeg is, is er ook ClassicPress ontstaan. Dit is ruwe versie van WordPress (zonder Gutenberg) die de op CMS gebaseerde zakelijke websitemarkt bedient. De vraag hier is, beginnen we te fragmenteren? Zelfs hun team weet niet hoe ze de plugin en thema compatibiliteit nog aankunnen. Hoe dan ook, dit is absoluut een interessant project om in de gaten te houden.

ClassicPress
ClassicPress

Officiële Lanceringsdatum Voor WordPress 5.0

Wat was de lanceerdatum van WordPress 5.0? Het team achter WordPress had oorspronkelijk 19 november 2018 als datum geprikt om WordPress 5.0 te lanceren. Dit was echter slechts een voorlopige datum, want de officiële release van WordPress 5.0 vond plaats op 6 december 2018!.

Als je werkt met klanten die op WordPress draaien, is dit iets om in gedachten te houden. Je kunt natuurlijk de Classic Editor installeren of de update gewoon uitstellen.

Hoe dan ook, het is slim om goed voorbereid de feestdagen in te gaan. Het laatste dat je wilt is dat jouw klanten juist in deze periode hun website niet kunnen bereiken door de upgrade naar WordPress 5.0.

Hoe Kun Je Je Voorbereiden Op En Updaten Naar WordPress 5.0

We kunnen niet genoeg benadrukken hoe belangrijk het testen van WordPress 5.0 en Gutenberg is. Je moet echt zeker weten dat al je plugins en thema’s naar behoren zullen werken. Als je een op maat gemaakte oplossing hebt, zorg er dan voor dat je contact opneemt met een WordPress ontwikkelaar om het bij te werken. Dit is niet iets dat je WordPress-host voor jou kan oplossen.

Het is belangrijk om te realiseren dat je je website handmatig dient bij te werken naar WordPress 5.0, tenzij je ergens hebt ingesteld dat dit automatisch wordt gedaan. Standaard updatet WordPress alleen kleinere releases automatisch, zoals de update van 4.9.7 naar 4.9.8 en moet je de grotere releases handmatig uitvoeren, zoals de update van 4.9.8 naar 5.0.

Kinsta forceert ook geen grote updates.

WordPress 5.0 en WooCommerce

WooCommerce heeft een officiële verklaring vrijgegeven over de release van WordPress 5.0. Als je WooCommerce gebruikt, zorg dan dat je eerst update naar WooCommerce 3.5.1+ en dan pas update naar WordPress 5.0 om fouten te voorkomen.

WordPress 5.0 en plugins

Yoast is volop bezig met nieuwe features, bugfixes en verbeteringen om de compatibiliteit van Yoast SEO en Gutenberg te verbeteren. We raden je ten zeerste aan om bij te werken naar de nieuwste versie (versie 9.2.0 is uitgebracht op 20 november) voordat je updatet naar WordPress 5.0.

1. Een testomgeving aanmaken

We raden je aan om WordPress 5.0 eerst op een test-site te installeren of binnen de testomgeving van je host. Op deze manier voorkom je dat je knoeit met je live-website. Als je klant bent bij Kinsta, kan je met slechts een aantal klikken eenvoudig je live-site naar een testomgeving kopiëren.

WordPress testomgeving
WordPress testomgeving

2. Maak een back-up van je WordPress-site

Mocht je je tests niet uitvoeren op een ontwikkel- of testsite (wat je wel zou moeten doen), zorg er dan in elk geval voor dat je een volledige back-up van je WordPress-site maakt. Er zijn een heleboel gratis WordPress back-upplugins die je kan gebruiken. Als je klant bent bij Kinsta, dan heb je beschikking over een testomgeving en vier verschillende soorten back-ups, inclusief automatische back-ups die 14 dagen worden opgeslagen.

Omdat WordPress 5.0 zo’n enorme verandering is, raden we ook aan om een downloadable backup te maken van je hele site. Hiermee bedoelen we een back-up van alle bestanden en de MySQL-database. Je weet namelijk nooit zeker of je iets over het hoofd hebt gezien nadat deze 14 dagen zijn verlopen. Het is altijd handig om een back-up tot je beschikking te hebben. Klanten van Kinsta kunnen met een enkele muisklik een volledige back-up aanmaken in het MyKinsta Dashboard.

Volledige WordPress back-up aanmaken
Volledige WordPress back-up aanmaken

3. Hoe bij te werken naar WordPress 5.0 (in een live- of testomgeving)

Afhankelijk van je hostingprovider kan het zijn dat je website automatisch wordt geüpdatet naar WordPress 5.0 zodra de release uit is. Het is goed om te weten dat de WordPress-core dit niet standaard doet. Bij Kinsta upgraden we je website niet automatisch naar WordPress 5.0, tenzij je WP_AUTO_UPDATE_CORE op ’true’ hebt ingesteld in het wp-config.php-bestand van je website. Dit hebben we expres gedaan, omdat je grote updates altijd zou moeten testen.

WordPress 5.0 is beschikbaar in het beheerdersdashboard. Klik op het updates-pictogram in de toolbar. Klik vervolgens op de knop ‘Update Now’.  Je site wordt in onderhoudsmodus gezet , terwijl de updates worden doorgevoerd. Wanneer de updates zijn voltooid, is de site weer bereikbaar.

Updaten naar WordPress 5.0
Updaten naar WordPress 5.0

Vervolgens word je gevraagd om je WordPress-database bij te werken.

WordPress 5.0 database-update vereist
WordPress 5.0 database-update vereist

Als alles goed is gegaan met de update, dan zou je nu het ‘What’s New’ scherm moeten zien. Dat was het!

Probleemoplossing van WordPress Update

Zoals met elke nieuwe uitgave van WordPress, zijn er altijd wel mensen die problemen ondervinden. Er zijn immers duizenden plugins en thema’s op de markt. Hier zijn een aantal manieren om de vaakst voorkomende problemen op te lossen.

4. Plugins en thema’s checken (Gutenberg kan ze negatief beïnvloeden)

De nieuwe Gutenberg Editor is onderdeel van WordPress 5.0. Mocht je het willen, dan kan je deze uitschakelen en de klassieke editor blijven gebruiken. Of misschien heb je wel een bug gevonden die zorgt dat je website niet meer naar behoren functioneert.

Als onderdeel van het testen van Gutenberg, moet je ervoor zorgen dat al jouw externe plugins en thema’s goed samenwerken met Gutenberg. De kans is groot dat alles wat ook maar iets te maken heeft met de WordPress-editor niet meer 100% werkt. Een goed voorbeeld is Yoast SEO, omdat deze plugin aangepaste meta-boxes gebruikt. Een ander voorbeeld is Advance Custom Fields.

Controleer dus altijd of de plugin of thema nog werkt en neem indien nodig contact op met de ontwikkelaars. Veel van hen hebben al de nodige updates doorgevoerd of aangegeven dit te zullen doen. Veel thema-ontwikkelaars brengen ook hun eigen Gutenberg-blokken uit.

Na het installeren van WordPress 5.0 worden alle pagina’s en artikelen in de nieuwe Gutenberg-editor geopend wanneer je ze wil wijzigen. Als je de plugin hebt geïnstalleerd met de klassieke editor, dan zie je deze optie als het goed is ook.

Bewerken met Gutenberg
Bewerken met Gutenberg

Wat Gebeurt Er Met De Huidige Content?

Wat gebeurt er met de content, die je in de klassieke editor hebt gemaakt toen deze in de nieuwe Gutenberg-editor werd geopend? Kortom, het volledige bericht zal als een groot TinyMCE-editor venster verschijnen. Ze hebben dit gedaan om het contentformaat van al je berichten en pagina’s te kunnen behouden. Om te kunnen profiteren van de Gutenberg-editor, kun je de optie “Convert to Blocks” selecteren.

Gutenberg converteren naar blokken
Gutenberg converteren naar blokken

Alles zal dan automatisch worden omgezet in de nieuwe Gutenberg-blokken.

Geconverteerde Gutenberg-blokken
Geconverteerde Gutenberg-blokken

Wat Gebeurt Er Dan Met De Shortcodes?

Hetzelfde geldt voor shortcodes. In dit voorbeeld hadden we al een contactformulier voor NinjaForm. Het werd met behulp van een shortcode in de klassieke editor geplaatst. Dus in de Gutenberg-editor selecteren we dan opnieuw “Convert to Blocks”.

Gutenberg shortcode
Gutenberg shortcode

De shortcode wordt vervolgens omgezet in een shortcode-blok van Gutenberg. Het contactformulier wordt nog steeds prima weergegeven op de site.

Geconverteerd shortcode blok van Gutenberg
Geconverteerd shortcode blok van Gutenberg

Samenvatting

WordPress 5.0 and Gutenberg is the biggest update to WordPress that we’ve had in a long time. It affects everyone, from how users interact with the editor and write content, to how developers code plugins and themes. Only time will tell how successful the Gutenberg project is. Hoe het ook zij, we bevelen iedereen van harte aan om WordPress 5.0 in een testomgeving te testen, alvorens de gehele site te updaten.

Wat denk jij van WordPress 5.0 of Gutenberg? We zouden het leuk vinden als je hieronder schrijft wat je ervan vindt!

Brian Jackson

Brian heeft een enorme passie voor WordPress, gebruikt het al meer dan tien jaar en heeft zelfs al aantal premium plugins ontwikkeld. Brian houdt van bloggen, films en hikes. Kom in contact met Brian op Twitter.