Vanaf nu kun je aan de slag met het Tabs block. Een handige manier om je content gegroepeerd of gecategoriseerd weer te geven. We bieden een dynamisch block, waarin jij deels zelf de controle hebt over je stijl. Kies bijvoorbeeld zelf achtergrond- en tekstkleuren. Eenvoudiger te matchen op diverse pagina’s dus. Kijk mee hoe het werkt.
Hoe werkt het?
Stap 1
Kies een mooie plek op je pagina en plaats het Tabs block. Je creëert via de knop ‘Voeg tab toe’ een tabblad. In het witte vlak eronder kun je met de blocks die je gewend bent de volledige inhoud van dit tabblad opzetten. Bovenaan zie je direct dat je eerste tab zichtbaar wordt. Deze kun je een naam geven. Voor elke tab die je extra wil creëren kies je steeds voor ‘Voeg tab toe’. Het tweede, derde of vierde tabblad zal dan telkens na de vorige zichtbaar zijn. Klik in de editor op het tabblad dat je wil vullen.
Pro tip #1: Start vanuit een groep met een lichtgrijze achtergrond. Het tabs block is standaard wit, waardoor de outlines niet direct zichtbaar zijn. Een groep met een achtergrond kleur waarin je je tabs block plaatst maakt het visueel een stuk eenvoudiger.
Stap 2
Nadat je je tabbladen hebt gevuld met je teksten en/of afbeeldingen kun je zorgen voor de uitstraling van je block. Wij raden je aan om niet oneindig tabbladen aan te maken, zorg ervoor dat het voor je bezoeker gebruiksvriendelijk blijft. Afhankelijk van je ingesteld breedte hebben we ervoor gezorgd dat bij meer dan een x-aantal tabbladen twee pijltjes zichtbaar zijn aan de rechterkant van het block om eventueel horizontaal te switchen naar de tabs die niet in beeld passen.
Je tabbladen kunnen zichtbaar zijn vanaf de linkerzijde of je kunt ze gecentreerd uitvullen. Klik je op het tweede icoon onder de titel van het Tabs block in de rechterbalk, dan kun je de kleuren naar wens instellen. Ook is het mogelijk om het vlak waarin je content valt over de volledige breedte toe te passen. Kies dan voor ‘Achtergrondkleur tab volledige breedte’.
Stap 3
Klik je op het tweede icoon onder de titel van het Tabs block in de rechterbalk, dan kun je de kleuren naar wens instellen.
Kies verder voor een eventuele border-radius voor de afronding van de hoekjes, het toevoegen van een icoon en de plaatsing ervan en de weergave van een gekleurde lijn als extra indicatie van een actieve tab.
Pro tip #2: je tabs consistent vullen? Maak je eerste tabblad naar wens op en bespaar jezelf een hoop tijd door dit specifieke tabblad te dupliceren. Dan hoef je enkel de content nog aan te passen en staat je layout al klaar.