Wat is een uitklapbare accordeon in WordPress website

Een accordeon is een lijst waarvan je de verschillende onderdelen kunt “openklappen” om meer informatie te krijgen. Zo voorkom je dat je bezoekers eindeloos moeten scrollen om de informatie te vinden waar ze naar op zoek zijn. Sommige (betaalde) WordPress themes hebben standaard functionaliteit ingebouwd om een accordeon te maken. Enkele voorbeelden van thema's die dit hebben:

• OceanWP wordpress thema template review
• Blocksy WordPress thema review Gutenberg speciaal
• Kadence WordPress thema review voordelen nadelen
• Enfold | WordPress thema review test Envato template Kriesi
• Avada | WordPress thema review test handleiding Fusion Builder
• Flatsome | WordPress thema review test Envato template UX-themes
• Divi wordpress thema page builder review test elegant themes template
• Kalium | WordPress thema review test Envato template
• X theme | WordPress thema review test gratis betaald Pro template

Uitklapbare accordeon sectie maken met WordPress plugin

Wij hebben verschillende plugins voor u getest en de beste voor u op een rijtje gezet.

Arconix Kortcodes

Arconix Shortcodes is een gratis plugin en geeft je verschillende shortcodes waarmee je een accordeon aan je website kunt toevoegen. Met deze plugin kun je niet alleen accordeons maken, maar ook tabbladen toevoegen aan je pagina's en verschillende soorten knoppen toevoegen.

Accordeon

De gratis Accordion plugin met 35.000 downloads wordt vaak geüpdatet en biedt een intuïtieve interface waarin je je accordeons kunt maken. Je kunt deze accordeons vervolgens in je pagina's of posts gebruiken met een shortcode.

Easy Accordion

Deze gratis accordeon plugin richt zich op accordeons, maar biedt tientallen verschillende lay-outs en zelfs effecten die je kunt gebruiken voor je accordeon. Als je allerlei animaties aan je accordeons wilt toevoegen, dan is deze plugin iets voor jou.

Shortcodes Ultimate

Als je WordPress veel gebruikt, heb je de Shortcodes Ultimate plugin misschien al gezien. Deze plugin niet alleen een shortcode voor accordeons toe, maar ook voor tientallen andere elementen die je misschien zou willen gebruiken. Zo kun je tabbladen maken, maar ook kolommen, sliders en nog veel meer!

Uitklapbare accordeon sectie maken zonder plugin met code

Inklapbare secties zijn secties van inhoud die kunnen krimpen en uitklappen door er op te klikken. Ze zijn een populaire manier om inhoud te organiseren op zo'n manier dat de gebruiker de inhoud van een sectie alleen kan zien als hij dat wil. In dit artikel zullen we leren hoe je een eenvoudige inklapbare sectie maakt met CSS en JavaScript.

Dit wordt gedaan door gebruik te maken van een knop en de inhoud van de sectie in te sluiten in een div. De event listener is toegevoegd aan de knop om te luisteren naar muisklikken. De “Active” klasse wordt bij elke klik op de knop omgeschakeld. Wanneer de sectie wordt uitgeklapt, verandert de achtergrondkleur van de knop. Ook wordt de “display” eigenschap van de inhoud veranderd in “block” op de klikknop gebeurtenis om het zichtbaar te maken wanneer het “none” (verborgen) is en vice versa, zoals hieronder getoond.

https://www.w3schools.com/howto/howto_js_collapsible.asp

Uitklapper maken met animatie

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_collapsible_animate