Geef grote stukken tekst weer in uitklapbare gedeelten om bezoekers te helpen navigeren door tekstrijke inhoud.

Gebruik accordeonblokken om tekstinhoud in inklapbare gedeelten weer te geven. Dit is een uitstekende optie voor gestructureerde, tekstrijke pagina's zoals FAQ's of productaanbiedingen. Accordeonblokken helpen je pagina kort te houden en verminderen het scrollen voor je bezoekers.

Een video kijken

Hoe accordeonblokken werken

Bezoekers van je site zien het accordeonblok als een lijst met titels naast uitvouwpictogrammen. Afhankelijk van je ontwerpinstellingen wordt het eerste item mogelijk standaard uitgevouwen.

Bezoekers klikken op elke titel om de bijbehorende beschrijving te openen. Per accordeonblok kan maar één item tegelijk worden geopend. Als je bezoekers op een uitgevouwen item klikken, wordt het ingevouwen. Als ze op een item klikken terwijl een ander item al is uitgevouwen, wordt het vorige uitgevouwen item gesloten.

Een accordeonblok toevoegen

Voeg als volgt een accordeonblok toe:

1. Een pagina of post bewerken.
2. Zweef over het gedeelte en klik op Blok toevoegen of op + om het blokmenu te openen, en klik vervolgens op Accordeon.
3. Open de blokeditor door op het potloodpictogram op het blok te klikken.
4. Op het tabblad content kun je items toevoegen en bewerken in het accordeonblok. Elk item bevat een titeltekst, die altijd wordt weergegeven, en een beschrijvingstekst, die wordt weergegeven als het item wordt uitgevouwen.
5. Op het tabblad ontwerp kun je het uiterlijk van het accordeonblok vormgeven.
6. Klik buiten de blokeditor als je klaar bent. Je wijzigingen worden automatisch opgeslagen.

Items toevoegen en bewerken

Op het tabblad content:

• Klik op een item in de lijst om de titel en beschrijving te bewerken
• Klik op item toevoegen om een nieuw item toe te voegen
• Klik en houd een item vast om het te herschikken
• Zweef over een item en klik op de prullenbak om het te verwijderen

Wanneer je een item opent, zie je meer opties:

• Titeltekst bewerken in het veld titel
• Beschrijvingstekst bewerken in het veld beschrijving
• Klik op dupliceren om een kopie van het item te maken
• Klik op verwijderen om het item te verwijderen

Accordeonblok stijlen

Op het tabblad ontwerp kun je de tekst, de lay-out, het uiterlijk en het pictogram van het blok vormgeven:

• Klik op titel om de opmaak en uitlijning van de titeltekst in te stellen.
• Klik op beschrijving om de opmaak en uitlijning van de beschrijving in te stellen, samen met andere opties zoals:
  • Breedte, waarmee de breedte van de tekst wordt bepaald.
  • Opvulling, waarmee de hoeveelheid witruimte rond de tekst wordt bepaald.
  • Uitlijning, waarmee wordt bepaald in welke richting de tekst wordt uitgelijnd.
  • Plaatsing, waarmee wordt bepaalt waar de tekst in het blok wordt geplaatst.
• Schakel eerste item uitvouwen in om het eerste item standaard uit te laten vouwen.
• Schakel meerdere open items toestaan in om te voorkomen dat één item sluit wanneer een ander item openvouwt.
• Klik op scheidingslijnen om de lijnen die elk item scheiden op te maken of uit te schakelen.
• Klik op pictogram om het pictogram uitvouwen in te stellen als een pijlpictogram of een plusteken.
• Stel onder  pictogram de pictogramgrootte, de pictogramdikte en de pictogrampositie in.
• Stel rijopvulling in om de hoeveelheid witruimte rond elk item aan te passen.
• Schakel voor versie 7.1 -sites de schakelaar achtergrondkleur in om achtergrondkleur toe te voegen aan het blok, hoekradiussen in te stellen en achtergrondopvulling te wijzigen. Blokachtergrondkleuren worde in versie 7.0 niet ondersteund.
• Schakel naast lijn een doorlopende of stippellijn in die de omlijning van het blok vormt. Stel voor zowel doorlopende als stippellijnen de lijnkleur en -dikte in. 
• Klik op het uitklapmenu blend-modus om een transparantie-instelling te kiezen. Deze effecten zijn ideaal als je een accordeonblok voor een afbeelding of andere visuele content plaatst.
• Om het element of de achtergrond te vervagen, zet je de schakelaar naast vervagen aan en gebruik je de schuifregelaar om de mate van onscherpte aan te passen.

Lijn-, Blend-modus- en vervangingsaanpassingen zijn beschikbaar voor Fluid Engine-gedeelten. Voor gedeelten die de klassieke editor gebruiken, is alleen lijn beschikbaar.

Lettertype en kleur van de tekst

Het lettertype en de kleur volgen de instellingen voor sitestijlen van jouw site. Houd er rekening mee dat het wijzigen van deze instellingen effect heeft op alle elementen op je site met dezelfde instellingen:

• Stel in het tabblad ontwerp van het accordeonblok de titels zo in dat ze passen bij een van je sitebrede kop- of alineastijlen, en pas die stijl vervolgens aan in het lettertypenpaneel.
• Stel in het tabblad ontwerp van het accordeonblok de beschrijvingstekst in op een van je sitebrede alineastijlen en pas die stijl vervolgens aan in het lettertypenpaneel.
• In het kleurenpaneel volgen accordeonbloktitels en -beschrijvingen de kleuraanpassingen van de kop of paragraaf, passend bij de opmaak in het tabblad ontwerp van het accordeonblok. Als je een achtergrond hebt ingeschakeld voor het blok, volgen ze de kleuraanpassingen  kop op achtergrond of alinea op achtergrond.

Andere kleuren

Gebruik in het kleurenpaneel de aanpassingen onder accordeonblok om de kleur van de scheidingslijn, de kleur van het pictogram en de standaard achtergrondkleur te wijzigen.