Konzept und praktische Anwendung
Bearbeiten
Um ein Registerkartenmenü zu erstellen, wird pro Menü (nicht pro Tab) eine separate Vorlage benötigt, die als Unterseite einer Projektseite oder auf einer Benutzerunterseite angelegt werden kann. Bitte verwende diese Vorlage nicht im Artikelnamensraum.
In der von Dir erstellten Vorlage wird das globale Erscheinungsbild der Tabs konfiguriert, wie die Farbe, Ausrichtung und hinterlegte Links. Die Links geben an, auf welche Seite der Browser gehen soll, wenn jemand den jeweiligen Tab anklickt. Auf diesen Seiten muss dann die erstellte Vorlage eingebunden werden.
Allgemeines zur Vorlage
Bearbeiten
Eine solche Vorlage könnte z. B. dafür verwendet werden, ein Tabmenü innerhalb Deiner Benutzerseite darzustellen. Es würde sich anbieten, die Vorlage auf der Seite
Benutzer:DeinBenutzername/MyTabMenu
anzulegen (wobei hier und im Folgenden DeinBenutzername durch Deinen tatsächlichen Benutzernamen ersetzt werden muss, mit dem Du Dich in der Wikipedia angemeldet hast).
Inhalt dieser Vorlage wäre in unserem Beispiel sinngemäß
- Tab1, Tab-Farbe ist Blau, zeige nach Benutzer:DeinBenutzername, Text ist „Benutzer“
- Tab2, Tab-Farbe ist Grün, zeige nach Benutzer:DeinBenutzername/Artikel, Text ist „Artikel“
Dieser Tab könnte beispielsweise die Artikel auflisten, die Du selbst erstellt hast und/oder pflegst.
- sämtliche Tabs sollen in diesem Beispiel linksbündig angezeigt werden
Aussehen soll das Ergebnis der Vorlage also so:
Quellcode der Vorlage
Bearbeiten
Der folgende Quellcode sollte in diesem Beispiel in Deine Benutzerumgebung kopiert werden:
<onlyinclude>
{{TabMenu | Mode=BeginTemplate | Position={{{Position|Top}}} }}
{{TabMenu | Mode={{{Tab1|Passive}}}FirstLBTab | Position={{{Position|Top}}} | PaBgColor=CAE1FF | ActBgColor={{{BgColor}}} | Name=[[Benutzer:DeinBenutzername|Benutzer]] }}
{{TabMenu | Mode={{{Tab2|Passive}}}LastLMTab | Position={{{Position|Top}}} | PaBgColor=B4EEB4 | ActBgColor={{{BgColor}}} | Name=[[Benutzer:DeinBenutzername/Artikel|Artikel]] }}
{{TabMenu | Mode=EndTemplate | Position={{{Position|Top}}} | ActBgColor={{{BgColor}}} }}
</onlyinclude>{{TabMenu | Mode=TemplateHelpInfo }}
 |
- Hinweise:
- Die Tab-Bezeichner (hier
Tab1 und Tab2) sind frei festlegbar. Man kann also auch TabBenutzer statt Tab1 schreiben und beispielsweise TabArtikelListe oder TabArtikel oder irgendetwas anderes verwenden statt Tab2. Wichtig ist nur, dass man diesen ausgedachten Bezeichner dann auf der jeweiligen Seite als aktiven Tab angibt (siehe weiter unten; die entsprechende Stelle ist dort ebenfalls gelb markiert).
PaBgColor legt den Farbwert fest, den der nicht angeklickte (nicht aktive) Tab hat (hier blau und grün). Die Hintergrundfarbe des gerade aktiven Tabs wird später gesetzt (siehe weiter unten, Parameter BgColor).- Der Quellcode dient der Veranschaulichung des Konzepts und wurde dafür auf ein funktionstüchtiges Minimum reduziert. Wenn die Rahmenparameter angepaßt werden sollen, wie beispielsweise die Breite des Menüs, eine (mögliche) Rotation, der Schatten, die Position und der Abstand zum umgebenden Seiteninhalt sowie die Schriftart etc, so verwende stattdessen besser den ausführlichen Quellcode als Vorlage für Dein eigenes Menü.
|
Die verlinkten Seiten, auf die die Tabs zeigen
Bearbeiten
Nach dem vorangegangenen Beispiel wäre der Inhalt der Benutzerseite dann sinngemäß
- zeige das Tab-Menü an, wobei Tab1 als aktiver (aufgeklappter) Tab hervorzuheben ist; die Hintergrundfarbe innerhalb des Tab-Rahmens wird festgelegt (hier Weiß)
- es folgt der Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll
- am Ende diese Inhalts wird festgelegt, dass der Tab-Rahmen nun geschlossen werden kann
- optional können vor und nach dem Tab-Rahmen (also außerhalb des Tab-Menüs) weitere Inhalte stehen
Hier der konkrete Code, der auf der verlinkten Seite Benutzer:DeinBenutzername hinterlegt werden muss, um das Menü anzeigen zu können:
<!-- BEGIN TABS --> {{Benutzer:DeinBenutzername/MyTabMenu | Tab1=Active | BgColor=FFFFFF }}
Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll.
<!-- END OF TABS -->{{TabMenu | Mode=EndTabMenu }}
Und so sieht dann die dazu passende Bildschirmausgabe aus, sobald jemand auf die Benutzerseite geht:
|
Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll.
|
|
Der zweite Tab:
Inhalt der Benutzer-Artikel-Seite, die die von dem Benutzer selbst erstellen und gepflegten Artikel auflisten soll, wäre dann sinngemäß
- zeige das Tab-Menü an, wobei Tab2 als aktiver Tab hervorzuheben ist; die Hintergrundfarbe innerhalb des Tab-Rahmens wird festgelegt (hier Weiß)
- es folgt der Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll
- am Ende diese Inhalts wird festgelegt, dass der Tab-Rahmen nun geschlossen werden kann
- optional können vor und nach dem Tab-Rahmen weitere Inhalte stehen
Hier der konkrete Code, der auf der verlinkten Seite Benutzer:DeinBenutzername/Artikel hinterlegt werden muss, um das Menü anzeigen zu können:
<!-- BEGIN TABS --> {{Benutzer:DeinBenutzername/MyTabMenu | Tab2=Active | BgColor=FFFFFF }}
Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll, beispielsweise eine Liste der von Dir selbst erstellen und gepflegten Artikel ...
<!-- END OF TABS -->{{TabMenu | Mode=EndTabMenu }}
So sieht es dann aus, wenn jemand auf den Tab "Artikel" klickt:
|
Inhalt der innerhalb des Tab-Rahmens angezeigt werden soll, beispielsweise eine Liste der von Dir selbst erstellen und gepflegten Artikel ...
|
|
|
