Basic tables

From Gamepedia Help Wiki
Jump to: navigation, search

Tables may be authored in wiki pages using either XHTML table elements directly, or using wikicode formatting to define the table. XHTML table elements and their use are well described on various web pages and will not be discussed here. The benefit of wikicode is that the table is constructed of character symbols which tend to make it easier to perceive the table structure in the article editing view compared to XHTML table elements.

NOTE:
Prof hydra.svg As a general rule, it is best to avoid using a table unless you need one. Table markup often complicates page editing.

Wiki table markup summary[edit | edit source]

{| table start
|+ table caption, optional; only between table start and first table row
|- table row, optional on first row -- wiki engine assumes the first row
! table header cell, optional. Consecutive table header cells may be added on same line separated by double marks (!!) or start on new lines, each with its own single mark (!).
| table data cell, required! Consecutive table data cells may be added on same line separated by double marks (||) or start on new lines, each with its own single mark (|).
|} table end
  • The above marks must start on a new line except the double || and !! for optionally adding consecutive cells to a line. However, blank spaces at the beginning of a line are ignored.
  • XHTML attributes. Each mark, except table end, optionally accepts one or more XHTML attributes. Attributes must be on the same line as the mark. Separate attributes from each other with a single space.
    • Cells and caption (| or ||, ! or !!, and |+) hold content. So separate any attributes from content with a single pipe (|). Cell content may follow on same line or on following lines.
    • Table and row marks ({| and |-) do not directly hold content. Do not add pipe (|) after their optional attributes. If you erroneously add a pipe after attributes for the table mark or row mark the parser will delete it and your final attribute if it was touching the erroneous pipe!
  • Content may (a) follow its cell mark on the same line after any optional XHTML attributes or (b) on lines below the cell mark. Content that uses wiki markup that itself needs to start on a new line, such as lists, headings, or nested tables, must be on its own new line.
    • Pipe character as content. To insert a pipe (|) character into a table use the <nowiki>|</nowiki> escaping markup

Basics[edit | edit source]

The following table lacks borders and good spacing but shows the simplest wiki markup table structure.

You type You get
{|
|Monitor
|Mouse
|-
|Gamepad
|Keyboard
|-
|Mainboard
|Video card
|}
Monitor Mouse
Gamepad Keyboard
Mainboard Video card

The cells in the same row can be listed on one line separated by || (two pipe symbols). If the text in the cell contains a line break, use <br/> instead.

You type You get
{|
|Monitor||Mouse||more
|-
|Gamepad||Keyboard||more
|-
|Mainboard||Video<br/>card||and<br/>more
|}
Monitor Mouse more
Gamepad Keyboard more
Mainboard Video
card
and
more

Extra spaces within cells in the wiki markup, as in the wiki markup below, do not affect the actual table rendering.

You type You get
{|
|  Monitor   ||   Mouse   ||   more
|-
|  Gamepad   ||   Keyboard   ||   more
|-
|  Mainboard   || Video card ||  and more
|}
Monitor Mouse more
Gamepad Keyboard more
Mainboard Video card and more

You can have longer text or more complex wiki syntax inside table cells, too:

You type You get
{|
|Lorem ipsum dolor sit amet, 
consetetur sadipscing elitr, 
sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, 
sed diam voluptua. 

At vero eos et accusam et justo duo dolores
et ea rebum. Stet clita kasd gubergren,
no sea takimata sanctus est Lorem ipsum
dolor sit amet. 
|
* Lorem ipsum dolor sit amet
* consetetur sadipscing elitr
* sed diam nonumy eirmod tempor invidunt
|}
Lorem ipsum dolor sit amet,

consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

  • Lorem ipsum dolor sit amet
  • consetetur sadipscing elitr
  • sed diam nonumy eirmod tempor invidunt
There is more to know about tables! Read more here: Advanced tables.