• SI Wikispaces
• SI MediaWiki
• SI Blogs
• SI Moodle
• SI Website
• Terms of Use

• Content Menu
  • About myLearning
  • Workshops and Programs
  • Projects
  • Conferences
  • Resources
  • Innovative Practice
  • Blogs
  • Wikis
  • Terms of Use
• Site tools
  • Upload file
  • Locate file
  • Search
  • View Users
  • Categories
  • Recent changes
  • All special Pages
  • MediaWiki Help

• Personal tools
  • Log in / create account

Media Wiki MarkUp Cheat Sheet

The following is a quick overview of basic Media Wiki Markup techniques.

Image Formatting

To add an image, the image file has to be uploaded. The system uses the term "image" for any uploaded file.

Uploading images on allows embedding them in all Show Me! Wiki pages.

Upload the file under a suitable name, because renaming after uploading is not possible.

After your image has been uploaded, you can use the following formatting rules

Linking

To link to an uploaded file, e.g. Remote Connexion.jpg, use [[Media:Remote Connexion.jpg]] instead of [[Image:Remote Connexion.jpg]], giving Media:Remote Connexion.jpg; to link to the image description page, use [[:Image:Remote Connexion.jpg]], giving Image:Remote Connexion.jpg (the first colon is not displayed).

In the case of non-image uploads, e.g. office files (if allowed by the system), the keyword 'media' is used even though office documents are not typically classed as media, in the context of audio/video etc.

Embedding internal images

An embedded internal image automatically links to the image page, which shows the full image, or, depending on preferences, a reduced version with a link to the full version. The page also provides info about the image.

[[image:MyPDA04.jpg|abc]] gives

[[image:MyPDA04.jpg|40px|abc]] gives

[[image:MyPDA04.jpg|70x60px|abc]] gives

abc

Image at the left

[[image:HeadPhones.jpg|left|thumb|50px|[[help:contents|demo]]]] puts the image at the left; text that follows floats to the right of it; if a second image immediately comes after the first, the second abuts to the right side of the first; if there is text in between then the second image is at the lower right of the first, under this text:

demo

demo

demo

demo

With [[image:HeadPhones.jpg|none|thumb|50px|[[help:contents|demo]]]] the image is put at the left, and text that follows starts below it.

demo

Image at the right

[[image:Webcam.jpg|right|thumb|50px|[[help:contents|demo]]]] puts the image at the right; text that follows floats to the left of it. The situation is not symmetric with the case above: a second image is put at the extreme right again, under the first.

demo

demo

It is, however, possible to make them behave similarly to the image at the left example with the following format:

{|align="right"

|[[image:Webcam.jpg|right|thumb|50px|[[help:contents|demo]]]]

|}

Uploading and linking a media file to a page

To upload an media file such as a word document, pdf etc. and link it to a page you need to upload it to the mediawiki library and embedded it in the wiki page.

This can be done by following these steps

1. Enter the following code using the filename of the media file you would like to upload to the library and insert.

media:filename.doc

Use this format if you would like to give the page link to the file a different name to the actual file name

Word Document

2. Save the page

3. media:filename.doc or the title you entered ie. Word Document will appear on the page as a red hyperlink indicating the file does not exist in the library.

4. click the Link and the library upload tool will open

Simple table

Plain

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

{|
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}

Alternative

For more table-ish looking wiki markup cells can be listed on one line separated by ||. This does not scale well for longer cell content such as paragraphs. It works well for short bits of content however, such as our example table.

Extra spaces within cells in the wiki markup can be added, as I have done in the wiki markup below, to make the wiki markup itself look better but they do not affect the actual table rendering.

HTML attributes can be added to this table following the examples in other tables on this page but have been left out of the following example for simplicity.

{|
|  Orange    ||   Apple   ||   more
|-
|   Bread    ||   Pie     ||   more
|-
|   Butter   || Ice cream ||  and more
|}

With HTML attributes

You can add HTML attributes to make your table look better

border="1"

{| border="1"
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}

align="center" border="1"

{| align="center" border="1"
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}

align="right" border="1"

You can put attributes on individual cells. Numbers for example may look better aligned right

{| border="1"
|Orange
|Apple
|align="right"|12,333.00
|-
|Bread
|Pie
|align="right"|500.00
|-
|Butter
|Ice cream
|align="right"|1.00
|}

You can put attributes on individual rows, too.

{| border="1"
|Orange
|Apple
|align="right"|12,333.00
|-
|Bread
|Pie
|align="right"|500.00
|- style="font-style:italic;color:green;"
|Butter
|Ice cream
|align="right"|1.00
|}

cellspacing="0" border="1"

{| cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}

cellpadding="20" cellspacing="0" border="1"

{| cellpadding="20" cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}

With HTML attributes and CSS styles

CSS style attributes can be added with or without other HTML attributes

style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"

{| style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
|Orange
|Apple
|-
|Bread
|Pie
|-
|Butter
|Ice cream 
|}