Difference between revisions of "Help:WikiMarkup Formatting"
(→Images: added how to add a clickable image using imagemap) |
m (→Images: changed font to red to indicate which bits they should replace) |
||
Line 202: | Line 202: | ||
|- | |- | ||
|<big>Image appears on page</big><br><br>In this example want to display the WikiVet logo, so insert file name '''Wikivet.png''' into the image code <nowiki>[[File:]]</nowiki>.<br>Click "edit" on the page you want image on, then insert the code in desired location and click "save".<br>File name must match exactly what appears in [http://commons.wikivet.net WikiVet Commons].<br>The default size is as uploaded to WikiVet Commons, the default position is to the left. | |<big>Image appears on page</big><br><br>In this example want to display the WikiVet logo, so insert file name '''Wikivet.png''' into the image code <nowiki>[[File:]]</nowiki>.<br>Click "edit" on the page you want image on, then insert the code in desired location and click "save".<br>File name must match exactly what appears in [http://commons.wikivet.net WikiVet Commons].<br>The default size is as uploaded to WikiVet Commons, the default position is to the left. | ||
− | |<tt><nowiki>[[File:Wikivet.png]]</nowiki></tt> | + | |<tt><nowiki>[[File:</nowiki><font color=red>Wikivet.png</font><nowiki>]]</nowiki></tt> |
|[[File:Wikivet.png]] | |[[File:Wikivet.png]] | ||
|- | |- | ||
|<big>Change '''size''' of image </big><br><br>can set '''width''' and height will adjust according to same ratio as uploaded. <br>In this example, want to make image 50 pixels wide, so insert '''<nowiki>|50px</nowiki>''' into the image code | |<big>Change '''size''' of image </big><br><br>can set '''width''' and height will adjust according to same ratio as uploaded. <br>In this example, want to make image 50 pixels wide, so insert '''<nowiki>|50px</nowiki>''' into the image code | ||
− | |<tt><nowiki>[[File:Wikivet.png|50px]]</nowiki></tt> | + | |<tt><nowiki>[[File:Wikivet.png</nowiki><font color=red><nowiki>|50px</nowiki></font><nowiki>]]</nowiki></tt> |
|[[File:Wikivet.png|50px]] | |[[File:Wikivet.png|50px]] | ||
|- | |- | ||
|<big>Change '''position''' of image</big><br><br>Can change default position for image on the screen to left, center or right.<br>In this example, have made aligned to the center by inserting '''<nowiki>|center</nowiki>''' into the image code.<br>Can align to the left with '''<nowiki>|left</nowiki>''' and to the right with '''<nowiki>|right</nowiki>''' | |<big>Change '''position''' of image</big><br><br>Can change default position for image on the screen to left, center or right.<br>In this example, have made aligned to the center by inserting '''<nowiki>|center</nowiki>''' into the image code.<br>Can align to the left with '''<nowiki>|left</nowiki>''' and to the right with '''<nowiki>|right</nowiki>''' | ||
− | |<tt><nowiki>[[File:Wikivet.png|center]]</nowiki></tt> | + | |<tt><nowiki>[[File:Wikivet.png</nowiki><font color=red><nowiki>|center</nowiki></font><nowiki>]]</nowiki></tt> |
|[[File:Wikivet.png|center]] | |[[File:Wikivet.png|center]] | ||
|- | |- | ||
|<big>Make image into a '''thumbnail'''</big><br><br>Can put box around image by inserting '''<nowiki>|thumb</nowiki>''' into the image code.<br>Default position for thumbnails is to the right of the screen. | |<big>Make image into a '''thumbnail'''</big><br><br>Can put box around image by inserting '''<nowiki>|thumb</nowiki>''' into the image code.<br>Default position for thumbnails is to the right of the screen. | ||
− | |<tt><nowiki>[[File:Wikivet.png|thumb]]</nowiki></tt> | + | |<tt><nowiki>[[File:Wikivet.png</nowiki><font color=red><nowiki>|thumb</nowiki></font><nowiki>]]</nowiki></tt> |
|[[File:Wikivet.png|thumb]] | |[[File:Wikivet.png|thumb]] | ||
|- | |- | ||
|<big>Add '''captions''' to a thumbnail</big><br><br>Can add a description or a link underneath a thumbnail image.<br>In this example a simple description is entered - see [[Help:WikiMarkup_Formatting#Links|Links]] section for different links you can display.<br>To dispaly "WikiVet Logo" under the thumbnail, add '''<nowiki>|thumb|WikiVet Logo</nowiki>''' to the image code. | |<big>Add '''captions''' to a thumbnail</big><br><br>Can add a description or a link underneath a thumbnail image.<br>In this example a simple description is entered - see [[Help:WikiMarkup_Formatting#Links|Links]] section for different links you can display.<br>To dispaly "WikiVet Logo" under the thumbnail, add '''<nowiki>|thumb|WikiVet Logo</nowiki>''' to the image code. | ||
− | |<tt><nowiki>[[File:Wikivet.png|thumb|WikiVet Logo]]</nowiki></tt> | + | |<tt><nowiki>[[File:Wikivet.png</nowiki><font color=red><nowiki>|thumb|WikiVet Logo</nowiki></font><nowiki>]]</nowiki></tt> |
|[[File:Wikivet.png|thumb|WikiVet Logo]] | |[[File:Wikivet.png|thumb|WikiVet Logo]] | ||
|- | |- | ||
|<big>Make image a '''clickable link'''</big><br><br>This uses the Imagemap extension which puts an information button on the bottom right corner linking to the image file.<br>You add the file name after <nowiki>"Image:"</nowiki>, you can also define size and position.<br>Add link to page after "default" - this is the page that user will be taken to when they click the image. | |<big>Make image a '''clickable link'''</big><br><br>This uses the Imagemap extension which puts an information button on the bottom right corner linking to the image file.<br>You add the file name after <nowiki>"Image:"</nowiki>, you can also define size and position.<br>Add link to page after "default" - this is the page that user will be taken to when they click the image. | ||
|<tt><nowiki><imagemap></nowiki><br> | |<tt><nowiki><imagemap></nowiki><br> | ||
− | <nowiki> | + | Image:<font color=red><nowiki>Wikivet.png|50px|center</nowiki></font><br> |
− | <nowiki> | + | default <font color=red><nowiki>[[Veterinary Education Online]]</nowiki></font><br> |
<nowiki></imagemap></nowiki></tt> | <nowiki></imagemap></nowiki></tt> | ||
|<imagemap> | |<imagemap> |
Latest revision as of 13:24, 11 January 2012
|
Description | You type | You get |
applies anywhere | ||
Italic text | ''italic'' | italic |
Bold text | '''bold''' | bold |
Bold and italic | '''''bold & italic''''' | bold & italic |
Escape wiki markup | <nowiki>no ''markup''</nowiki> | no ''markup'' |
only at the beginning of the line | ||
Headings of |
==level 1== |
Level 1Level 2Level 3Level 4 |
Horizontal rule |
---- |
|
Bullet list |
* one |
|
Numbered list |
# one |
|
Mixture of bulleted and numbered lists |
# one |
|
Definition list |
;Definition |
|
Preformatted text |
preformatted text is done with |
preformatted text is done with a space at the beginning of the line |
Notes:
- ↑ Use of a heading created by single equal signs is discouraged as it appears with the same formatting and size as the page title, which can be confusing.
- ↑ An article with four or more headings will automatically create a table of contents.
Paragraphs
MediaWiki ignores normal line breaks. To start a new paragraph, leave an empty line. You can also start a new line with the HTML tags <br> or <br/>.
HTML
Some HTML tags are allowed in MediaWiki, for example <code>, <div>, <span> and <font>.
Links
You will often want to make clickable links to other pages.
Description | You type | You get |
Internal link | [[Veterinary Education Online]] | Veterinary Education Online |
Category link | [[:Category:Help]] | Category:Help |
Piped link | [[Veterinary Education Online|different text]] | different text |
Anchor link | [[#External links|Anchor link]] | Anchor link |
External link | http://mediawiki.org | http://mediawiki.org |
Internal link to image file | [[media:example.jpg]] | media:example.jpg |
External link, different title |
[http://mediawiki.org MediaWiki] | MediaWiki |
External link, unnamed |
[http://mediawiki.org] | [1] |
External link, same host unnamed |
[http://{{SERVERNAME}}/pagename] | [2] |
Interwiki link | [[Wikipedia:MediaWiki]] | Wikipedia:MediaWiki |
mailto | mailto:info@example.org | mailto:info@example.org |
mailto unnamed | [mailto:info@example.org] | [3] |
mailto named | [mailto:info@example.org info] | info |
redirect | #REDIRECT [[Veterinary Education Online]] | → Veterinary Education Online |
Images
You will often want to make links different sizes, move them to different positions on the page, make them clickable links or give them captions.
Description | You type | You get |
Image appears on page In this example want to display the WikiVet logo, so insert file name Wikivet.png into the image code [[File:]]. Click "edit" on the page you want image on, then insert the code in desired location and click "save". File name must match exactly what appears in WikiVet Commons. The default size is as uploaded to WikiVet Commons, the default position is to the left. |
[[File:Wikivet.png]] | |
Change size of image can set width and height will adjust according to same ratio as uploaded. In this example, want to make image 50 pixels wide, so insert |50px into the image code |
[[File:Wikivet.png|50px]] | |
Change position of image Can change default position for image on the screen to left, center or right. In this example, have made aligned to the center by inserting |center into the image code. Can align to the left with |left and to the right with |right |
[[File:Wikivet.png|center]] | |
Make image into a thumbnail Can put box around image by inserting |thumb into the image code. Default position for thumbnails is to the right of the screen. |
[[File:Wikivet.png|thumb]] | |
Add captions to a thumbnail Can add a description or a link underneath a thumbnail image. In this example a simple description is entered - see Links section for different links you can display. To dispaly "WikiVet Logo" under the thumbnail, add |thumb|WikiVet Logo to the image code. |
[[File:Wikivet.png|thumb|WikiVet Logo]] | |
Make image a clickable link This uses the Imagemap extension which puts an information button on the bottom right corner linking to the image file. You add the file name after "Image:", you can also define size and position. Add link to page after "default" - this is the page that user will be taken to when they click the image. |
<imagemap> Image:Wikivet.png|50px|center |
For further help please look at this site; help from MediaWiki