Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Help:Tabber: Difference between revisions

Help page
(Created page with "This wiki uses the TabberNeue extension. == Basic usage == Use the <code><nowiki><tabber></nowiki></code> tag. Tabs are defined with the <code><nowiki>|-|Tab Name=</nowiki></code> syntax. {| class="wikitable" |+ Example |- ! Syntax ! Result |- | <pre><nowiki><tabber> |-|Tab One= Text here! |-|Tab Two= Text here! </tabber> </nowiki></pre> | <tabber> |-|Tab One= Text here! |-|Tab Two= Text here! </tabber> |} == Fixing rendering pro...")
 
({{Help pages}})
 
Line 176: Line 176:
</tabber>
</tabber>
|}
|}
{{Help pages}}

Latest revision as of 09:11, 2 August 2023

This wiki uses the TabberNeue extension.

Basic usage

Use the <tabber> tag. Tabs are defined with the |-|Tab Name= syntax.

Example
Syntax Result
<tabber>
|-|Tab One=
Text here!
|-|Tab Two=
Text here!
</tabber>

Text here!

Text here!

Fixing rendering problems

Sometimes the parser doesn't generate the output correctly, so you may need to modify the tabber block to fix them.

Inconsistent padding

Tab content that starts with links (or maybe anything that isn't text) may not display with proper padding. Wrap these with <span> to force it to display correctly.

Incorrect example
Syntax Result
<tabber>
|-|Tab One=
[[Main Page|This tab starts with a link]], which confuses it.
|-|Tab Two=
This one doesn't!
</tabber>

This one doesn't!

Correct example
Syntax Result
<tabber>
|-|Tab One=
<span>
[[Main Page|This tab starts with a link]], which confuses it.
</span>
|-|Tab Two=
This one doesn't!
</tabber>

This one doesn't!

Lists

If a tab's entire content is a list, the parser may not separate them properly. This can be fixed by wrapping the lists with <span>, or rewrite them to use HTML <ol> or <ul> lists.

Incorrect example
Syntax Result
<tabber>
|-|Tab One=
#List item one
#List item two
#List item three
|-|Tab Two=
#Tab two and it's unordered
#For some reason
</tabber>

  1. List item one
  2. List item two
  3. List item three

  1. Tab two and it's unordered
  2. For some reason

Correct example using <span>
Syntax Result
<tabber>
|-|Tab One=
<span>
#List item one
#List item two
#List item three
</span>
|-|Tab Two=
<span>
#Tab two and it's unordered
#For some reason
</span>
</tabber>

  1. List item one
  2. List item two
  3. List item three

  1. Tab two and it's unordered
  2. For some reason

Correct example using HTML lists
Syntax Result
<tabber>
|-|Tab One=
<ol>
<li>List item one</li>
<li>List item two</li>
<li>List item three</li>
</ol>
|-|Tab Two=
<ol>
<li>Tab two and it's unordered</li>
<li>For some reason</li>
</ol>
</tabber>

  1. List item one
  2. List item two
  3. List item three

  1. Tab two and it's unordered
  2. For some reason