Das Tabmenu - ein Guide

  • Hallo ihr Lieben,


    da eventuell nicht jeder gleich auf Anhieb versteht, wie man unsere neue Errungenschaft, das Tabmenü, richtig und effizient nutzt, haben wir euch einen Guide erstellt. Hierbei werden wir die Struktur des Tabmenüs analysieren und zeigen, wie die einzelnen Elemente am Ende ein Ganzes ergeben.


    Hier ein Beispielmenü, welches wir nun zur Erklärung auseinanderpflücken.


    Um das Tabmenü erstellen zu können, muss man zunächst am Beginn und am Ende folgenden BB-Code setzen.

    Code
    1. [tabmenu]
    2. [/tabmenu]


    Mein erster Tab:



    Der Code hierfür:

    Code
    1. [tabmenu]
    2. [tab='Eins']
    3. Tabs müssen(!) benannt werden, sonst werden sie nicht korrekt angezeigt.
    4. Der Name des Tabs muss immer in Anführungszeichen gesetzt werden.
    5. Jeder Tab muss immer genauso wie das tabmenu wieder geschlossen werden.
    6. [/tab]
    7. [/tabmenu]


    Jedoch macht diese Funktion mit nur einem Tab nicht viel Sinn, also fügen wir einen weiteren Tab ein.

    Code
    1. [tabmenu]
    2. [tab='Eins']
    3. Tabs müssen(!) benannt werden, sonst werden sie nicht korrekt angezeigt.
    4. [/tab]
    5. [tab='Zwei']
    6. Inhalt zum 2. Tab hier.
    7. [/tab]
    8. [/tabmenu]


    Das dürfte nun so aussehen:


    Nun steht es frei, ob man noch mehr Tabs auf diese Weise einfügen möchte oder ob ein Subtab sinnvoller scheint, weil zu einem Thema mehrere Teilbereiche vorliegen und die Gliederung dann übersichtlicher wird.

    Um das Beispiel vom Anfang zu generieren, sieht der Code so aus:


    Bonusrunde!
    Das Tabmenu erlaubt übrigens auch "Font Awesome Icons" als zweiten Wert. Der zweite Wert wird vom ersten über ein Komma getrennt. Die Reihenfolge hierbei ist Titel, Icon.


    Hier nochmal mit dazugehörigem BB-Code:


    Troubleshooting

    • Q: Der Inhalt wird vor dem [subtab] verschluckt
      Dann hast du womöglich kein [subtab] unter dem ersten [tab] (Haupttab) davorgesetzt. Wenn du Subtabs benutzt, bedenke, dass jeder einzelne Tab mit einem [subtab] begonnen werden muss und auch am Ende wieder geschlossen werden muss.



    Edit Dragosius:

    Anpassung der Anleitung an das neue Tabmenu.

    lucio.jpg