Wikia

WoWWiki

Help:Wikitext/table examples

Talk0
102,215pages on
this wiki

Here are more examples of wikitext formatting. Remember that these can be used in "source" mode in the editor.

Tables Wikitext Cheatsheet

Description You type You get
Basic tables

Begin table
(equivalent to <table>)

{|

(Nothing yet, you need the rest of your table!)

Begin table row
(equivalent to <tr>)
|- (Nothing yet, you need a table cell!)
Table header (also row) ! or !! (You won't see much until you put something in your table header)
Table cell (also row) | or || (You won't see much until you put something in your table cell)
End table
(equivalent to </table>)
|} (Does nothing by itself.)
Basic table modifications
Simple 1 cell table with a border {| border="1"

|-
| row 1, <br/>cell/column 1
|}

row 1,
cell/column 1
Simple 2 cell table left header {| border="1"

|-
! row 1, <br/>header 1/column 1
| row 1, <br/>cell 1/column 2
|}

row 1,
header 1/column 1
row 1,
cell 1/column 2
Simple 3 x 3 table {| border="1"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
| row 1, <br/>cell/column 3
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
| row 2, <br/>cell/column 3
|-
| row 3, <br/>cell/column 1
| row 3, <br/>cell/column 2
| row 3, <br/>cell/column 3
|}

row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 3
row 2,
cell/column 1
row 2,
cell/column 2
row 2,
cell/column 3
row 3,
cell/column 1
row 3,
cell/column 2
row 3,
cell/column 3


Simple 2 x 2 table with 90% width {| width="90%"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 1
row 1,
cell/column 2
Simple 2 x 2 table with 8px cell padding {| cellpadding="8px"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 1
row 1,
cell/column 2
Simple 2 x 2 table with 8px cell spacing {| cellspacing="8px"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 1
row 1,
cell/column 2
Cell and header spanning
Simple 2 column table with header spanning both {|

|-
! colspan="2" | Two-column wide header
|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Cell colors for illustrative purposes only.
Two-column wide header
row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 1
row 1,
cell/column 2
Simple 2 column table with cell spanning both {|

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| colspan="2" | row 2, <br/>cell/column 1 & 2
|}

Cell colors for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1 & 2
Simple 2 row table with cell spanning both {|

|-
| row 1, <br/>cell 1/column 1
| rowspan="2" | row 1 & 2, <br/>cell 2
|-
| row 2, <br/>cell 3/column 1
|}

Cell colors for illustrative purposes only.
row 1,
cell 1/column 1
row 1 & 2,
cell 2
row 2,
cell 3/column 1
Cell, header, or row alignment
Simple 2 x 2 table with various alignments {| width="100%"

|- valign="top"
| align="right" | row 1, <br/>header 1, <br/>column 1
| align="center" | row 1, <br/>cell 1/column 2
|- valign="bottom"
| row 2, <br/>header 2, <br/>column 1
| row 2, <br/>cell 2/column 2
|}

Cell colors for illustrative purposes only.
row 1,
header 1,
column 1
row 1,
cell 1/column 2
row 1,
header 1,
column 1
row 1,
cell 2/column 2
Typical CSS styling
Simple 2 x 2 table with CSS background-color {| style="background-color:yellow;"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 1
row 1,
cell/column 2
Simple 2 x 2 table with various CSS styles {| style="border:3px inset gray; font-size:80%; width:90%;"

|-
! style="background-color:blue; color:pink; padding-left:1em; width:60%;" | row 1, <br/>header 1/column 1
| style="text-decoration:line-through;" | row 1, <br/>cell/column 2
|-
! style="text-align:right;" | row 2, <br/>header 2/column 1
| style="border:1px dotted red;" | row 2, <br/>cell/column 2
|}

row 1,
header 1/column 1
row 1,
cell/column 2
row 1,
header 2/column 1
row 1,
cell/column 2

See alsoEdit

Further Help & FeedbackEdit

From here and below will not be transcluded.
Parameters

  • morehelp = Optional Contents for a sub-bullet item under "Browse and search..."

Here are more examples of wikitext formatting, specific to tables.

Wikitext cheatsheet

Basic table code

Description You type
Begin table
(equivalent to <table>)
{|
Begin table row
(equivalent to <tr>)
|-
Table header (part of a row; equivalent to <th>) ! or !!
Table cell (part of a row; equivalent to <td>) | or ||
End table
(equivalent to </table>)
|}
Note that the HTML for closing a row (</tr>), header (</th>), or cell (</td>) will be auto-generated.

Basic tables

Description You type You get
Simple 1 cell table with a border {| border="1"

|-
| row 1, <br/>cell/column 1
|}

row 1,
cell/column 1
Simple 2 cell table left header {| border="1"

|-
! row 1, <br/>header 1/column 1
| row 1, <br/>cell 1/column 2
|}

row 1,
header 1/column 1
row 1,
cell 1/column 2
Simple 3 x 3 table {| border="1"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
| row 1, <br/>cell/column 3
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
| row 2, <br/>cell/column 3
|-
| row 3, <br/>cell/column 1
| row 3, <br/>cell/column 2
| row 3, <br/>cell/column 3
|}

row 1,
cell/column 1
row 1,
cell/column 2
row 1,
cell/column 3
row 2,
cell/column 1
row 2,
cell/column 2
row 2,
cell/column 3
row 3,
cell/column 1
row 3,
cell/column 2
row 3,
cell/column 3
Simple 2 x 2 table with 90% width {| width="90%"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1
row 2,
cell/column 2
Simple 2 x 2 table with 8px cell padding {| cellpadding="8px"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1
row 2,
cell/column 2
Simple 2 x 2 table with 8px cell spacing {| cellspacing="8px"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Border for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1
row 2,
cell/column 2

Cell and header spanning

Description You type You get
Simple 2 column table with header spanning both {|

|-
! colspan="2" | Two-column wide header
|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

Cell colors for illustrative purposes only.
Two-column wide header
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1
row 2,
cell/column 2
Simple 2 column table with cell spanning both {|

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| colspan="2" | row 2, <br/>cell/column 1 & 2
|}

Cell colors for illustrative purposes only.
row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1 & 2
Simple 2 row table with cell spanning both {|

|-
| row 1, <br/>cell 1/column 1
| rowspan="2" | row 1 & 2, <br/>cell 2
|-
| row 2, <br/>cell 3/column 1
|}

Cell colors for illustrative purposes only.
row 1,
cell 1/column 1
row 1 & 2,
cell 2
row 2,
cell 3/column 1

Cell, header, or row alignment

Description You type You get
Simple 2 x 2 table with various alignments {| width="100%"

|- valign="top"
! align="right" | row 1, <br/>header 1, <br/>column 1
| align="center" | row 1, <br/>cell 1/column 2
|- valign="bottom"
! row 2, <br/>header 2, <br/>column 1
| row 2, <br/>cell 2/column 2
|}

Cell colors for illustrative purposes only.
row 1,
header 1,
column 1
row 1,
cell 1/column 2
row 2,
header 2,
column 1
row 2,
cell 2/column 2

Table captions

Description You type You get
Simple 2 x 2 table with a caption {| width="100%"

|-
|+ Caption
! row 1, <br/>header 1, <br/>column 1
| row 1, <br/>cell 1/<br/>column 2
|-
! row 2, <br/>header 2, <br/>column 1
| row 2, <br/>cell 2/<br/>column 2
|}

Caption
row 1,
header 1,
column 1
row 1,
cell 1/
column 2
row 2,
header 2,
column 1
row 2,
cell 2/
column 2

Typical CSS styling

Description You type You get
Simple 2 x 2 table with CSS background-color {| style="background-color:yellow;"

|-
| row 1, <br/>cell/column 1
| row 1, <br/>cell/column 2
|-
| row 2, <br/>cell/column 1
| row 2, <br/>cell/column 2
|}

row 1,
cell/column 1
row 1,
cell/column 2
row 2,
cell/column 1
row 2,
cell/column 2
Simple 2 x 2 table with various CSS styles {| style="border:3px inset gray; font-size:80%; width:90%;"

|-
! style="background-color:blue; color:pink; padding-left:1em; width:60%;" | row 1, <br/>header 1/column 1
| style="text-decoration:line-through;" | row 1, <br/>cell/column 2
|-
! style="text-align:right;" | row 2, <br/>header 2/column 1
| style="border:1px dotted red;" | row 2, <br/>cell/column 2
|}

row 1,
header 1/column 1
row 1,
cell/column 2
row 2,
header 2/column 1
row 2,
cell/column 2

See also

Further help & feedback

Around Wikia's network

Random Wiki