Help:Tables

From ZFGCpedia
Revision as of 04:52, 23 September 2012 by hawthornegm112 (talk | contribs) (Protected "Help:Tables" (‎[edit=sysop] (indefinite) ‎[move=sysop] (indefinite)))

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Tables are an amazing way to make tabular things.

The Basics

Table caption
Column Header 1 Column Header 2 Column Header 3
Row Header 1 Row 1, Cell 2 Row 1, Cell 3
Row Header 2 Row 2, Cell 2 Row 2, Cell 3
  • All table code begins and ends in curly braces with pipes
{|
   Insert Table Code
|}
  • An optional table caption appears at the top of the table when added with a |+
{|
|+ Table Caption
   More Table Code
|}
  • Rows begin with |--- (Or however many dashes you want)
{|
|+ Table Caption
|---
   Cells Go Here
|---
   Cells Go Here Too
|}
  • Cells begin with a single pipe on each new line
{|
|+ Table Caption
|---
| Cell 1
| Cell 2
|---
| Cell 1
| Cell 2
|}
  • You could also just put them all on one line, with each cell separated by a double bar
{|
|+ Table Caption
|---
| Cell 1 || Cell 2
|---
| Cell 1 || Cell 2
|}
  • Row and column headings are denoted by a ! instead of a |
{|
|+ Table Caption
! Column Heading 1
! Column Heading 2
|---
! Row Header
| Cell 2
|---
| Cell 1
| Cell 2
|}
  • Optional parameters can affect individual tables, rows, or cells
{| border="1"
|+ Table Caption
! Column Heading 1
! Column Heading 2
|--- style="align: right"
! Row Header
| style="color: #9000A1; text-decoration: blink" | Cell 2
|---
| style="font-family: Courier New" | Cell 1 || style="background-color: red" | Cell 2
|}
  • The final table looks like this:
Table Caption
Column Heading 1 Column Heading 2
Row Header Cell 2
Cell 1 Cell 2

Sortable Tables

To make your tables sortable, add class="sortable" at the top.

Example:

Random stuff
User Snipes Derped
gm112 9001 (loool who dis)
Rafa 6 (dis guy)
Star 0 (THE TABLE)
MG-Zero 5 (Derp king)

Tables sort based on what's in the first cell below the column header. This means that the sorting occasionally gets confused when you supply confusing inputs. Try clicking the sort button 4 times in the following example:

pingas
Column
50
Z
A
4