The simplest possible guide to writing MediaWiki

From Wikiid
Jump to: navigation, search

Writing MediaWiki pages (eg for Wikipedia or on this web site) is really easy - at least for all the basic stuff.

Contents

Trust the Browser

This phrase is one that should be close to all web page designer's hearts. It is very tempting to try to make your page look exactly how you wrote it - with line breaks, font sizes and layout looking exactly like it did when you wrote it. That's a really bad idea. People visiting your page will have set their browser preferences so their fonts might be different from yours - and they will probably have a different screen size and resolution and will have resized the window differently from you.

So give it up. Describe what you want in broad terms and 'Trust the Browser' to make everything look nice - don't fight it.

Text

Text is just text - you can put line breaks anywhere in your writing and put as many spaces as you like within the line - just make sure you start each line in column 1 with no leading spaces. If you want to start a new paragraph, just leave a blank line.

   This
   is
   a       line
   of      text.

...and...

   This is a line of text.

...both come out looking like:

This is a line of text.

Of course if your text is wider than the space the browser has to fit it in, it will wrap it automatically onto the next line. But aside from that, whatever text you type into the file comes out reading the same in the browser.

However it's probably best to get into the habit of NOT breaking up paragraphs into lots of lines because there are other special circumstances in which you don't want to do that.

Raw text

Often you want to put some kind of unformatted text into a document - like a piece of source code. To do that, just stick a few spaces in front of it:

 This is text with a few spaces in front of it.

Boldface and italics

To put a word or phrase into italics, place two single quotes either side of it, use three single quotes for boldface if you want both together, use five single quotes (two to get italics plus another three for boldface):

  This is plain, ''this is in italics'', '''this is in boldface''' and '''''this is both together'''''.

Comes out looking like:

This is plain, this is in italics, this is in boldface and this is both together.

Titles and subtitles

The main title of the document is put onto the page automatically - so you don't start an article with a big fancy title. After that, you put title text on a line by itself with equals signs on the beginning and end. The more equals signs, the less significant your text will look.

So:

 = This is a major title =
 == This is a normal title ==
 === This is a subtitle ===
 ==== This is a four equals signs ====
 ===== This is a five equals signs =====
 ====== This is a six equals signs ======

(You can't go beyond six).

This looks like:

This is a major title

This is a normal title

This is a subtitle

This is four equals signs

This is five equals signs
This is six equals signs

If an article has more than three titles/subtitles, an index will automatically be placed at the top of the page just before the first title/subtitle. Hence everything before the first title can be considered to be in introduction.

As a matter of style, avoid using the single '=' form because it's the top level title (which has already been provided for you). Using single '=' sections after '==' sections messes up the numbering scheme in the index (look at the index at the top of this article!). Sections with four or more equals signs get harder to distinguish - and the headings start to look less noticable than regular text - so limiting yourself to three equals signs is probably good form.

Horizontal Rules

Use four or more hyphens ('-') to make a horizontal line across the page. Use these sparingly because the major title and title commands put horizontal rules in automatically.

 ----
 ----
 ----

Looks like:




Indentation

You can indent a paragraph by starting it with a colon (':') - you can double indent it with two colons and so on. However, if you put a line break in your text, the indentation level is reset to zero.

  This is not indented.
  : This is indented once
  :: This is indented twice
  ::: Three times!
  : Back to once
  Not at all.

Looks like:

This is not indented.
This is indented once
This is indented twice
Three times!
Back to once
Not at all.

Code sections

If you start a line with one or more space characters, it is assumed to be some sort of example code or something. It comes out in a fixed-pitch font, surrounded with a dotted line box.

 Like this!

So it's important not to put extra spaces on the beginnings of lines.

Lists

You can have lists of items that begin with bullets or numbers like this:

 * This is a bulletted list
 * This is the second item in the list
 ** With two asterisks you get a list-within-a-list
 ** This is the second item in that inner list
 * And this is back to the main list again

Which looks like this:

  • This is a bulletted list
  • This is the second item in the list
    • With two asterisks you get a list-within-a-list
    • This is the second item in that inner list
  • And this is back to the main list again

For numbered lists, use a '#' instead of the '*' symbol:

 # This is a numbered list
 # This is the second item in the list
 ## With two hash marks you get a list-within-a-list
 ## This is the second item in that inner list
 # And this is back to the main list again

Which looks like this:

  1. This is a numbered list
  2. This is the second item in the list
    1. With two hash marks you get a list-within-a-list
    2. This is the second item in that inner list
  3. And this is back to the main list again

..and you can mix the two:

 * This is a bulletted list
 *# Which has a numbered list inside it
 *# This is the second numbered item.
 * And this is back to the bulletted list
  • This is a bulletted list
    1. Which has a numbered list inside it
    2. This is the second numbered item.
  • And this is back to the bulletted list

Be careful not to put blank lines into a numbered list because it messes up the numbering sequence.

Yet another kind of list is a 'definition list' which has words or short phrases followed by their definitions:

 ;Antidisestablismentarianism : The longest word in the english language.
 ;A : One of the shortest words.
 ;I before E except after C : A rule that only sometimes works.

...comes out as:

Antidisestablismentarianism 
The longest word in the english language.
One of the shortest words.
I before E except after C 
A rule that only sometimes works.

Links

Linking to other pages in the same Wiki is easy - just enclose the title of the page with two square bracket pairs:

  This links to [[some other page]].

Looks like:

This links to some other page.

The capitalisation is important - all Wiki page titles are forced to start with a capital letter - but the link will work even if the first letter isn't capitalised in the link. However, all other capital letters have to be exactly right or things don't always come out right. If the link title isn't the text you'd like to use in the words to be clicked on, you can use different words like this:

  This links to [[some other page|a really '''interesting''' page]]!

Looks like this:

This links to a really interesting page!

...but when you click on the highlighted text, it takes you to the article named some other page. If the link is in RED text then the link points to a document that doesn't exist. You can still click on it - and you'll be offered the chance to create the document.

Links to regular websites are also possible and take various forms:

  This links to http://www.sjbaker.org
  This also links to my website[http://www.sjbaker.org]
  This links to [http://www.sjbaker.org SJBaker dot Org]
This links to http://www.sjbaker.org
This also links to my website[1]
This links to SJBaker dot Org

Notice that hyperlinks are made even without any square brackets at all! Remember only to use single brackets and not use a vertical bar to separate the human-readable name from the URL.

Pictures

When you need to add a picture (or a sound or a movie, actually) you should first upload it into the Wiki using the Upload file link from the menu on the left. The title of the image will be something like 'Image:My file name.png'. It's not exactly the name of the original file - so make sure you cut/paste it from the title of the image when you uploaded it.

You can add it into the page like this:

 [[Image:Bakercoat lowcontrast.png]]

Which displays the image simply like this:

Bakercoat lowcontrast.png

You can put a frame around the picture with optional text to describe it using '|frame':

 [[Image:Bakercoat lowcontrast.png|frame]]
 [[Image:Bakercoat lowcontrast.png|frame|The 'Baker' coat of arms]]

Which displays the image like this:

Bakercoat lowcontrast.png
The 'Baker' coat of arms

However, you'd often like to have your text flow around the image. In that case, you can add '|right', '|left' or '|center' after the name of the file:

 [[Image:Bakercoat lowcontrast.png|right]]

...this puts the image over to the right side of the page and lets the text flow down to the left of it. Put the image tag BEFORE the text that describes it. Using '|none' stops text from flowing around the image.

You can control the size of the image you end up with using '|XXXpx' (where 'XXX' is the size of the image in pixels):

 [[Image:Bakercoat lowcontrast.png|25px]]
 [[Image:Bakercoat lowcontrast.png|50px]]
 [[Image:Bakercoat lowcontrast.png|150px]]
 [[Image:Bakercoat lowcontrast.png|250px]]
Bakercoat lowcontrast.png Bakercoat lowcontrast.png Bakercoat lowcontrast.png


You can also make a 'thumbnail' of the image and let your end user decide (in their preferences) what size they'd like thumbnails to be displayed at. If it's a thumbnail, then you can add some description to it as well.

 [[Image:Bakercoat lowcontrast.png|right|thumb|The 'Baker' crest.]]
The 'Baker' crest.

Notice that text automatically flows around images so it's common to add a 'left' or a 'right' command.

When text is flowing around an image and you'd like it to stop flowing and restart after the bottom of the image, you can use the magic words:

 <br style="clear:both" />

...like this:


Image Galleries

Using the image link commands is great for sticking one or two pictures into an article - but for large numbers of images, you need to organise them into a gallery.

The basic syntax is:

  <gallery>
  Image:Wikiid.png | The [[Main Page]] icon
  Image:Wikiid.png | A caption
  Image:Wikiid.png
  Image:Wikiid.png | Another caption.
  Image:Bakercoat lowcontrast.png
  Image:Wikiid.png |
  </gallery>
  

Images are resized and packed four to a line.

Signing your name

You can sign your name by putting three 'tilde' characters anywhere: ~~~, four tildes adds the data and five tildes gives you JUST the date:

  • Three tildes produces: SteveBaker
  • Four tildes produces: SteveBaker 13:49, 2 July 2006 (CDT)
  • Five tildes produces: 13:49, 2 July 2006 (CDT)

HTML

Most HTML tags work too - for example, Using the <strike> command strikes stuff out There are some special rules to be aware of though[2].

Ignoring Wiki commands

If you want something to be displayed without Wiki messing around with it, you can use the <nowiki>...</nowiki> tags. The text within is still reformatted to fit the page and to remove multiple spaces. If you really need something passed through without messing around then use the HTML <pre>...</pre> tags. Putting spaces at the beginning of the line is yet another way to avoid some Wiki processing.

Tables

This:

  {| border="1" cellspacing="0" cellpadding="5" align="center"
  ! Title 1
  ! Title 2
  |- 
  | Content 1
  | Content 2
  |-
  | Content 3
  | Content 4
  |-
  |}

...or more compactly...

  {| border="1" cellspacing="0" cellpadding="5" align="center"
  ! Title 1 !! Title 2
  |- 
  | Content 1 || Content 2
  |-
  | Content 3 || Content 4
  |-
  |}

...produces this:

Title 1 Title 2
Content 1 Content 2
Content 3 Content 4

Notice that the lines that begin with '!' form the heads of the columns and are boldfaced.

You can leave off the 'border="1"' to have a table without borders - you can also leave off the 'align' command to put the table on the left edge of the screen. You can have tables within tables and images within tables.

Learning more

Wikipedia has some nice editing guides:

Personal tools