Tab-Code:
Erstellen des Menüs
Jedes Tab-Menü wird mit folgendem BBCode geöffnet beziehungsweise geschlossen:
[tabmenu]Inhalt des Tab-Menüs[/tabmenu]
Erstellen der einzelnen Reiter Innerhalb dieses BBCodes werden die einzelnen Reiter mit folgendem Code erstellt:
[tab='Titel des Reiters']Inhalt des Reiters[/php]
Obwohl ein Tab-Menü über beliebig viele Reiter verfügen kann, sollte darauf geachtet werden, dass die Übersichtlichkeit und Darstellung leidet, wenn übermäßig viele Tabs zu einem Menü zusammengefasst werden.
Zuweisen von Grafiken für die einzelnen Reiter
Neben einem Titel kann jedem Reiter auch noch eine Grafik zugewiesen werden. Dies passiert über folgenden Parameter:
[tab='Titel des Reiters', 'http://www.toplevel.url/bild.png']Inhalt des Reiters[/tab]
Dabei ist zu beachten, dass keine zu großen Grafiken eingebunden werden; ideal ist eine Höhe von 24 Pixeln. Außerdem sollten innerhalb eines Tab-Menüs immer entweder alle Reiter über eine Grafik verfügen, oder keiner.
BBCodes innerhalb der einzelnen Reiter
Innerhalb der einzelnen Reiter kann jeder beliebige BBCode zur Formatierung der Inhalte eingesetzt werden. Lediglich ein Verschachteln von Tab-Menüs ineinander ist nicht möglich.
[tab='Titel des Reiters', 'http://www.toplevel.url/bild.png']
[b]fettgedruckter Inhalt des Reiters[/b]
[u]unterstrichener Inhalt des Reiters[/u]
[url='http://www.toplevel.url']Link innerhalb des Reiters[/url]
Mehrere Tab-Menüs nacheinander in einer Nachricht stellen hingegen kein Problem dar.
Beispielaufbau eines fertigen Tab-Menüs
Der Code für ein einfaches Tab-Menü mit drei Reitern:
[tabmenu]
[tab='erster Tab', 'http://www.toplevel.url/bild1.png']
Inhalt des ersten Tabs
Inhalt des ersten Tabs
[b]fettgedruckter Inhalt des ersten Tabs[/b]
[tab='zweiter Tab', 'http://www.toplevel.url/bild2.png']
[i]kursiver Inhalt des zweiten Tabs
kursiver Inhalt des zweiten Tabs
[b]fettgedruckter, kursiver Inhalt des ersten Tabs[/b][/i]
[tab='dritter Tab', 'http://www.toplevel.url/bild3.png']
Inhalt des dritten Tabs
Inhalt des dritten Tabs
Inhalt des dritten Tabs
[/tabmenu]
[tabmenu]
[tab='Tab 1','http://www.woltlab.com/forum/wcf/icon/friendsM.png']
Inhalt des ersten Tabs
[tab='Tab 2']
[subtab='Tab 2.1']
Inhalt des ersten Sub-Tabs des zweiten Tabs
[subtab='Tab 2.2']
Inhalt des zweiten Sub-Tabs des zweiten Tabs
[tab='Tab 3']
[subtab='Tab 3.1','http://www.woltlab.com/forum/wcf/icon/languageDeS.png']
Inhalt des ersten Sub-Tabs des dritten Tabs
[subtab='Tab 3.2','http://www.woltlab.com/forum/wcf/icon/languageEnS.png']
Inhalt des zweiten Sub-Tabs des dritten Tabs
[subtab='Tab 3.3','http://www.woltlab.com/forum/wcf/icon/languageHrS.png']
Inhalt des dritten Sub-Tabs des dritten Tabs
[/tabmenu]
Copyright by Bergwerk
Bei Fragen steht euch die Techniker-Suite jederzeit offen ;)