Tabs bringen etwas Ordnung ins Chaos – gerade bei längeren Artikeln. Bei Veranstaltungsankündigungen kann man hier Programm, Anmelde-Formular und Wegbeschreibung übersichtlich platzieren. In der mobilen Ansicht wird das ganze zu einem Accordion.

Die Tabs folgen dabei einer strengen Logik. Achtet auch bitte darauf, dass der Shortcode hier immer geschlossen werden muss – es gibt also einen öffnenden Code und einen schließenden.

Zuerst muss festgelegt werden, bei welchem Bereich es um Tabs geht. Wir fangen also damit an:

[tabs] [/tabs]

Jetzt ist alles noch leer. Innerhalb dieses Bereichs legen wir also unseren ersten Tab fest:

[tabs]

[tab]Dies ist unser erster Tab[/tab]

[/tabs]

Wenn ihr Euch jetzt die Seite anschaut, werdet ihr sehen, dass in der Tab-Auswahl steht „Titel anpassen“. Das machen wir wie folgt:

[tabs]

[tab title="Überschrift Tab 1"]Dies ist unser erster Tab[/tab]

[/tabs]

Das war einfach! Nun fügen wir einen zweiten Tab hinzu:

[tabs]

[tab title="Überschrift Tab 1"]Dies ist unser erster Tab[/tab]

[tab title="Überschrift Tab 2"]Dies ist unser zweiter Tab[/tab]

[/tabs]

Ganz großartig! Und so sieht das fertige Ergebnis aus:

Was auch toll ist: Es können mehrere Tab-Container auf einer Seite verwendet werden.  Hier kommen die nächsten: