Help:Editing

Before editing pages in this wiki you should become familiar not just with the mechanics of mediawiki markup but also with policies regarding posting and content. Please read this page carefully and contact Chris if you have any questions or concerns.

Namespaces

The development wiki makes use of namespaces to separate out different courses. If you are not familiar with the concept of namespaces, and how they are used on this wiki, please read the Help:Namespaces page for more details.

Layout

Content within the Main namespace is not subject to specific structuring or content requirements, and page content and structure is left to the editor's discretion. Structuring and layout within course namespaces is, however, far more rigidly defined as these pages need to be arranged in such a way that they can be machine processed. Please consult the Docs:Course Structure page for details.

Formatting

Wiki markup

If you have never used MediaWiki before, an overview of the facilities provided for formatting text using 'wiki markup' is available in the formatting section, along with instructions for inserting links, and images.

Html markup

MediaWiki permits a number of HTML elements to be used for page formatting. The following elements are currently permitted in pages on this wiki: <blockquote>, <code>, <tt>, <sup>, <sub>, <pre>, <div>, <span>, <table>, <tr>, <th>, <td>, <ul>, <ol>, <li>, <dl>, <dt>, <dd>

Course processor markup

All course processor tags in [ ] markers are passed through MediaWiki unchanged, as such they may be freely used in your content. Module pages created in the wiki may contain any of the special tags documented on the HTMLInputHandler and HTMLOutputHandler pages.

Note that the wiki does not currently process the tags in any way! Do not expect that, for example, a [local] block in your page will be converted to a popup, as it will not - the text of the popup will currently appear inline.

Edit page summary box

The Summary box is not enforced - if you want to follow Wikipedia's convention, feel free to do so, but any descriptive summary is allowed, as are empty summaries.

Testing out formatting

If you want to just play around with formatting to get a feel for it without having to edit an existing page, you can click on your name at the top of the page to go to your user page (User:Chris for example), and you can put anything you want there including tests.

Extensions

This mediawiki installation has the following extensions installed and available to page editors:

Cite

Provided to allow citations in text easily. To use the extension, surround text that you wish to be placed in a reference with <cite>text here</cite>, and place a <references /> marker on the page to indicate the location at which references should be listed. Full documentation and examples can be found on the extension's page.

If you use a <cite> element in a step, the step will automatically have a <references /> marker added during export, so citations will appear at the end of the step they appear in. However, this is not done automatically inside the wiki: you will need to add a <references /> marker at the end of any module that contains steps with <cite>s, or you will receive a warning from the wiki software while working on your material.

Zebra tables

If you need to create tables with zebra rows (ie: rows coloured in alternating colours to aid with readability), then when creating a table give it the class 'zebra' and all colouration will be handled automatically for you. Table rows containing table data cells are coloured alternately and support mouse-over highlighting to provide additional row identification, while rows containing table header cells are coloured in a single colour distinct from the zebra rows and with no highlight effect.

Example

{| class="zebra"
! Testing !! Testing !! Testing
|-
! colspan="2" | Testing !! Testing
|-
| Testing || Testing || Testing
|-
| Testing || Testing || Testing
|-
| Testing || Testing || Testing
|}

Will generate a table that looks like:

Testing Testing Testing
Testing Testing
Testing Testing Testing
Testing Testing Testing
Testing Testing Testing


TWPopup

Allows arbitrary content to be 'hidden' in a popup that is shown (after a configurable delay) when the user hovers the mouse over a piece of text or other element on the page. To use the extension, surround text to be hidden in a popup in <popup>text here</popup>. While the mouse is held over the anchor text, or the popup itself, the popup will remain visible. Once the mouse leaves either, the popup will fade out after a configurable delay.

Base Syntax

<popup title="Text on page" xoff="0" yoff="0" show="0" hide="0">Contents of popup (any text, including markup, links, images, tables, templates, etc)</popup>

Attribute reference

All popup tag attributes are optional, and 'sane' defaults are provided if they are not specified.

  • title="Text on page" If specified, the specified text is placed inline on the page, and when the user moves the mouse over the text, the popup is shown. If this is not specified, the text 'popup' is shown. In theory, this can contain wiki markup, however this has not been thoroughly tested.
  • xoff="px" Specifies the horizontal offset, in pixels, from the left side of the popup marker text at which the popup will appear. If not specified, this defaults to 16. Note that this should contain only digits, and negatives are permitted.
  • yoff="px" Specifies the vertical offset, in pixels, from the bottom of the popup marker text at which the popup will appear. If not specified, this defaults to 0. Note that this should contain only digits and negatives are permitted.
  • show="delay" Specifies the delay, in milliseconds, between the mouse hovering over the anchor and the popup fade in beginning. If the mouse leaves the anchor before the popup delay is complete, the popup will not be shown. If this is not specified, the default delay is 500 milliseconds (0.5 seconds).
  • hide="delay" Specifies the delay, in milliseconds, between the mouse leaving the anchor text or popup, and the popup fade out beginning. If the mouse enters the anchor or popup again before the delay is complete, the popup will not be closed. If not specified, the default delay is 2000 milliseconds (2 seconds).

Examples

This popupCjwvcD4KPHRhYmxlIGNsYXNzPSJ6ZWJyYSI+Cjx0cj4KPHRoPlRlc3Rpbmc8L3RoPgo8dGg+VGVzdGluZzwvdGg+Cjx0aD5UZXN0aW5nCjwvdGg+PC90cj4KPHRyPgo8dGggY29sc3Bhbj0iMiI+VGVzdGluZzwvdGg+Cjx0aD5UZXN0aW5nCjwvdGg+PC90cj4KPHRyPgo8dGQ+VGVzdGluZzwvdGQ+Cjx0ZD5UZXN0aW5nPC90ZD4KPHRkPlRlc3RpbmcKPC90ZD48L3RyPgo8dHI+Cjx0ZD5UZXN0aW5nPC90ZD4KPHRkPlRlc3Rpbmc8L3RkPgo8dGQ+VGVzdGluZwo8L3RkPjwvdHI+Cjx0cj4KPHRkPlRlc3Rpbmc8L3RkPgo8dGQ+VGVzdGluZzwvdGQ+Cjx0ZD5UZXN0aW5nCjwvdGQ+PC90cj48L3RhYmxlPgo8cD4= can be generated using the following code:

<popup title="This popup">
{| class="zebra"
! Testing !! Testing !! Testing
|-
! colspan="2" | Testing !! Testing
|-
| Testing || Testing || Testing
|-
| Testing || Testing || Testing
|-
| Testing || Testing || Testing
|}
</popup>

While This Popup!VGhpcyBwb3B1cCBoYXMgc29tZSB0ZXh0IGluIGl0LCByYXRoZXIgdGhhbiB0aGUgdGFibGUgc2hvd24gaW4gdGhlIG90aGVyLi4u is generated using the following code:

<popup title="'''This ''Popup!'''''">This popup has some text in it, rather than the table shown in the other...</popup>

asHighlight

Provides authors with the ability to include syntax-highlighted source code (in over 150 different programming or markup languages) in a variety of colour themes. Internally, this extension is a wrapper around André Simon's Highlight tool.

Base Syntax

<source lang="language name" style="theme name" line="0" start="1" tabwidth="4">Code to be highlighted</source>

Attribute Reference

  • lang="language name" (Required) Specify the language the source to be highlighted is written in. This should be a short language name as it appears in the right column of the supported languages list. For example 'lang="xml"' or 'lang="c"'.
  • style="theme name" (Required)The highlight colour scheme to use. You can preview the themes via this form. Currently supported values are: acid, bipolar, blacknblue, bright, contrast, darkblue, darkness, desert, easter, emacs, golden, greenlcd, ide-anjuta, ide-codewarrior, ide-devcpp, ide-eclipse, ide-kdev, ide-msvs2008, ide-xcode, kwrite, lucretia, matlab, moe, navy, nedit, neon, night, orion, pablo, peachpuff, print, rand01, seashell, the, typical, vampire, vim-dark, vim, whitengrey, zellner. I generally advise using style="emacs" to obtain an easily readable style that fits the wiki and generated content well.
  • line="0|1" (Optional) If this is set to 1, line numbers will be inserted to the left of each line in the source.
  • start="number" (Optional) If line is specified, you may change the number that the line numbers start at with this option. Any positive integer is supported.
  • tabwidth="number" (Optional) If specified, any tabs that may appear in the source will be replaced by this number of spaces.

Examples

<source lang="xml" style="emacs" line="1" start="10">
<course version="1.0 (2009-09-28 09:52)" splash="C_course_front_page.png" type="image">
<p class="center">Welcome to the PEVE C Programming Course. To begin using the course, click the button below. 
If you have already started working through the course you should also see a button to allow you to continue 
from the last page you viewed.</p>
<p class="center">If you encounter any problems, please <a style="font-weight: bold;" href="feedback.html">
contact us</a> at the earliest opportunity.</p>
</course></source>

Will generate the following:

10 <course version="1.0 (2009-09-28 09:52)" splash="C_course_front_page.png" type="image">
11 <p class="center">Welcome to the PEVE C Programming Course. To begin using the course, click the button below. 
12 If you have already started working through the course you should also see a button to allow you to continue 
13 from the last page you viewed.</p>
14 <p class="center">If you encounter any problems, please <a style="font-weight: bold;" href="feedback.html">
15 contact us</a> at the earliest opportunity.</p>
16 </course>


Flash v1.0

This extension allows the display of flash movies (.swf) within a wiki.

Base Syntax

<flash>file=filename.swf|attribute=value|...</flash>

Attribute Reference

  • width=px or % (Modify the width of the object)
  • height=px or a% (Modify the height of the object)
  • play=true/false (Start playing the file or wait at first frame, default:true)
  • loop=true/false (Loop the animation, default:true)
  • quality=low/autolow/medium/high/autohigh/best (Predefine the quality)
  • devicefont=true/false (Change the look of the text used in flash file)
  • bgcolor=#?????? (? -> Hexadecimal integer: 1-9, A-F)
  • scale=showall/noborder/exactfit (Automatically adjust content to width and height)
  • menu=true/false (Show or hide the menu on right-click)
  • align
  • salign
  • base
  • wmode
  • SeamlessTabbing
  • flashvars=?var1=value1&var2=value2 (communicate two variables var1 and var2 to the movie)
  • name (object-specific)
  • id (embed-specific)
  • movie (object-specific)
  • src (embed-specific)

Examples

<flash>file=happy.swf|width=10%|height=30|quality=best</flash>
Shows the movie with the best quality with a width of 10% and a height of 30 pixels.

<flash>file=cool.swf|width=200|height=300|bgcolor=#FDE742|scale=exactfit</flash>
Shows the movie with a width of 200 and a height of 300. The background color is light-yellow (#FDE742). The content of the movie is stretched to the size of 200x300.

<flash>file=cool.swf|width=200|height=300|scale=exactfit|flashvars=?var1=value1&var2=value2</flash>
Shows the movie with a width of 200 and a height of 300. Two flashvars var1 and var2 are passed to the movie via url with respectively value1 and value2 (don't forget the question mark!). The content of the movie is stretched to the size of 200x300.


Streaming FLV

This tag allows a streamed video to be embedded in a step. See Docs:Embedding Video Streams for more information.

Base Syntax

<streamflv splash="splash image name" width="width in pixels" height="height in pixels">flv file name</streamflv>

Attribute Reference

  • width="px" Specifies the horizontal size of the animation, in pixels. If omitted, this defaults to 320.
  • height="px" Specifies the vertical size of the animation, in pixels. If omitted, this defaults to 240.
  • splash="splash image name" The name of the image to show where the stream will be displayed. While optional, this is VERY HIGHLY

recommended. The image names should be the name of an image that has been uploaded to the wiki, and it must appear in the course media list.

The flv file name should be the name of a flash video file that has been uploaded to the wiki (flv files should not appear in media lists!)

Examples

<streamflv splash="Animusic_03_splash.png" width="320" height="240">Animusic2_03_ResonantChamber.flv</streamflv>
Shows a streaming player for the 'File:Animusic2_03_ResonantChamber.flv' animation, with its width set to 320 and height to 240, and with the 'File:Animusic_03_splash.png' image as a splash image.


YouTube Video Embedding

This tag allows you to embed a video from YouTube in your material. As with the streamflv tag, multiple youtube videos may be embedded per page.

Base Syntax

<youtube width="width in pixels" height="height in pixels">youtube url</youtube>

Attribute Reference

  • width="px" Specifies the horizontal size of the animation, in pixels. If omitted, this defaults to 640.
  • height="px" Specifies the vertical size of the animation, in pixels. If omitted, this defaults to 385.

The youtube url should be the full URL of the YouTube video you wish to embed. This should be of the form 'http://www.youtube.com/watch?v=' followed by a video ID. Any text in the URL after the video ID will be discarded. You may not use this tag to embed videos from other hosting providers (flikr, photobucket, etc) - this extension will only allow YouTube videos.

Examples

<youtube>http://www.youtube.com/watch?v=SZz6Thqokyo</youtube>
will show the video at http://www.youtube.com/watch?v=SZz6Thqokyo embedded in the page.

Authors

  • gravatar The Watcher [userbureaucratsysopPHRhYmxlIGNsYXNzPSJ0d3BvcHVwIj48dHI+PHRkIGNsYXNzPSJ0d3BvcHVwLWVudHJ5dGl0bGUiPkdyb3Vwczo8L3RkPjx0ZD51c2VyPGJyIC8+YnVyZWF1Y3JhdDxiciAvPnN5c29wPGJyIC8+PC90ZD48L3RyPjwvdGFibGU+]

Looking for something?

Use the form below to search the wiki:

 

Still not finding what you are looking for? Contact us so we can take care of it!