Tot 2018 had je binnen WordPress niet de mogelijkheid om een website te bouwen met een pagebuilder. Je was hiervoor aangewezen op andere thema’s zoals Enfold, Avada en Divi. Of je thema moest gebruik maken van de plugin van Visual Composer/WP Bakery Builder. Maar dit gaat veranderen. Gutenberg is de pagebuilder van WordPress zelf waar hard aan gewerkt is en waar op voorhand bergen kritiek op gegeven is. Wij schreven al eerder een blog over de Gutenberg Pagebuilder.
In deze blog neem ik je mee om te kijken naar wat er veranderd is aan Gutenberg sinds de vorige blog. De planning is om Gutenberg voor het einde van het jaar in WordPress versie 5 op te nemen. Daarnaast wil ik met je kijken of Gutenberg compatible is met de veelgebruikte thema’s Enfold, Avada en de Visual Composer Plugin.
- Avada theme en Gutenberg
- Werkt Avada goed met Gutenberg?
- Enfold theme en Gutenberg
- Werkt Enfold goed met Gutenberg?
- Visual Composer en Gutenberg
- Werkt Visual Composer goed met Gutenberg?
- Conclusie
1. Avada theme en Gutenberg
De ontwikkelaars van het Avada thema zijn druk bezig met de implementatie van Gutenberg. Of eigenlijk de compatibiliteit van beiden. Er is een webpagina waar ze regelmatig updates plaatsen. De hoofdzaken hieruit zullen wij hieronder beschrijven.
Sinds WordPress 4.9.8 krijg je na het inloggen de melding om de Gutenberg plugin te installeren, de Classic Editor te installeren of helemaal niets te doen. Als je gebruik maakt van Avada met de Fusion Builder heb je in principe niets extra nodig. Als je wilt testen met Gutenberg is het sowieso af te raden om dit op een live website te doen, aangezien Gutenberg nog niet volledig uitontwikkeld is en nog bugs kan bevatten die jouw website kapot maken.
Vanaf WordPress versie 5 zal Gutenberg de standaard editor zijn. Gaat je website dan direct stuk zodra je website geüpdatet is naar WordPress 5?
Om met Gutenberg te werken binnen Avada is er een aantal aanpassingen gemaakt vanaf Avada versie 5.7:
- De standaard ‘Nieuwe pagina’ button opent het standaard scherm dat je gewend bent met de Fusion Builder als je kiest voor ‘klassieke editor’ of ‘fusion builder’. Binnen een bericht of pagina kun je vervolgens switchen tussen Fusion Builder, Gutenberg.
Als je in de thema-instellingen de ‘auto activate Fusion Builder’ optie activeert zal iedere nieuwe pagina en nieuw bericht openen in de normale jou bekende Fusion Builder layout. - Als je in het pagina-overzicht met je muis over de pagina’s heen gaat zul je twee opties zien ‘bewerk met klassieke editor’ en ‘bewerk met Gutenberg editor’.
1.1 Werkt Avada goed met Gutenberg?
Voor de test hebben we een demolocatie opgezet en daar een volledige demo van Avada geïnstalleerd. Als je vervolgens naar het pagina overzicht gaat en je bewerkt de pagina’s zoals je gewend bent via ‘bewerken’ dan werkt de fusion builder gewoon zoals je nu ook gewend bent.
Je kunt tijdens het hoveren ook klikken voor ‘bewerk met de classic editor’. Als je zoals in de vorige alinea aangegeven hebt dat de default editor Fusion Builder moet zijn dan krijg je ook nu deze layout.
Het is op dit moment niet mogelijk om vanuit de Fusion Builder te switchen naar de Gutenberg Editor omdat de codes voor Fusion Builder simpelweg niet bestaan in Gutenberg. Je kunt vanuit het bewerken van de pagina in Fusion Builder sowieso niet switchen naar de Gutenberg Editor. Hiervoor moet je eerst terug naar het pagina-overzicht en daar kiezen voor de Gutenberg Editor.
Om deze reden adviseren de makers van het Avada theme ook met klem om als je Gutenberg wilt testen, dit te doen op een testsite en niet op een live site. De kans dat je website niet meer reageert zoals je wilt of er anders uitziet is heel realistisch en dat kan niet de bedoeling zijn.
Het is op dit moment zelfs al mogelijk om binnen de Gutenberg editor Avada items in te voegen. De integratie van beiden is dus al een aardig eind op weg.
Wij hebben getest of het mogelijk is om zowel pagina’s te gebruiken als pagina’s gebouwd met de Gutenberg editor, dit is geen enkel probleem. Houd er dus alleen rekening mee dat je een pagina of in Fusion Builder of in Gutenberg bouwt.
Om de vraag dan te beantwoorden: Werkt Avada samen met Gutenberg? Ja is het simpele antwoord.
2. Enfold theme en Gutenberg
In ons portfolio zitten naast Avada sites ook een groot aantal sites gebouwd met het Enfold theme voor WordPress. Voor ons is het dus ook belangrijk om te weten of Enfold op dit moment al compatible is met Gutenberg. Uiteraard zijn we begonnen bij de website van het thema zelf maar het was behoorlijk zoeken naar officiële informatie vanuit de themamakers.
Via de officiële kanalen is te lezen dat de Enfold themamakers beloofd hebben dat Enfold net voor, of mogelijk net na de release van WordPress 5 met standaard Gutenberg aan boord helemaal compatible zal zijn. Op 16 november werd in het supportforum nog genoemd dat binnen 10 dagen er een compatible versie zou zijn. Maar hoe compatible is het op dit moment? Wij testen het zelf uit.
2.1 Werkt Enfold goed met Gutenberg?
Net als in het Avada thema heb je binnen Enfold de mogelijkheid om Gutenberg direct vanuit het dashboard te activeren. Als je dit gedaan hebt krijg je in het pagina-overzicht bij hover van een pagina classic editor and advanced layout builder als optie. Daarnaast heb je de optie voor Gutenberg editor.
Kies je voor classic and advanced layout builder dan krijg je gewoon de oude vertrouwde Avia builder te zien, de originele ingebouwde pagebuilder van Enfold. Dit werkt zonder problemen als de Gutenberg editor geactiveerd is. Ook hier is het niet de mogelijkheid om vanuit de advanced editor te switchen naar de Gutenberg editor. Als je een pagina die opgemaakt is in de Avia builder opent met de Gutenberg editor zie je alle originele code. Dit werkt dus simpelweg niet. Op zich ook niet vreemd aangezien het twee totaal verschillende builders zijn.
Ook binnen het Enfold thema is het mogelijk om pagina’s te blijven maken in de Avia builder als Gutenberg geactiveerd is. Binnen het paginaoverzicht kun je bovenaan kiezen om een pagina te maken in de classic Avia builder of in de Gutenberg editor. Ook in Enfold kun je dus mixen met Gutenberg pagina’s, maar alsnog het Enfold thema blijven gebruiken.
Bestaande pagina’s die je wilt aanpassen dat kan nog steeds in de standaard Enfold editor. Bij nieuwe pagina’s heb je de keuze: Avia builder of Gutenberg.
3. Visual Composer en Gutenberg
Visual Composer is natuurlijk geen thema, maar wordt wel als pagebuilder in plugin-vorm meegeleverd bij honderden thema’s. Het voordeel van deze manier van werken is dat bij de switch naar een ander thema jouw content in de huidige vorm grotendeels bewaard blijft. Een nadeel van Visual Composer is dat veel thema’s geen licentie meeleveren. Je bent dus afhankelijk van de themamaker voor eventuele updates. Dit is een veiligheidsrisico dat door veel WordPress gebruikers over het hoofd gezien wordt.
Maar werkt een website met een willekeurig thema en de Visual Composer plugin dan met de Gutenberg Editor samen? Wij hebben het getest met het Newsmag thema waar de plugin bijgeleverd is.
De installatie van de Gutenberg editor via het dashboard leverde geen noemenswaardige problemen op.
3.1 Werkt Visual Composer goed met Gutenberg?
Net als bij de eerder beschreven thema’s heb je binnen Visual Composer de mogelijkheid om bestaande pagina’s te blijven bewerken met Visual Composer. En je kunt nieuwe pagina’s aanmaken met de Gutenberg editor. Dit werkt prima.
De makers van Visual Composer hebben ook een Gutenberg-element toegevoegd. Dit kun je gratis installeren via de Hub. Deze bereik je via de instellingen van Visual Composer in je dashboard.
De stappen die je volgt om het Gutenberg element binnen Visual Composer te activeren:
- Ga naar de Hub en zoek het Gutenberg element
- Download het Gutenberg element en voeg het toe aan je elementenlijst
- Zorg ervoor dat je de Gutenberg plugin geactiveerd hebt
- Voeg het element toe binnen je pagina’s waar je wilt
- Open het element en klik op ‘open Gutenberg’
- Maak je eigen layout binnen Gutenberg
- Sluit de Gutenberg editor
- Sla de pagina op
Uiteraard kan het ook zo zijn dat je alles al in Visual Composer opgemaakt hebt en Gutenberg helemaal niet nodig hebt. De stappen die je hiervoor volgt zijn:
- Navigeer naar Visual Composer – Settings
- Ga naar de Gutenberg instellingen en selecteer disable
- Sla de wijzigingen op
Ook Visual Composer is dus geschikt om samen te werken met Gutenberg. Houd er wel rekening mee dat je de nieuwste versie gebruikt, oudere versies zijn door ons niet getest.
4. Conclusie
De wereld van WordPress rommelt sinds de aankondiging van Gutenberg. Nu de releasedatum steeds dichterbij komt wordt het er niet minder om. Het is een enorme aanpassing in de basis van WordPress. Websites die al jaren niet meer bijgewerkt zijn gaan gegarandeerd in de problemen komen.
Feit is dat Gutenberg webdesigners een hoop vragen op gaat leveren. Hebben wij op iedere vraag al en antwoord? Nee buiten testen kunnen wij ook lang niet alle vragen beantwoorden. Uiteraard volgen wij de ontwikkelingen op de voet en testen wij waar mogelijk direct aanpassingen.
Wat wij in ieder geval zien is dat Gutenberg sinds ons vorige blog een aantal maanden geleden behoorlijk verder ontwikkeld is. Van een paar standaard elementen begint de bibliotheek met elementen nu behoorlijk te groeien. Wij hebben goede hoop op Gutenberg dat dit potentie heeft om in de toekomst overige pagebuilders te vervangen.
Op Themeforest.net is sinds een aantal weken een nieuw criterium toegevoegd aan de thema directory. Je kunt nu selecteren op Gutenberg compatible thema’s op Themeforest. Er staan op dit moment nog weinig thema’s op die compatible zijn. Dit aantal zal de komende maanden hard gaan groeien.
Heb jij al ervaring met Gutenberg? De beoordelingen in de WordPress repository zijn nog niet heel positief. Maar laten we positief blijven, het systeem is nog in ontwikkeling. Maar een release in januari 2019 zou voor ons geen probleem zijn. Extra tijd om bugs op te sporen en te fixen en daarnaast, in december is het een topmaand voor veel bedrijven dus zit niemand te wachten op een website of WooCommerce webshop met Gutenberg die offline is of niet meer functioneert. Dus het advies is op voorhand al, niet updaten tot er minimaal een aantal nieuwe versies uitgekomen zijn. Wil je testen, doe het op een losse omgeving. Hoe sta jij er tegenover? Laat het ons weten in een reactie.
