Template:TabberHeader: Difference between revisions

From Hazeron Wiki
Jump to navigation Jump to search
(Reversed "Border" option.)
(Adjusted default "Width".)
Line 1: Line 1:
<includeonly><div style="width:{{{Width|200px}}};float:right;{{#if:{{{Border|}}}|border:1px solid #4615eb;|}}"></includeonly><noinclude>{{TabberHeader/Doc}}</noinclude>
<includeonly><div style="width:{{{Width|115px}}};float:right;{{#if:{{{Border|}}}|border:1px solid #4615eb;|}}"></includeonly><noinclude>{{TabberHeader/Doc}}</noinclude>

Revision as of 19:44, 26 February 2024

The {{TabberHeader}} tag is used to easily create a tabbed section. Requires separately using the <tabber> tags and TabberFooter template.

This makes use of the TabberNeue extension.

This adds the wrapping <div> and allows easy configuration of a few style properties.

Neither this template nor the footer add any categories to the page. This is because the separately-added <tabber> tag does this. See Category:Pages_using_Tabber_parser_tag.

All tabs using this template are right-floated.

Anything can be added to the tab contents, but this is usually used with {{Commodity}} templates.

How to use

To use this on a page, add it above the content you want to separate into tabs, followed by a separate <tabber> tag.

{{TabberHeader}}<tabber>

This is the content of tab1.

This is the content of the second tab. The tabs can have any name.

Then, separate each tab with |-|, followed by the name of that specific tab and an equals (=) sign, like this:

 {{TabberHeader}}
 <tabber>
 |-|Tab1=This is the content of tab1.
 |-|Tab2=This is the content of the second tab. The tabs can have any name.
 </tabber>
 {{TabberFooter}}
 

Which will produce the first example on the right.

When using the {{TabberHeader}} tag, you can also change the width of the entire section along with enable a blue border:

 {{TabberHeader|Border=yes|Width=200px}}
 <tabber>
 |-|Tab1=This is the content of tab1.
 |-|Tab2=This is the content of the second tab. The tabs can have any name.
 </tabber>
 {{TabberFooter}}
 

This is the content of tab1.

This is the content of the second tab. The tabs can have any name.