Een accordeon is een toggle-gebaseerd opmaakelement dat inhoud verbergt en onthult als erop wordt geklikt. Je ziet een kop, klikt erop en de rest van de inhoud schuift naar beneden. Klik er nogmaals op en de inhoud wordt verborgen. Het is als een dropdown, maar dan voor inhoud in plaats van menu's.
Wat gebeurt er als je accordeons op de juiste manier implementeert? Je inhoud wordt makkelijker te verkennen, gebruikers blijven gefocust, mobiele navigatie verbetert en zoekmachines kunnen je belonen met een betere zichtbaarheid. Als je alles goed doet, werken ze als een inhoudsopgave die vragen beantwoordt nog voordat gebruikers ze stellen.
Deze handleiding laat je zien hoe je accordeons kunt implementeren in WordPress met behulp van editor-vriendelijke tools die het proces eenvoudig en schoon houden, zonder dat je iets hoeft te coderen.
Accordeons toevoegen in WordPress
Er zijn meer dan één manier om accordeons toe te voegen in WordPress, maar ze zijn niet allemaal eenvoudig te gebruiken in de blok-editor. In de volgende secties beginnen we met een basismethode met behulp van een ingebouwd blok, waarna we overgaan naar een flexibelere optie met een plugin.
Methode 1: Het oorspronkelijke detailblok gebruiken
De eenvoudigste manier om een accordeon te maken in WordPress is door gebruik te maken van de ingebouwde Details blok. Laten we eens kijken hoe het werkt.
Stap 1: Het blok Details toevoegen
Open je bericht of pagina in de Blok-editor. Klik op het pluspictogram (+), zoek naar Details en voeg het blok in.
Stap 2: De titel en inhoud toevoegen
Voer uw accordeontitel in de plaatshouder "Samenvatting schrijven" in. Klik vervolgens op het pijlpictogram ernaast om de sectie uit te vouwen. Eenmaal uitgeklapt verschijnt er een inhoudsgebied onder waar je tekst, afbeeldingen, lijsten of andere blokken kunt toevoegen.
Stap 3: Extra schakelaars toevoegen
Om meer accordeonitems toe te voegen, herhaal je hetzelfde proces door nieuwe Details-blokken in te voegen. Voor een geneste lay-out vouw je het inhoudsgebied van een bestaand Details-blok uit, klik je op het plus-pictogram (+) erin en voeg je nog een Details-blok toe.
Deze methode is perfect voor snelle FAQ's of minimale opstellingen. Houd er wel rekening mee dat deze methode alleen basisstyling biedt en geen geavanceerde ontwerpopties bevat.
Methode 2: De Ultimate Blocks Plugin gebruiken
Als je meer stylingopties en betere controle over je accordeon wilt, is de Ultieme Blokken plugin is een geweldige keuze. Het biedt een Content Toggle-blok dat perfect werkt in de Block Editor.
Stap 1: De plugin aan je site toevoegen
Ga vanuit je WordPress dashboard naar het Plugins menu en klik op Add New. Typ in de zoekbalk Ultimate Blocks en klik op Install Now op de plugin kaart. Zodra de installatie is voltooid, activeer je de plugin om de nieuwe blokken beschikbaar te maken in de editor.
Stap 2: Voeg het Content Toggle-blok in
Open de pagina of het bericht waar je de accordeon wilt hebben. Klik op het pluspictogram (+), zoek naar Content Toggle en voeg het toe. Dit blok maakt een uitklapbare sectie met een titel en inhoudsgebied.
Stap 3: Titel en inhoud toevoegen
Typ de titel van je accordeon in het labelveld en voeg eronder inhoud toe. Je kunt elk type blok in de toggle invoegen, zoals tekst, afbeeldingen, knoppen, lijsten of zelfs een ander Content Toggle-blok in het inhoudsgebied om een geneste accordeon te maken.
Om meer togglesecties toe te voegen, klik je gewoon op het (+)-pictogram wanneer je met de muis over de bestaande panelen beweegt. Om een paneel te verwijderen, doe je hetzelfde behalve dat je in plaats van op het (+) pictogram te klikken, het (x) pictogram in de rechterbovenhoek kiest.
Stap 4: De Accordeon aanpassen
In het paneel met blokinstellingen aan de rechterkant kun je de titel van het paneel bepalen, de wisselstatus aanpassen, FAQ Schema inschakelen, een ingebouwde zoekoptie voor je accordeon toevoegen, een statuspictogram kiezen, tekst- of achtergrondkleuren wijzigen en nog veel meer.
Als je het gebruikt voor FAQ's, kun je ook FAQ Schema-markering inschakelen via de instellingen om je inhoud te laten kwalificeren voor rich snippets in Google Search.
Conclusie
Als het je doel is om lange inhoud makkelijker scanbaar te maken, bieden accordeons een schone oplossing. Je hebt twee benaderingen geleerd: het eigen Details-blok biedt een lichtgewicht setup zonder extra plugins en laadt snel. Het blok Content Toggle van Ultimate Blocks voegt geavanceerde stylingregelingen, geneste panelen en een ingebouwd FAQ-schema toe. Beide methoden verbeteren de mobiele bruikbaarheid en het SEO-potentieel. Kies de aanpak die het beste past bij je workflow en contentbehoeften.
