De nieuwe Gutenberg-bewerkingsinterface is dit jaar een grote verandering voor WordPress 5 en zal van invloed zijn op ontwikkelaars van WordPress-plug-ins, themaontwerpers en makers van websites.
In deze video laat ik je zien hoe je Gutenberg kunt instellen als een plug-in op je bestaande site en hoe je aan de slag kunt gaan met de Gutenberg-editor om inhoud te maken.
Volg en je zult een aantal van de nieuwe functies van Gutenberg uit eerste hand ervaren.
Een goed startpunt om meer te weten te komen over Gutenberg staat op de Gutenberg-pagina in de WordPress Codex. Het geeft je een overzicht van waar Gutenberg voor staat en vertelt je ook hoe je het kunt helpen verbeteren en de toekomst kunt opbouwen. U kunt dat doen door uw feedback te sturen via de feedbackvragenlijst, die u ook kunt gebruiken om ondersteuning te vragen.
U kunt ook de testvereisten bekijken om Gutenberg te testen. De reden waarom het belangrijk is om aan deze vereisten te voldoen, is dat iedereen op een consistente manier test, en het team dat Gutenberg ontwikkelt helpt om het zo goed mogelijk te maken.
Gutenberg maakt nog geen deel uit van de kern van WordPress, maar komt in een toekomstige versie. Houd er rekening mee dat het in de tussentijd misschien wel zal veranderen, deels vanwege die feedback en deels vanwege het werk dat nog steeds bezig is om het zo goed mogelijk te maken. Maar in de tussentijd, laten we eens kijken hoe u Gutenberg nu op uw site kunt krijgen en u een snel overzicht kunt geven van hoe het eruit ziet.
De manier waarop je Gutenberg nu kunt krijgen, is via een plug-in. Dus installeer het op de gebruikelijke manier - ga naar Plug-ins> Voeg nieuw toe, zoek naar "Gutenberg", en wanneer je het hebt gevonden, klik je op Installeer nu en dan Activeren.
Nu u de plug-in hebt geïnstalleerd, is de Gutenberg-editor actief op uw site.
Ik zal een bestaand bericht op mijn site openen om je te laten zien hoe het berichtbewerkingsscherm eruit ziet in Gutenberg.
Je kunt zien dat dit er heel anders uitziet dan hoe het vroeger was. Wanneer ik over dingen hang, verschijnen pictogrammen met drie punten aan de rechterkant, die laten zien dat elk element in mijn inhoud een blok is geworden.
Als ik in een blok klik, heb ik iets dat een beetje meer vertrouwd lijkt - het lijkt op het oude aanrecht in de klassieke editor. Maar u kunt zien dat u niet beschikt over de tabbladen voor de codeweergave en de normale weergave bovenaan.
Aan de rechterkant heb ik een iets andere set van wat vroeger metaboxen waren, die er in de oude editor nogal apart uitzagen. Dit lijkt veel meer op de Customizer. Dus als je met de Customizer in WordPress hebt gewerkt, zal deze lay-out je bekend voorkomen. U kunt op elke kop klikken om het bijbehorende gedeelte uit te vouwen. Over het algemeen maakt het dingen een beetje netter en vermindert het de noodzaak om te scrollen.
U kunt meer blokken toevoegen door op het plusteken linksonder te klikken. Er verschijnt een menu met de verschillende opties.
Als u een ervaren WordPress-gebruiker bent en met name als u een WordPress-ontwikkelaar bent, kunt u hier met afgrijzen uw handen uitwerpen. Maar ik zie hoe voor minder ervaren gebruikers en mensen die meer visueel ingesteld zijn, dit de zaken een stuk gemakkelijker lijkt te maken.
Gutenberg maakt het ook gemakkelijker voor u om dingen te verplaatsen. Dus ik ga een alineablok maken van een deel van de bestaande inhoud in mijn bericht. Als ik dat heb gedaan, kan ik vervolgens mijn blokken selecteren en ze op en neer bewegen door op de pijlen aan de linkerkant te klikken.
Dit geeft u veel flexibiliteit als het gaat om het verplaatsen van dingen op uw site en het omgaan met dingen op een visuele manier.
Er zijn ook andere soorten blokken. Een lijst wordt bijvoorbeeld op zichzelf een blok.
Ik begin met het opsplitsen van mijn bestaande inhoud in blokken door op het besturingspictogram te klikken en te selecteren Converteren naar blokken vanuit het menu dat verschijnt.
Gutenberg scheidt vervolgens mijn kopjes en individuele paragrafen, en het maakt ook afzonderlijke blokken voor elke lijst. Het is dus heel snel en eenvoudig om uw bestaande berichten om te zetten in Gutenberg-compatibele inhoud.
U herinnert zich aan het begin dat ik zei dat er bovenaan geen tabbladen waren voor de tekstweergave en de codeweergave. In plaats daarvan kun je gewoon aan de code werken voor een individueel blok. Dus als ik op het besturingspictogram aan de rechterkant klik, kan ik selecteren Bewerken als HTML. Vervolgens wordt het blok in de codeweergave weergegeven en kan ik de code in dat specifieke blok bewerken.
Als je op mij lijkt en je hebt diep in de code achter een lange post moeten graven, kan het heel verwarrend zijn om te proberen het stuk tekst te vinden waarmee je hebt gewerkt, dus dit maakt het veel, veel eenvoudiger om met een bepaald stuk code te werken.
Dus blokken maken Gutenberg echt tot wat het is, en ik hoop dat dit je een beetje een gevoel van blokkades heeft gegeven en hoe ze werken. Een blok komt in principe overeen met een element in uw HTML. Als u de uitvoermarkering voor uw bestand zou bekijken, zou u zien dat elk van deze zich op hetzelfde niveau bevond. Dus je hebt koppen, alinea's en lijsten en ze bevinden zich allemaal op hetzelfde niveau in je HTML.
Je kunt ook blokken splitsen en samenvoegen met hetzelfde besturingsmenu dat uit het pictogram tevoorschijn komt met de drie stippen, en er is ook een ongedaan maken knop bovenaan, wat erg handig is. En met lijsten kunt u gemakkelijk schakelen tussen verschillende indentatieniveaus of tussen lijsten met opsommingstekens en genummerde lijsten, gewoon door het menu boven het betreffende blok te gebruiken.
Nu ik mijn inhoud in afzonderlijke blokken heb omgezet, kan ik ook klikken Blok in de zijbalk aan de rechterkant en wijzig de instellingen voor elk blok.
U kunt ook de instellingenwerkbalk weergeven en verbergen door op het bedieningsmenu naast een blok te klikken en te kiezen Toon geavanceerde instellingen of Verberg geavanceerde instellingen. Als je het verbergt, krijg je een mooie, schone bewerkingservaring.
Dus dat geeft je een overzicht van de belangrijkste dingen die je kunt doen met blokken in Gutenberg. U kunt blokken toevoegen, het type blok wijzigen dat iets is en u kunt de onderliggende code bewerken. Je kunt blokken dupliceren, je kunt ze samenvoegen, je kunt ze splitsen en je kunt ze verplaatsen in je document.
Ik heb Gutenberg nog niet op een live-set gebruikt, maar als ik er doorheen rijd voor deze cursus, ben ik behoorlijk opgetogen over hoe Gutenberg werkt en hoe het me kan helpen met het bewerken van mijn eigen inhoud op mijn WordPress-site.
Ik hoop dat Gutenberg je van dienst zal zijn en ik hoop dat je deze snelle beschrijving van de belangrijkste functies leuk vond.
Leer hoe u WordPress kunt gebruiken of kunt vastlopen in WordPress en onze volledige handleidingen leert kennen. Alle cursussen in deze handleidingen zijn gratis te bekijken met een abonnement op Envato Elements. Voor een enkel laag maandelijks bedrag krijg je onbeperkte toegang tot onze groeiende bibliotheek van meer dan 1.000 videocursussen en toonaangevende e-boeken op Envato Tuts+.
Bovendien krijgt u nu onbeperkte downloads van de enorme Envato Elements-bibliotheek met meer dan 500.000 creatieve items. Creëer met unieke lettertypen, foto's, afbeeldingen en sjablonen en lever sneller betere projecten.