-
Notifications
You must be signed in to change notification settings - Fork 0
Gutenberg
Deze pagina is een eerste opzet en zal in de loop van de tijd verder worden uitgebreid
Op 6 december 2018 kwam Wordpress 5.0 uit met daarin de nieuwe editor Gutenberg. In tegenstelling tot de oude editor, die gericht was op het vullen van één pagina met tekst en misschien wat plaatjes, sluit de nieuwe editor veel meer aan op het moderne web, waar een pagina vaak bestaat uit talloze onderdelen die er allemaal anders uit kunnen zien en verschillende soorten inhoud kunnen bevatten.
Deze onderdelen heten in Gutenberg blokken. Een blok kan gewoon een (tussen)kop, tekstalinea of afbeelding zijn, maar ook bijzondere onderdelen zoals een omslag (paginabrede afbeelding met een grote tekst erin), citaat, een grote knop, een tabel, een facebook post, etc. Naast alle standaardfunctionaliteit, is het aantal mogelijke blokken dankzij plugins vrijwel eindeloos (denk: Google Maps, fotopresentaties, uitklapbare blokken).
Ik ben zelf erg te spreken over de mogelijkheden van Gutenberg. De gebruiker kan meer zaken zelf in de pagina aanpassen en op een eenvoudige manier complexe pagina’s inrichten terwijl er tegelijkertijd zorg wordt gedragen voor een goede weergave aan de voorkant. Ik raad dan ook aan de nieuwe editor een tijdje uit te proberen om te zien wat er allemaal mee mogelijk is.
Bij de update naar Wordpress 5.0 wordt de nieuwe editor automatisch geïnstalleerd.
Omdat het indelen van een pagina in Gutenberg totaal anders werkt, worden de bestaande pagina’s niet automatisch omgezet. In plaats daarvan zul je zien dat er één blok is ingevoegd van het type Klassiek. Je kunt hier twee dingen mee doen:
- Dit blok als één geheel op de oude manier blijven bewerken, of
- Op de drie puntjes klikken en dan op Omzetten naar blokken. Wordpress probeert dan de bestaande pagina zo goed mogelijk te vertalen naar de nieuwe blokken
Het blok met de klassieke editor erin:

De optie ‘Omzetten naar blokken’:

Beperkingen zijn er eigenlijk niet: Gutenberg kan alles wat de oude editor kan en nog veel meer.
Wat (in het begin) wel een beperking kan zijn, is dat ik voor al deze nieuwe blokken nog geen aanpassingen in de styling van de site heb gedaan. Het overgrote deel zal netjes de bestaande styling overnemen, maar mocht je nu ineens hele onverwachte resultaten krijgen, laat het me dan zo snel mogelijk weten, dan kan ik het fixen.
Mocht je desondanks toch tot de conclusie komen dat de nieuwe editor niets voor jou is, dan kunnen we de klassieke editor weer terugzetten. Wordpress heeft aangegeven deze te ondersteunen ‘tot tenminste 2022 of zolang het nodig is’.
Zodra je een nieuwe pagina maakt, kun je onder de titel direct beginnen te typen om een nieuw blok toe te voegen. Verder kun je altijd linksboven op het plusje drukken om de volledige lijst met beschikbare blokken tevoorschijn te toveren. Je ziet dan in eerste instantie alleen de meest gebruikte blokken, maar kunt ook naar beneden scrollen of iets in het zoekvak typen om meer mogelijkheden te vinden.
Een nieuwe pagina:

De lijst met beschikbare blokken:

Zodra je een blok hebt toegevoegd, verschijnt deze in je pagina.
Als je met je muis over de blokken beweegt, zie je een blauw lijntje om het actieve blok. Klik om deze te selecteren. Nu kun je het blok – afhankelijk van de bloksoort (zie Soorten blokken) – bewerken.
Naast de inhoudelijk bewerkmogelijkheden (zoals tekst bewerken of afbeeldingen kiezen) zijn er diverse instellingen over het blok zelf die je kunt wijzigen. Een deel hiervan verschijnt boven het blok wanneer deze geselecteerd is (bij een afbeelding kun je hier bijv. de uitlijning kiezen). Een groot deel verschijnt daarnaast rechts in het scherm in het deelvenster Blok

Je kunt een blok verslepen aan de zes kleine puntjes die links ervan verschijnen wanneer je er met je muis op staat. Alternatief kun je de pijltjes op deze plek gebruiken om het blok een plek naar boven of beneden te verschuiven.

Je verwijdert een blok door het te selecteren, op de drie puntjes boven het blok te klikken en dan Blok verwijderen te kiezen.

Een kop is een tussenkop die je tussen andere blokken (zoals alinea’s) kunt plaatsen. Je kunt hier kiezen tussen verschillende soorten van H1 (hoofdkop) tot H6 (de ‘kleinste’ tussenkop). De conventie is om H1 maar één keer te gebruiken op een website (namelijk voor de titel) en daarna met H2 en lager te werken.
Dit is gewoon een stuk tekst. Elke enter zorgt voor een nieuwe paragraaf die weer als los blok is in te stellen. Per paragraaf kun je zaken als (achtergrond)kleur en tekstgrootte kiezen.
Een afbeelding kun je op de vertrouwde manier uploaden en toevoegen. Met de knoppen voor uitlijnen kun je ervoor zorgen dat de afbeelding links of rechts van een ander blok wordt uitgelijnd, zodat bijv. tekst er omheen kan lopen.
De knoppen voor uitlijnen:

Een ‘fotoalbum’ van kleine foto’s die (optioneel) groter worden weergeven wanneer je erop klikt.
Om de thumbnails aanklikbaar te maken, kies je Link naar: Mediabestand.

In tegenstelling tot voorheen, zijn er meerdere manieren om tekst en afbeeldingen te combineren. In plaats van twee blokken, kun je er ook één gebruiken met daarin tekst en een afbeelding gecombineerd.
Een opsommingslijst met puntjes of cijfers, werkt verder net als een paragraaf
Eindelijk kun je eenvoudig zelf tabellen invoeren in Wordpress
Een tekst met speciale styling om citaten uit te lichten (noot: het kan zijn dat deze eerst door mij aan het thema toegevoegd moet worden om mooi uit te komen)

Een grote knop om de aandacht mee te trekken (de styling hiervan moet mogelijk nog door mij geconfigureerd worden).
Spreekt voor zich