Tables can either be written directly to HTML table elements or the Wikicode in this wiki. HTML table elements and their use are well described on various websites and is therefore not discussed here. The Wikicode uses letter symbols to the table structure in the article to form, which are in the view replaced by HTML table elements.
Generally you should avoid the use of tables, unless there really is no other way. The table structure usually complicates the editing pages.
Summary tables Code
Wiki Code |
vgl. HTML Code |
description
|
{| |
<table> |
Table top
|
|+ |
|
Table Header, optional; only once per table between table start and first row definable
|
|- |
<tr> |
New Table Row
|
! |
<th> |
Table header cell, optional. Consecutive head cells may, by double exclamation points (!!) separately, followed on the same line or with simple exclamation mark (!) Start on a new line.
|
| |
<td> |
Table Cell, Duty! Successive cells separated by double underscores ( || ), follow in the same line or with simple stroke ( | ) begin on a new line.
|
|} |
</table> |
Table End
|
- The above marks must at line start standing, except the double || and !! for optional successive cells in a row.
- XHTML - properties. ach mark, except table end, optionally have one or more XHTML attributes. The properties must be entered on the same line, for which they are valid. Multiple entries must be entered separated by a space.
- The contents of cells and headers ( | or ||, or !!, and |! + ) needs of content with a single pipe (|) be separated and can be used in the same and subsequent lines to stand.
- Tables, columns and rows ( {| and | - ) that can not directly have a content may also no character (|) after their optional attributes. If but one is set away the parser this and the last attribute, if there is no space between it and the bottom line.
- Content may (a) are or (b) of the cells mark after its cell mark after any optional XHTML properties in the same row. Content which Wiki formatting (such as headings, bulleted lists, etc.) use, should be only the beginning of a new line.
Simple Table
Simple Form
The following table has no borders or good voids . but shows the simple Wiki Code for a table structure
Display in Wiki
|
Wiki Code
|
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
ice cream
|
|
{|
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
Alternative
For a more tabular appearance, the cells can be listed on one line in the wiki markup. The individual columns have to || be separated. However clarity decreases with sidewalk text content.
Spaces can help to align the text visually easier here. These have later will not affect the pages created.
HTML information may be added in this type as well as in other tables.
Orange |
Apple |
more
|
Bread |
Cake |
more
|
Butter |
Ice Cream |
and more
|
|
{|
| Orange || Apple || more
|-
| Bread || Cake || more
|-
| Butter || Ice Cream || and more
|}
|
HTML attributes
By adding HTML attributes, the look of the table can be changed.
border="1"
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1"
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
align="center" border="1"
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| align="center" border="1"
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
align="right" border="1"
Properties can also be applied to individual cells. Numbers, for example, look better if they are right-justified.
Orange
|
Apple
|
12,333.00
|
Bread
|
Cake
|
500.00
|
Butter
|
Ice Cream
|
1.00
|
|
{| border="1"
|Orange
|Apple
|align="right"|12,333.00
|-
|Bread
|Cake
|align="right"|500.00
|-
|Butter
|Ice Cream
|align="right"|1.00
|}
|
properties only on certain rows apply .
Orange
|
Apple
|
12,333.00
|
Bread
|
Cake
|
500.00
|
Butter
|
Ice Cream
|
1.00
|
|
{| border="1"
|Orange
|Apple
|align="right"|12,333.00
|-
|Bread
|Cake
|align="right"|500.00
|- style="font-style:italic;color:green;"
|Butter
|Ice Cream
|align="right"|1.00
|}
|
cellspacing="0" border="1"
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
cellpadding="20" cellspacing="0" border="1"
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
ICe Cream
|
|
{| cellpadding="20" cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
HTML attributes and CSS definitions
CSS information can be used in combination with or without HTML properties .
style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
TH (HTML table header) with a ! before | to be created. This header will usually appear in bold and centered.
Table head
Per column
Delicious
|
Delicious
|
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Delicious
!Delicious
|-
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
Colspan="2"
leckerer
|
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
! colspan="2"|leckerer
|-
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
Default
Fruit
|
Orange
|
Apple
|
Main Course
|
Bread
|
Cake
|
ingredients
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Fruit
|Orange
|Apple
|-
!Main Course
|Bread
|Cake
|-
!ingredients
|Butter
|Ice Cream
|}
|
Flush Right
Side headings are justified as follows:
Fruit
|
Orange
|
Apple
|
Main Course
|
Bread
|
Cake
|
Ingrediants
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
!align="right" |Fruit
|Orange
|Apfel
|-
!align="right" |Main Course
|Bread
|Cake
|-
!align="right" |Ingrediants
|Butter
|Ice Cream
|}
|
Lettering
A Table caption can be added on each table as follows:
Food Stuff
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+Food Stuff
|-
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
Properties the label as follows are assigned accordingly:
Essenssachen
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+align="bottom" style="color:#e76700;"|''Food Stuff''
|-
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|
Tables with H1, H2, H3, etc. headings
Tables with H1, HHTML, H1, H2, H3, H4 etc. headings can be created in tables with the usual == wiki markup ==. These must then stand in a line with the text.
Here is the preview very beneficial! As with any header begins a new chapter, which will be later edited. However, then parts are the table when editing is missing, since they are in a different section .
The structure must be respected, since the headers as well as other headings in the table of contents, H3 etc. headings.
Yummiest
|
Orange
|
Apple
|
Bread
|
Cake
|
Butter
|
Ice Cream
|
|
{| border="1" cellpadding="20" cellspacing="0"
|colspan="2"|
===Yummiest===
|-
|Orange
|Apple
|-
|Bread
|Cake
|-
|Butter
|Ice Cream
|}
|