Template:TabRow: Difference between revisions

From TowersWiki

(Adding themeing to tabs)
(Adding theme information to the docs)
Line 9: Line 9:
The TabRow uses the following syntax:
The TabRow uses the following syntax:
<pre>
<pre>
{{TabRow |<Tab1Name>|<Tab2Name>|...<TabNName>|name=<name>}}
{{TabRow |<Tab1Name>|<Tab2Name>|...<TabNName>|name=<name>|theme=<theme>}}
</pre>
</pre>
The <name> field gives the TabRow a name to help with styling.
The <name> field gives the TabRow a name to help with styling.
Give each tab a name via <Tab1Name>, <Tab2Name>, etc, up to <Tab10Name>.
Give each tab a name via <Tab1Name>, <Tab2Name>, etc, up to <Tab10Name>.
From there, add your [[Template:TabPane]]s to the page.  Note: the name field of each [[Template:TabPane]] must match the names of the tabs given to your TabRow, and the CASE-SENSITIVE.
From there, add your [[Template:TabPanel]]s to the page.  Note: the name field of each [[Template:TabPanel]] must match the names of the tabs given to your TabRow, and the CASE-SENSITIVE.


NOTE: There's not a lot of CSS here, so that those who wish to use the tabs can style them as much as they'd like.
=== Themes ===
Example:
There are currently 4 themes for your tabs (they are case-sensitive!):
* queen
* skyline
* headline
* vintage
 
They've been styled to fit into the [[Template:LokiCharPage]] with the same theme names.
 
== Example ==
<pre>
<pre>
{{TabRow |Homid|Glabro|Crinos|Hispo|Lupus|name=forms}}
{{TabRow |Homid|Glabro|Crinos|Hispo|Lupus|name=forms|theme=vintage}}
{{TabPanel
{{TabPanel
|row=forms
|row=forms
Line 43: Line 51:
}}</pre>
}}</pre>
This will create a 5-panel TabRow, as seen here (click on one of the links to see it in action!):
This will create a 5-panel TabRow, as seen here (click on one of the links to see it in action!):
{{TabRow |Homid|Glabro|Crinos|Hispo|Lupus|name=forms}}
{{TabRow |Homid|Glabro|Crinos|Hispo|Lupus|name=forms|theme=vintage}}
{{TabPanel
{{TabPanel
|row=forms
|row=forms

Revision as of 05:48, 25 July 2024


This template creates a row of Template:Tabs. These tabs can be clicked, which will then display the respective Template:TabPane.

Usage

The TabRow uses the following syntax:

{{TabRow |<Tab1Name>|<Tab2Name>|...<TabNName>|name=<name>|theme=<theme>}}

The <name> field gives the TabRow a name to help with styling. Give each tab a name via <Tab1Name>, <Tab2Name>, etc, up to <Tab10Name>. From there, add your Template:TabPanels to the page. Note: the name field of each Template:TabPanel must match the names of the tabs given to your TabRow, and the CASE-SENSITIVE.

Themes

There are currently 4 themes for your tabs (they are case-sensitive!):

  • queen
  • skyline
  • headline
  • vintage

They've been styled to fit into the Template:LokiCharPage with the same theme names.

Example

{{TabRow |Homid|Glabro|Crinos|Hispo|Lupus|name=forms|theme=vintage}}
{{TabPanel
|row=forms
|name=Homid
| This is a pretty neat guy
}}
{{TabPanel
|row=forms
|name=Glabro
| This is a pretty neat guy in Glabro!
}}
{{TabPanel
|row=forms
|name=Crinos
| Oh noes! Warform!
}}{{TabPanel
|row=forms
|name=Hispo
| Pet the pretty dire wolf, it'll be fine!
}}{{TabPanel
|row=forms
|name=Lupus
| Woof Woof, I am wolf.
}}

This will create a 5-panel TabRow, as seen here (click on one of the links to see it in action!):


This is a pretty neat guy
This is a pretty neat guy in Glabro!
Oh noes! Warform!
Pet the pretty dire wolf, it'll be fine!
Woof Woof, I am wolf.