VirtualMV/Superquick wiki guide

From WikiEducator
Jump to: navigation, search

Superquick wiki guide

Overview

Wiki is an open content management system (although I do ask you to create a login) which I use to help capture, manage and distribute my teaching content. However, a neat part of the wiki is the ability for all users to participate. On this page I will give you a few tips on how to add content to my wiki while keeping the format consistent. I welcome your contribution in the hope that it will continually improve my content. (Michael)


VmvIcon Objectives.png

Superquick wiki guide

By the end of this page you will be able to:

  1. Learn how to get started
  2. Copy a template onto a new page to keep the look and feel consistant
  3. Understand the basic markup commands for the wiki

Getting started

1. Make sure you create a login (so that your IP address isn't recorded)

Your first wiki

Once you have logged in the wiki software creates a link to your special page (everyone else can access it but really it's just for you !!) so we'll use this page to let you play around and learn a little about working with wikis.

2. Click on your user name at the top right (ish) of the screen - it should be red to start with.

.. this will automatically take you into the edit box for a new page.

3. Type in your name.

4. Now enter something about yourself (remember its public so don't write anything you wouldn't want the world to know). Tip: If you want a new paragraph you will need to leave a blank line between them in the edit box.

5. Experiment with the [B] and [I] buttons.

6.finally save the page by clicking on the [Save page] button.

Your new wiki page is now available for the world :)

Editing your wiki page, and adding headings

7. click edit to edit (doh!)

8. Now we will add some headings, so on the first line type

==About me==

9. and at the end of the page

==My interesting links==

10. then type in some urls e.g.

http://www.virtualmv.com/wiki

http://www.wikieducator.org

11. Save the page, to see what you have done.

Linking to another page

12. Now back into edit and on a new line, enter

[[UserName/TestPage | Test page ]]

(Change "UserName" to your own personal username)

OR, you can get MediaWiki to automatically add this to your user page like this...

[[/TestPage | Test page ]]

13. Save the page. You should now see a red link on your page saying Test page

14. Click on this link and you will be taken to the edit box of your new test page.. easy aye!

Keeping the pages looking standard

15. I have created a template for my pages so if you want to follow this, cut and paste the following to your new wiki page.

{{vmv:HeaderTOC |[[yourUserName]]}}
==Introduction==
===Overview===
This is my hints page.
{{vmv:Box|Objective|3|Amazing objectives|
By the end of this page you will be able to:
#do amazing stuff
}}
==First Heading==
 
To create another page to link to use
[[yourUserName/page name | description of page]]
 
Replace lastname and initial below with yours.
{{vmv:FooterAPA-Author | lastname, initial. |2009}}

16. Change the UserName to your one, then save to see what you have done(Cool aye).

The curly brackets allow me to create special template pages, by putting in your own stuff they can be used to create standard effects (like the objective box)

Quick tips

By clicking on your user id (top of page) you will link to your own page. As this appears at the top of every page it can be used to create your own personal (but public) notes. Use [Ctrl]+[Click] to open in a new tab (or [Shift]+[Click] to open in a new browser). This page can also be used as an index to your own personal wiki!!

Editing

1. Add two [[ round text to create a hyperlink (on save will create a link to the new page that you can edit). Use a colon to separate topics and subtopics e.g. FlashCS3:Intro

[[To page]]
[[To page|different title]]

2. Add 2 equal signs == around some text to create a sub-heading (allows part of the page to be edited)

==Sub heading==

3. Headings of different sizes can be created as

==Sub heading==
===Level 2===
====Level 3====
=====Level 4=====

4. Use * in the front of a line to create an unordered list (bullet). Two stars will indent.

* Bullet 1

5. Use # in the front of a line to create an ordered list (numbered).

# Number 1

6. Have a blank line in between each line to create a new line.

7. Two ' round a word will italicise, and three will bold

''italicise''  '''bold'''  '''''bold and italic'''''

8. Adding an icon (video, sound or document)

 [http://en.wikipedia.org/wiki/.avi video] (also sound document)

9. For programming code leave a space at the start of the line

This is code

Signing an edit

Something that is useful if you want to leave a message is the -~~~~. This will be replaced by your user name at the time you saved the change . For example: -Mverhaart 09:03, 10 November 2010 (UTC)

  • Example

::<div style="color: green;">Adding a comment -~~~~ </div>

  • where
    • :: means indent (add more colons (:) to indent more.
    • ~~~~ is a signed and dated signature
  • becomes..
Adding a comment -Mverhaart 03:54, 24 July 2010 (UTC)

You can also do this using the note template (which adds an icon)

::{{note|Adding a comment -~~~~ }}

  • becomes
(Comment.gif: Adding a comment -Mverhaart 05:31, 24 July 2010 (UTC) )

Linking

  1. Hyperlink other web pages, just have full URL (include http) e.g.
    1. http://www.virtualmv.com/wiki gives http://www.virtualmv.com/wiki
  1. To put linked text, put url <space> and text link between single [, e.g.
    1. [http://www.virtualmv.com virtualMV Web Site] gives virtualMV Web Site

Examples (and link with description)

http://www.webpage.com
[http://www.webpage.com description]

Inserting an image

Before an image can be added to the wiki it must be uploaded to the wiki site. So, look for an image that represents you (make sure its not too large (around 150 x 200 px) - please don't use images that you have copied from the web (to avoid copyright problems).

In order to both keep image sizes down and print properly the MAXIMUM width of any image upload is 595 pixels. Before you upload can you resize your images so they are less than 596 pixels.

There are several ways to add images, however the first "rule" is that the image is available on the internet. Two common techniques to add images are

  1. Link from wikicommons or
  2. Upload a file (see toolbar on the left) then link to the image

Adding from wikicommons

  1. Search for an image at http://commons.wikimedia.org/
  2. In the wiki page you want to insert the image, click on the insert image button
    [[File:Example.jpg]] will appear
    Change Example.jpg to the filename of the media commons file (cut and paste is easiest)

Adding your own image

  • Important: Your image will become part of the WikiEducator set of images, so I strongly recommend you prefix the image with your initials to make it identifiable and unique. e.g. mvImage.jpg (I also like to put the year in front as it helps me know how old the image is e.g. 2014mvimage.jpg
  • The simplest way to add a new image is to add the wikicode [[File:Example.jpg]] into the page where you want the image to appear where Example.jpg is the name of the file you want to insert. Then save the page and click on the red link. This will take you to the "Upload File" page. Browse to the file then add the metadata.
  • Hints for metadata:
    • Original source: I use "Screen Capture", "Modified Screen Capture", "Original drawing", etc...
    • Author, Date & Description - self explanatory
    • Permission: Only if you have copied it from somewhere and has a cc license
    • Licensing the most common are ..
      • Your own work CC0 waiver (Public domain): You are giving it away
      • Own work, attribution required (CC-BY 3.0): Others can use it but need to say you are the author (they can modify it if they want to).

Some extras

  • To align the image : [[File:Example.jpg|left]] [[File:Example.jpg|center]] [[File:Example.jpg|right]]
    • To change the image size: [[File:Example.jpg|100px]]
  • image aligned right with caption [[File:file.png|frame|Text]]
  • thumbnail [[File:file.png|thumb|Text]]
  • 200 pixel wide with tooltip [[File:file.png|200px|Text]]
  • Hyperlinked image
YouTube link

[[File:2011YouTube_AprilFool.png|left|150px|link=http://www.youtube.com/watch?v=aP4fWMLofvo&feature=mfu_in_order&list=UL|alt=YouTube link]]
There's lots more but this is a quick guide :)

(Note: I have found File works better than Image)

Special formatting

New line

Use <br /> for new line in a paragraph (also used to extend a bullet point)

Source code formatting

Source code formatting has been installed in virtualMV wiki you can use (Note I have had to put spaces into the source and div tags to enable them to show in the example)

<source lang="actionscript">
trace{"Hello World");
</ source>

there are lots of languages to choose from (e.g. asp,cpp,css,mysql,php,sql,vbnet,xml). Check out http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi for a list.

or getting a bit flasher I have created a template ...

{{vmv:Source|<source lang="actionscript">
trace{"Hello World");
</ source>}}

gives

  trace{"Hello World");
  • You can highlight lines of code using the highlight attribute in the source tag
    • e.g. highlight="5", highlight="5,7,9", highlight="5-9"
  • You can line number using the line start attribute
    • e.g. line start="100"

Table

Basic table (no borders)

{|
| #
| Description
| Price
| Purchased
|-
| 1.
| Pen
| $0.50
| 11/09/2008
|-
| 2.
| Pencil
| $0.20
| 23/08/2008
|}
Fixed table code -Johnyoung6190 (talk) 9:39, 10 March 2016 (UTC)
# Description Price Purchased
1. Pen $0.50 11/09/2008
2. Pencil $0.20 23/08/2008

Basic table (with borders)

{|style="border-collapse: collapse;" border="1"
|Row#
|ColTitle1
|ColTitle2
|-
|1
|11
|12
|-
|2
|21
|22
|}
Row# ColTitle1 ColTitle2
1 11 12
2 21 22

You can also use your HTML skills, for example creating a table

<table>
<tr>
<td>Row1,Column1</td> <td>Row1,Column2</td>
</tr>
..
</table>

Templates

Media wiki allows you create template pages that can be used where you want to reuse content. You can create dynamic content by using the | to separate the parameters

Adding some boxes

I have added some box templates to make you work a bit flashier!!

template: {{vmv:Box|Type|Level|Title|Contents}}
  • Valid types so far = Objective, Objectives, Note, Notes, KeyPoint, KeyPoints, NZ, More
  • For example:
{{vmv:Box|Objective|3|Amazing objectives|
Students will:
#Objective 1
#Objective 2 
}}


VmvIcon Objective.png

Amazing objectives

Students will:

  1. Objective 1
  2. Objective 2
VmvIcon Note.png

File:VmvIcon KeyPoint.png

VmvIcon NZ.png

New Zealand Content
VmvIcon More.png

For further discussion ...


Adding a collapsible box

Heading (Table that can be collapsed)

Content


Adding references (APA style)

In this wiki I have added a references extension

In the text use

cite<ref>reference</ref>

e.g.

Verhaart(2009)<ref>Verhaart, M. (2009) The virtualMe. Retrieved July 12, 2009 from http://www.virtualmv.com</ref>

Then add the following to the bottom of the page

== References ==
<references/>

If you want to refer to the same reference more than one use

cite<ref name="name">reference</ref>

then for the subsequent refs use

<ref name="name" />

E.g.

Verhaart (2009)<ref name="vme">Verhaart, M. (2009) The virtualMe. Retrieved July 12, 2009 from http://www.virtualmv.com</ref>

then for subsequent ones

Verhaart (2009)<ref name="vme" />

Ref: Extension:Cite/Cite.php. (2009)[1]

To simplify the adding of a references section on each page I have created a wiki template. Add the following template command to the end of your wiki page.

{{vmv:FooterAPAAuthor|LastName, initial.|yyyy}}

For example:

{{vmv:FooterAPAAuthor|Verhaart, M.|2009}}

If you want to have the APA page reference at the bottom of the page but there are no references on the page use

{{vmv:FooterAPA-Ref}}


Examples

View the source

YouTube

The IT Crowd - Series 3 - Episode 4: The Internet. (2009)

YouTube: The IT Crowd - Series 3 - Episode 4: The Internet. (2009)
For a light hearted view of the internet from the IT Crowd TV Series.. The IT Crowd - Series 3 - Episode 4: The Internet. (2009)[2] and the follow up at the shareholders meeting: [3] [3 min]



Cite error: <ref> tags exist, but no <references/> tag was found