MediaWiki Markup Language

From DataSelf Knowledge Base
Revision as of 02:13, 7 March 2019 by Cwilson (talk | contribs) (Displaying Code)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

The markup language is a core aspect of any wiki system. Wiki markup consists of normal characters like asterisks, apostrophes or equal signs which have a special function in the wiki, sometimes depending on their position. For example, surrounding text with two pairs of apostrophes like ''italics here'' makes it display as italics here.

The MediaWiki documentation ironically does not seem well organized to help new users find information on this key topic.

General Notes
  • The purpose of a wiki markup language is to provide a easier way to generate HTML code. But in the end what displays on the web browser is the result of HTML. Many issues with spacing between text is the result of settings in HTML and especially CSS files (style sheets).
  • MediaWiki treats links to internal pages (pages in the wiki) differently from links to external pages. The treatment appears inconsistent and not completely 'baked' to me.

Wiki Markup Language: References

Some references to consult.

Good places to start:

  • The Help button on the wiki editor.
  • Help:Wikitext_examples. See especially the extensive Links to other help pages near the end.
  • Help:Editing. This is a mix of how to use the wiki editor and wiki markup. Sub-sections of this document are repeated below.

General & Introductory Guides

MediaWiki Fonts: Size, Color, Backgrounds

Change Font Size

== [[DataSelf BI]] <span style="font-size:125%;">(ETL & Data warehouse)</span>==


  • <Blockquote>
<blockquote> Your quote here — Annon </blockquote>

Your quote here — Annon

<blockquote style="background-color: lightgrey; border: solid thin grey; padding-left: 16px; padding-right: 6px;"> Your quote here — Annon </blockquote>

Your quote here — Annon

  • Template?

The QUOTE template probably has to be installed

Example: Template:Quote


Hyperlinks allow users to easily move between pages. With MediaWiki it is not possible to code hyperlinks using HTML. Instead there are three general types of hyperlinks, each with associated CSS formatting to distinguish them: internal links , interwiki links, and External Links.

Internal Links to other Wiki Pages

Syntax: [[ link | text-to-appear-on-page

[[External_Images|Linking to External Images]]

Links on the Same Page


Links to External Web Pages

Links to external (non-wiki) URLs.

NOTE: The syntax for internal and externals links is different!
Do not use the bar "|" symbol in external links. Use a space after the URL instead.

Worse, the bar symbol has has no special meaning in external links yet the symbol may not be displayed. Neither the wiki or the wiki editor issues warnings when the bar symbol is used.
[ Link to cool smart sheet]
Note: Do not use the bar symbol ("|") to separate the URL from the descriptive text.

Links to PDF Files

Internal Links to PDF files
[[Media:SQLServerRAMPerformance.pdf | SQL Server Performance and RAM]]

Links to Category Pages

The full URL to the category page is
[[:Category:DataSelf_Analytics_(DSA) | Topic: DataSelf Analytics (DSA)]]


Internal images are image files (and links to same) that are stored on a MediaWiki server. External images are image files store on web pages outside the wiki. The links to external images reference web sites 'on the web'.

  • MediaWiki treats internal image files differently from external images and the markup language supplied for each is different. External images seem to be treated as 'second class' objects. By default, MediaWiki will not link to external images, the default had to be overridden by a couple of setting in a configuration file.

Internal Images (stored on the wiki)

See also: [ Help:Managing_files.
Examples of Displaying Images in wiki pages
[[File:filename.png|thumb|none|my caption text|300px|link=]]
<br clear=all>
  • thumb -- thumbnail. Image can be expanded.
  • none -- float = none. Text will not wrap around image. Float options are left, right, center, and none.
  • my caption text -- text that will appear below the image.
  • 300px -- image size
External Images
Recommendation for External Image Links
  • For external image links recommend using the HTML <img ...> tag. For example: DataSelf ETL logo

<img src="" height="45px" style="float: right" alt="DataSelf ETL logo">

Links to ETL Glossary

A glossary of terms that apply to DataSelf's ETL is found at DataSelf_ETL_Glossary.

The egx template is the designated, standard method for creating links / references to entries in the glossary.

<heading-name>   is the name of a heading on the ETL Glossary wiki page
<text>   is the text of the link that will appear on the referring page.

Numbering & Bullet Points

Mixed Numbers and Bullet Points

  1. Item 1
  2. Item 2
    • Bullet point under Item 2
  3. Item 3

Wiki code:

# Item 1
# Item 2
#* Bullet point under Item 2
# Item 3

Multi-leveled Numbered Lists

  1. Item 1
  2. Item 2
    1. Item 2.1
    2. Item 2.2
  3. Item 3

Wiki code:

# Item 1
# Item 2
## Item 2.1
## Item 2.2
# Item 3


1 Row Table without Border
column 1, row 1 column 2, row 1

Collapsible Sections, Boxes & Tables


This text is collapsible.

data-expandtext="Illuminate" data-collapsetext="Deluminate"


This text is not collapsible; but the next is collapsible and hidden by default:


Set text color:

<span style="color:#009000"> your text </span>
<span style="color:green"> your text</span>

Set background color:

<span style="background:#00FF00"> TEXT </span>

Set both text and background:

<span style="color:#FFFFFF; background:#FF69B4"> TEXT </span>

Standard HTML color names

The HTML 4.01 specification defines sixteen named colors, as follows:

Color Hexadecimal Color Hexadecimal
black #000000 silver #c0c0c0
gray #808080 white #ffffff
maroon #800000 red #ff0000
purple #800080 fuchsia #ff00ff
green #008000 lime #00ff00
olive #808000 yellow #ffff00
navy #000080 blue #0000ff
teal #008080 aqua #00ffff

RGB Colors

Cross References

Uses the CrossReference extension

Identify the image as "Figure n".

<figure id="fig:my-crossref-name">
[[File:myfile.png|thumb|<caption> blah </caption> blah, blah]]

Insert a reference to the figure above in the text.

See <xr id="fig:my-crossref-name"> </xr>

Text would display something like:

See Figure 1

Displaying Code


Display code, file names, and other literals inside <pre> ... </pre> tags.

The <pre> tag:

  • ignores Wiki markup.
  • Does not remove newlines and multiple spaces.
  • Does not reformat text.

In contrast, the <nowiki> and <tt>tag alters the text in the manner listed above.


Display code, file names, and other literals inside <tt> ... </tt> tags.
For example

<tt>your text here</tt>     is displayed as    your text here
  • The wiki markup language shown on this page were marked by <tt> tags.
  • To display wiki markup use the <nowiki>tags. See examples in the markup for this page.
  • The <code> tag works the same as the <code> tag.

TOC - Table of Contents

The TOC for a wiki page.

  • It displays by default on any page with more than 3 headings.
  • By default to TOC displays on or near the top of the page.
Overriding the TOC defaults

Recommended: Use the {{TOCFloatRight}} template.

  • To place the TOC starting at a certain location add the 'magic words' __TOC__.
  • To position the TOC to float right on the page

{| align="right"
| __TOC__

Note: The code must be placed on 3 lines as shown.


No Break SPace (nbsp)

&nbsp; -- Non-Breaking SPace. Browser should not break (or wrap) a line of text at this point.

Re-using Text a.k.a Include files/Macros/Snippets

Media wiki calls this transclusion - the inclusion of the content of a document into another document by reference; the use of the template functionality of MediaWiki to include the same content in multiple documents without having to edit those documents separately.

Template transclusion is the common way to use template messages, and is implemented by using a template tag, with the form:

{{template name}}


Magic Words

Magic words are strings of text that MediaWiki associates with a return value or function, such as time, site details, or page names. There are at least six types of magic words. Examples of some include:

  • __TOC__. (Determines the placement of the Table Of Contents).
  • {{TOCFloatRight}} Custom template for TOC that floats right.
    List of templates defined for this wiki
  • XML/HTML style tags <nowiki>...</nowiki>
  • Parser functions & Templates enclosed in double curly braces - {{ ... }}.
  • Variables. A all uppercase word delimited by double curly braces {{ ... }}.
For example {{CURRENTDAY}}.
Magic Word References

Editing: Using the built-in MediaWiki editor

Wiki Pages