FlowingHealth/Forum

4.3.19. Tab-Menü

Einfaches Tab-Menü

[tabmenu][tab='Tab 1']Inhalt 1[tab='Tab 2']Inhalt 2[/tabmenu] oder
[tabmenu][tab='Tab 1',URL des ersten Icons]Inhalt 1[tab='Tab 2',Icon-URL 2]Inhalt 2[/tabmenu] oder
[tabmenu][tab='Tab 1'][subtab='Tab 1.1']Inhalt 1.1[subtab='Tab 1.2']Inhalt 1.2[tab='Tab 2']Inhalt 2[/tabmenu] oder
[tabmenu][tab='Tab 1',Icon-URL 1][subtab='Tab 1.1',Icon-URL 1.1]Inhalt 1.1[subtab='Tab 1.2']Inhalt 1.2[tab='Tab 2']Inhalt 2[/tabmenu]

Diesen BBCode können Sie verwenden, wenn Sie Ihren Text mithilfe eines übersichtlichen Tab-Menüs gliedern möchten. Dabei haben Sie die Möglichkeit, beliebig viele Menüpunkte (sogenannte „Tabs“) anzulegen, die wiederum beliebig viele Unterpunkte (sogenannte „Sub-Tabs“) enthalten können. Zusätzlich zu einer Beschriftung können Sie jedem Punkt und Unterpunkt außerdem eine kleine Grafik zuweisen; die Größe der Icons sollte allerdings 24 × 24 Pixel (bei Tabs) beziehungsweise 16 × 16 Pixel (bei Sub-Tabs) nicht überschreiten. Für jeden Punkt können Sie einen formatierten Text hinterlegen, der angezeigt wird, sobald der Benutzer den jeweiligen Tab oder Sub-Tab auswählt. Für die Gestaltung dieser Inhalte stehen Ihnen wie gewohnt alle BBCodes zur Verfügung, lediglich Tab-Menüs selbst können nicht verschachtelt werden, das heißt, dass ein einzelner Menüpunkt oder -unterpunkt kein weiteres vollständiges Tab-Menü enthalten kann.

Die Darstellung der Tab-Menüs erfordert einen Browser, der die Verwendung von Javascript unterstützt. Sollte die Verwendung von Javascript deaktiviert sein, werden die Inhalte des Tab-Menüs als einzelne Textblöcke untereinander ausgegeben und mithilfe von Überschriften gegliedert.

Syntax

Die Syntax des Tab-Menü-BBCodes orientiert sich an der Funktionalität des Listen-BBCodes beziehungsweise am Aufbau des BBCode-Systems im Allgemeinen.

Der Tab-Menü-BBCode selbst verfügt über keine weiteren Parameter, stattdessen wird jeder neue Menüpunkt mit [tab] eingeleitet. Wie beim Listen-BBCode entfällt allerdings der schließende Tag ([/tab]). Der erste Parameter dieses Pseudo-BBCodes legt den Titel beziehungsweise die Überschrift des Menüpunkts fest, der zweite (und optionale) Parameter kann die URL zu einer Grafik enthalten, die dann als Icon des Menüpunkts angezeigt wird. Die Abmessungen der verlinkten Grafik sollten 24 × 24 Pixel nicht überschreiten. Nach Angabe des [tab]-Tags folgt der Inhalt des neuen Menüpunkts, bevor mit einem weiteren [tab]-Tag ein neuer Punkt angelegt oder mit [/tabmenu] das Tab-Menü abgeschlossen wird:

[tabmenu]
	[tab='Titel des ersten Tabs',URL des Icons des ersten Tabs]
		Inhalt des ersten Tabs
	[tab='Titel des zweiten Tabs',URL des Icons des zweiten Tabs]
		Inhalt des zweiten Tabs
[/tabmenu]

Die Angabe eines Icons ist immer optional, allerdings empfiehlt es sich, entweder alle oder überhaupt keinen Menüpunkt mit Icons auszustatten.

Das Hinzufügen von Unterpunkten zu einzelnen Tabs geschieht in der gleichen Weise, der entsprechende Tag lautet [subtab]. Die Parameter sind mit denen des [tab]-Tags identisch, allerdings sollten die als Icons verlinkten Grafiken nicht größer als 16 × 16 Pixel sein. Nach der Angabe des [subtab]-Tags folgt der Inhalt des Unterpunkts, bevor mit [subtab] ein weiterer Unterpunkt oder mit [tab] ein neuer Menüpunkt angelegt oder mit [/tabmenu] das Tab-Menü abgeschlossen wird:

[tabmenu]
	[tab='Titel des ersten Tabs',URL des Icons des ersten Tabs]
		[subtab='Titel des ersten Sub-Tabs',URL des Icons des ersten Sub-Tabs]
			Inhalt des ersten Sub-Tabs
		[subtab='Titel des zweiten Sub-Tabs',URL des Icons des zweiten Sub-Tabs]
			Inhalt des zweiten Sub-Tabs
	[tab='Titel des zweiten Tabs',URL des Icons des zweiten Tabs]
		Inhalt des zweiten Tabs
	[tab='Titel des dritten Tabs',URL des Icons des dritten Tabs]
		[subtab='Titel des ersten Sub-Tabs']
			Inhalt des ersten Sub-Tabs des dritten Tabs
		[subtab='Titel des zweiten Sub-Tabs']
			Inhalt des ersten Sub-Tabs des dritten Tabs
[/tabmenu]

Jedes Tab-Menü kann beliebig viele Menüpunkte und jeder Menüpunkt kann beliebig viele Unterpunkte enthalten, allerdings ist zu beachten, dass ein einzelnes Menü nicht mehrere gleichnamige Tabs und ein einzelner Tab nicht mehrere gleichnamige Sub-Tabs enthalten kann.

Beispiel

[tabmenu]
	[tab='Tab 1',http://www.woltlab.com/forum/wcf/icon/helpM.png]
		[subtab='Sub-Tab 1.1',http://www.woltlab.com/forum/wcf/icon/helpS.png]
			Inhalt des ersten Sub-Tabs des ersten Tabs
		[subtab='Sub-Tab 1.2',http://www.woltlab.com/forum/wcf/icon/infoS.png]
			Inhalt des zweiten Sub-Tabs des ersten Tabs
		[subtab='Sub-Tab 1.3',http://www.woltlab.com/forum/wcf/icon/warningS.png]
			Inhalt des dritten Sub-Tabs des ersten Tabs
	[tab='Tab 2',http://www.woltlab.com/forum/wcf/icon/infoM.png]
		[subtab='Sub-Tab 2.1']
			Inhalt des ersten Sub-Tabs des zweiten Tabs
		[subtab='Sub-Tab 2.2']
			Inhalt des zweiten Sub-Tabs des zweiten Tabs
		[subtab='Sub-Tab 2.3']
			Inhalt des dritten Sub-Tabs des zweiten Tabs
	[tab='Tab 3',http://www.woltlab.com/forum/wcf/icon/warningM.png]
		Inhalt des dritten Tabs
[/tabmenu]