EditingSyntax
Overview
This page contains a short guide to the syntax one can use to produce wiki pages. With a wiki, users are able to edit/contribute information to the wiki's pages.
To edit/contribute to a page, you must first enter edit mode. This is achieved by either clicking on the "EDIT" tab at the top of a wiki page, or by clicking "EDIT" on section. The tab approach will allow you to edit the WHOLE wiki page. Whilst with the section edit, you will only work on the section you clicked on, hiding stuff you are not interested in. This is by far the preferred method.
One thing to keep in mind, is to keep your wiki syntax simple. As this makes it easier for others to some day come along and also make changes or update the page without having to diggest lots of complicated markup language syntax.
In the next following sections is a little guide which will introduce you to some of the wiki syntax.
Table of contents
At the current status of the wiki markup language, having at least 4 headings on a page triggers the table of contents (TOC) to appear in front of the first header (or after introductory sections). Putting
__TOC__
anywhere forces the TOC to appear at that point (instead of just before the first header).
Putting
__NOTOC__
anywhere forces the TOC to disappear.
Headings
same as headlines/chapters/sections
First, second and third level headings
=New section= ==Subsection== ===Sub-subsection===
A first level heading is for example the "Word formatting" heading below on this page. The "Emphasize" below heading on this page is an example of a 2nd level heading.
The "Table of contents" box you see at the top of this page will appear automatically when you have used 4 or more headings. First level headings are shown as x, 2nd level as x.x and so on.
Special Characters
For characters not in the repertoire of standard ASCII. Use the syntax shown below:
Umlauts & Accents
À Á Â Ã Ä Å
Æ Ç È É Ê Ë
Ì Í Î Ï Ñ Ò
Ó Ô Õ Ö Ø Ù
Ú Û Ü ß à á
â ã ä å æ ç
è é ê ë ì í
î ï ñ ò ó ô
œ õ ö ø ù ú
û ü ÿ
À Á Â Ã Ä Å Æ Ç È É Ê Ë Ì Í Î Ï Ñ Ò Ó Ô Õ Ö Ø Ù Ú Û Ü ß à á â ã ä å æ ç è é ê ë ì í î ï ñ ò ó ô œ õ ö ø ù ú û ü ÿ
Punctuation
¿ ¡ « » § ¶
† ‡ • - – —
¿ ¡ « » § ¶ † ‡ • - – —
Commercial Symbols
™ © ® ¢ € ¥ £ ¤
™ © ® ¢ € ¥ £ ¤
Greek Characters
α β γ δ ε ζ
η θ ι κ λ μ ν
ξ ο π ρ σ ς
τ υ φ χ ψ ω
Γ Δ Θ Λ Ξ Π
Σ Φ Ψ Ω
α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ σ ς τ υ φ χ ψ ω Γ Δ Θ Λ Ξ Π Σ Φ Ψ Ω
Math Characters
∫ ∑ ∏ √ − ± ∞
≈ ∝ ≡ ≠ ≤ ≥
× · ÷ ∂ ′ ″
∇ ‰ ° ∴ ø
∈ ∩ ∪ ⊂ ⊃ ⊆ ⊇
¬ ∧ ∨ ∃ ∀ ⇒ ⇔
→ ↔ ↑
ℵ ∉
∫ ∑ ∏ √ − ± ∞ ≈ ∝ ≡ ≠ ≤ ≥ × · ÷ ∂ ′ ″ ∇ ‰ ° ∴ ø ∈ ∩ ∪ ⊂ ⊃ ⊆ ⊇ ¬ ∧ ∨ ∃ ∀ ⇒ ⇔ → ↔ ↑ ℵ ∉
Word formatting
Emphasize
''Emphasize'', '''strongly''', '''''very strongly'''''
Emphasize, strongly, very strongly
Small text
<small>small text</small>
small text
Strikethru text
<s>strike out deleted material</s>
strike out deleted material
Coloured text
- To change the colour of text, use the following code:
<span style="color: red">blah blah blah</span>
Becomes: blah blah blah
- Another way to do it is:
<font color="red">blah blah blah</font>
Becomes: blah blah blah
Superscripts and subscripts
- Superscripts and subscripts:
X<sup>2</sup>, H<sub>2</sub>O
Becomes: X2, H2O
Links
Internal linking
[[Main Page]]
Becomes a link to the Main Page of this Wiki.
[[Main Page|Check out the Main Page!]]
Becomes a link to the Main Page page but Check out the Main Page! is written instead like this: Check out the Main Page!
- Linking to a headline at a wiki page.
You can link to a headline on another wiki page.
[[EditingSyntax#Headings]]
Becomes at link to the headline "Headings" at the Editing page like this: EditingSyntax#Headings
You can also replace the text written on the final page.
[[EditingSyntax#Headings|Check out the Headings]]
Becomes Check out the Headings
External linking
Remember to start with "http://".
- Bare URL
http://www.jic.ac.uk/
Becomes http://www.jic.ac.uk/
- Named link
[http://www.jic.ac.uk/ The John Innes Centre]
Becomes The John Innes Centre
Email Links
You can create an email link with the following:
[mailto:bob@bob.com]
becomes: [1]
or with:
[mailto:bob@bob.com Bob's Email]
becomes: Bob's Email this allows a custom label for the what is displayed.
Interwiki Links
Interwiki links are links from the local wiki to another wiki. For example you can link to the Arabidopsis article on wikipedia.org by typing:
[[Wikipedia:Arabidopsis]]
This results in a link like this:
Similar to internal page links, you can create piped links, with alternate link text. For example:
[[Wikipedia:Arabidopsis | Arabidopsis]]
This results in links like this:
Currently the wiki supports interwiki linking to:
- Wikipedia
- Wiktionary
Just use these prefixes to access either wikipedia or wiktionary (dictionary). Additional external wikis can be added upon request.
Lists
Bullet lists
You can make bullet lists with "*".
* First level list object ** Second level list object *** Third level list object * Another first level list object
- First level list object
- Second level list object
- Third level list object
- Second level list object
- Another first level list object
Numbered lists
You can make numbered lists with "#".
# First level list object ## Second level list object ### Third level list object # Another first level list object
- First level list object
- Second level list object
- Third level list object
- Second level list object
- Another first level list object
Mixed lists
You can even make mixed lists like this.
* You can even do mixed lists *# and nest them *#* like this
- You can even do mixed lists
- and nest them
- like this
- and nest them
Definition lists
;item : the item's definition
- item
- the item's definition
Images
You can insert images using the syntax:
[[Image:filename|options|caption text]]
The last item added will always be considered the caption text.
Images can be laid out neatly using a Table (Setting images into a Table).
Image without alt-text
[[Image:Labguide logo.jpg]]
Image with alt-text
You add "|caption text" after the image link. This is the text most browsers will show when you hover over the image with the mouse.
[[Image:Labguide logo.jpg|The Labguide logo]]
Image options
- thumbnail, thumb
- Generates an automatically resized thumbnail image (either reduced or enlarged).
- Caption text is displayed directly underneath. An "enlarge"-icon is added.
- If you do not specify where the image should be place it will be places to the right.
- Example to the right (in this example the image is enlarged because it is small):
[[Image:Labguide logo.jpg|thumb|The MediaWiki logo]]
- right
- Makes the image right-aligned.
- left
- Same as above, but left aligned.
- center
- Same as above, but centered.
- none
- The image will be rendered inline, even if the thumbnail-option is set.
- sizepx
- Renders a version of the image that's [size] pixels wide (e.g. '150px').
- Height is computed to keep the aspect ratio (i.e. the shape of the image).
- This allows both size reduction and enlargement.
- Combining options
- You can combine the options as you like. Example (as you see below resizing is often not very good):
[[Image:Labguide logo.jpg|50px|left|none|The Labguide logo]]
Image maps
Image maps allows you to define links within regions of an image. The syntax is quite complicated and involves using coordinates within the image, which are not easy to specify. Thankfully, this website allows you to create Image maps graphically and generates the wiki code for you.
Here is an example Image map, note this wiki code is automatically for you.
<imagemap> Image:Labguide logo.jpg| circle 66 64 20 [[Main Page]] desc none </imagemap>
This becomes:
<imagemap> Image:Labguide logo.jpg|
circle 66 64 20 Main Page
desc none </imagemap>
Notice how the image is clickable only in a circle region in the center, and links to the main page of the wiki.
Tables
A Basic Table
{| border="1" cellpadding="5" cellspacing="3"
| 1 || 2
|-
| 3 || 4
|-
| 5 || 6
|}
| 1 | 2 |
| 3 | 4 |
| 5 | 6 |
Table Sizes
Controlling the table size:
{| style=border="1" "width=25%; height=100pt;" cellpadding="2"
|-
|A || B ||C
|-
|D || E || F
|}
| A | B | C |
| D | E | F |
Controlling the columns width:
{| border="1" cellpadding="2"
|-
|width="100pt"|this column is 100 points wide
|width="200pt"|this column is 200 points wide
|width="300pt"|this column is 300 points wide
|-
|blah || blah || blah
|}
| this column is 100 points wide | this column is 200 points wide | this column is 300 points wide |
| blah | blah | blah |
Controlling the row height:
{| border="1"
|-style="height:10pt"
| this row is 10 points tall || blah || blah
|- style="height:20pt"
| this row is 20 points tall || blah || blah
|- style="height:30pt"
| this row is 30 points tall || blah || blah
|}
| this row is 10 points tall | blah | blah |
| this row is 20 points tall | blah | blah |
| this row is 30 points tall | blah | blah |
Table of images
Images can be laid out neatly by setting the border to 0, specifying column with and specifying row height, e.g.
{| border="0" cellpadding="1"
|-style="height:100pt"
|width="100pt"|[[Image:Labguide logo.jpg|90px|thumb|none|The Labguide logo]]
|width="100pt"|[[Image:Labguide logo.jpg|90px|thumb|none|The Labguide logo]]
|-style="height:100pt"
|width="100pt"|[[Image:Labguide logo.jpg|90px|thumb|none|The Labguide logo]]
|width="100pt"|[[Image:Labguide logo.jpg|90px|thumb|none|The Labguide logo]]
|}
Table Spanning
Controlling the column span:
{| border="1"
| Col 1, row 1
| Col 2, row 1
| Col 3, row 1
|-
|colspan="3"| Col 1+2+3, row 2
|}
| Col 1, row 1 | Col 2, row 1 | Col 3, row 1 |
| Col 1+2+3, row 2 | ||
Controlling the row span:
{| border="1"
| Col 1, row 1
|rowspan="2"| Col 2, row 1+2
| Col 3, row 1
|-
| Col 1, row 2
| Col 3, row 2
|}
| Col 1, row 1 | Col 2, row 1+2 | Col 3, row 1 |
| Col 1, row 2 | Col 3, row 2 |
And now a bit of fun using both column and row spans:
{| border="1"
|-
| Column 1 || Column 2 || Column 3
|-
| rowspan="2"| A
| colspan="2" align="center"| B
|-
| C <!-- column 1 occupied by cell A -->
| D
|-
| E
| rowspan="2" colspan="2" align="center"| F
|-
| G <!-- column 2+3 occupied by cell F -->
|-
| colspan="3" align="center"| H
|}
| Column 1 | Column 2 | Column 3 |
| A | B | |
| C | D | |
| E | F | |
| G | ||
| H | ||
See also the WikiMedia table guide
Simple Tables
The wiki now supports simpler syntax to create tables.
Basic Table
The code below:
<tab class=wikitable border=1 sep=comma head=top> Head 1,Head 2,Head 3 Field 4,Field 5,Field 6 Field 7,Field 8,Field 9 </tab>
generates this:
<tab class=wikitable border=1 sep=comma head=top> Head 1,Head 2,Head 3 Field 4,Field 5,Field 6 Field 7,Field 8,Field 9 </tab>
The border= parameter allows you to specify your table border, use 0 for no border.
The sep= parameter allows you to specify a seperator to distinguish table elements. It can be one of the following: tab, space, spaces, comma, bar. Which makes a tab, a space, one or more spaces and/or tabs, a comma or a vertical bar (|) a seperator character.
The head= parameter allows you to specify that either the top row or the left column or both, should be formatted as a headings. It can be one of the following values: top, left, topleft Which, makes the top row a heading, the left column a heading or both the top row and left column headings.
Table of Images
The code below:
<tab class=wikitable border=0 sep=comma> [[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]] [[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]] [[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]],[[Image:Labguide logo.jpg]] </tab>
generates this:
<tab class=wikitable border=0 sep=comma>
,,
,,
,,
</tab>
Math Equations
See this guide about adding math equations in Latex format to wiki articles:
http://en.wikipedia.org/wiki/Help:Formula
Additional hints
You can avoid the wiki system's proccessing of text (to avoid unwanted formatting) by putting <nowiki></nowiki> around the text you want to parse directly.