Help:Markup
This article provides a brief introduction to the markup language used to format Wiki articles. Since this syntax is shared among all Wiki-based projects, you may read a more in-depth explanation at Wikipedia, which also offers a brief tutorial (besides a lot of examples and templates to steal).
Contents |
Basics
Headings
Headings mark the beginning of new sections within a document, ad are automatically compiled into a table of contents at the beginning of the article, just before the first heading. They can also be used as though they were internal links.
To create an heading, just surround a line with a number of = signs greater than one. For the HTML-savvy, surrounding some text with a number n of equal signs is similar to using the tag <Hn>. That's the reason why you should always use at least two = signs: the <H1> level is reserved for the page title, which is automatically generated by the Wiki platform.
| What it looks like | What you type |
|---|---|
|
Section headings
Headings organize your writing into sections. The Wiki software can automatically generate a table of contents from them. Subsection
Using more equals signs creates a subsection. A smaller subsection
Don't skip levels, like from two to four equals signs. Start with 2 equals signs not 1 because 1 creates H1 tags which should be reserved for page title. |
== Section headings == ''Headings'' organize your writing into sections. The Wiki software can automatically generate a table of contents from them. === Subsection === Using more equals signs creates a subsection. ==== A smaller subsection ==== Don't skip levels, like from two to four equals signs. Start with 2 equals signs not 1 because 1 creates H1 tags which should be reserved for page title. |
Wiki-style formatting
A number of tags that are specisic tyo the Wiki platform are available for quick and effective formatting of your articles. These tags will probably suffice for 99% your daily usage, and are optimezed to be both quick and readable.
Stressing the text is usually done in the form of bold and italicized font, and is accomplished by surrounding the word(s) to stress with ' characters: two apostrophes per side produce italicized text and three yeld a bold face. The two can also be combined, so that five apostrophes produce bold italicized text.
Inserting a single newline in the text flow has no effect, so just help yourself in order to make for better reviewable article. If you want to start a new paragraph, you have to feed two carriage returns (a.k.a. "strike Enter twice"). It's possible to go to a new line without beginning a new paragraph using the tag <br>, but you should use this sparingly. You should also avoid interrupting a bold, itacized or link structure with a new line. Why would you do that, anyway?
Unordered lists (a.k.a. bullets) are generated putting a * character in front of each line; using a # instead will result in an ordered list (a.k.a. numbers). Text can be indented with a trailing :. All this stuff can be freely mixed, using resulting in an unreadable mess.
Footnotes are added using the <ref> tag. Put the text of the footnote at the place where the reference should appear, enclosing it between <ref> and </ref>. An automatic number will appear, and the actual notes will be displayed at an arbitrary point, specified by the tag <references />.
| What it looks like | What you type |
|---|---|
|
Two apostrophes for italic, three for bold. |
Two apostrophes for ''italic'', three for '''bold'''. A whopping five for '''''both'''''. |
|
One line break has no effect. Two mark the beginning of a new paragraph. |
One line break has no effect. Two mark the beginning of a new paragraph.<br> In exceptional circumstances, a manual carriage return can be used. |
You can stop it by omitting the trailing *.
|
*This is *an unordered list *of bulleted items. **Different depths **can be used. You can stop it by omitting the trailing <tt>*</tt>. #Ordered lists #can be generated #in a similar fashion. *You may also *combine the two lists *#into very complex *#hierarchical strustures. :Indented text is useful :to make a section stand-out. ::It can also be nested. :However, be aware of more subtle ways to stress your points (have a look at section [[#HTML-style formatting]]. |
|
This is a statement tha needs a source.[1] Here is another concept.[2] In the end: |
This is a statement tha needs a source.<ref>And this is the source itself.</ref> Here is another concept.<ref>And here is the foot note.</ref> In the end: <references /> |
HTML-style formatting
Besides these Wiki-specific techniques, you can also borrow from current HTML, and you can even mix-and-match the two styles freely.
Bold, italic, struck out and underlined text can be generated using the tags <b>, <i>, <s>, and <u>, respectively. This practice however is deprecated by both Wikipedia and the W3 Consortium, since the markup should express function, not form. It's advisable to use the apostrophes-based markup for emphasis, and <del> for removed items.
Superscripts and subscripts are obtained with <sup> and <sub>, and are useful for very simple expression: X2, H2O; or mildly complexed scripts: ε0 = 8.85 × 10−12 C² / J m. If you need to insert a complex formula, you can have TeX syntax interpreted using <math>.
Text can be centered using <center>, and a quote should be highlighted using <blockquote>. This method is preferred to trailing :. It's also possible to use the CSS-like tags <div> and <span>, whose syntax is not within the scope of this brief tutorial.
The font size can be increased or decreased using <big> and <small>, but these tags should be used very sparingly. A monotype font can be obtained using <tt> - this is better used for single words in a normal paragraph, not for code blocks.
| What it looks like | What you type |
|---|---|
|
You can use HTML tags for bold, italic, and so |
You can use HTML tags for <b>bold</b>, <i>italic</i>, <u>and</u> so <s>on</s>. |
|
However, this feature should be used with care. From a great power... You know. |
<center>The text can be centered at will. </center> However, this feature should be used with care. <blockquote>From a great power... You know.</blockquote> |
Links
The main advantage a web site offers over a collection of documents is that al pages can be connected with one another in a very effective fashion. When you write a new article, please find the time to link it to other writings (editing the links if necessary) and to format as a link any possible entry point to another topic. Only the first occurence of a given word should be turned into a link. Don't worry if an article you want to link to does not exist yet: the link will simply show in red, so that it's apparent that some work on the topic is required.
Internal links
Linking to another article of the Wiki is easy: just surround a word with double square brackets ([[ your word(s) here ]]) to turn it into a link to an article with that name. The first letter can be capitalized or not without distinction, and spaces arre automatically turned into underscores, but all others letters should have the proper capitalization. It's still possible to format the linking text using normal markup.
You can link to a specific section of an article separating it from the main name with a # sign. If that article has no section with that name, the link will point to the beginning of the article. If you omit the article name, the link will point to a section with that name within the current document.
It's possible to link to a page using text different from the name of the page. To do this, you have to type within the double square brackets the name of the target article, a | sign, and the text you want to be displayed as a link.
Links are also used to sort articles into categories. If you insert a link to a category page, it will not show as an ordinary link; instead, it will insert a link at the bottom of the page, and will cause the page to be listed under that category. If you want to show a link to a category where you type it and without filing the page into that category, prepend a colon to the link.
| What it looks like | What you type |
|---|---|
|
This is a link to the Main Page, and so is this: main_Page. But this will fail for lack of proper capitalization: main page. |
This is a link to the [[Main Page]], and so is this: [[main_Page]]. But this will fail for lack of proper capitalization: [[main page]]. |
|
You can link to a specific section with ease: Help:FAQ#Users. If you want your links to look prettier and not hinder readability, use piped links to display an arbitrary text: Who should use EMRWiki? |
You can link to a specific section with ease: [[Help:FAQ#Users]]. If you want your links to look prettier and not hinder readability, use piped links to display an arbitrary text: [[Help:FAQ#Users|Who should use EMRWiki?]] |
|
The following line will put a link at the bottom of the page and file this article in the help category. (Note how an actual link to the category was inserted.) |
The following line will put a link at the bottom of the page and file this article in the [[:Category:Help|help category]]. [[Category:Help]] ''(Note how an actual link to the category was inserted.)'' |
External links
The simplest way to insert a link to an external site is to type its URL. If you want to conceal the (very ugly and sometimes page-breaking) address, you can put it into single square brackets: the links will be displayed as numbers, autamatically computed by the Wiki software (this is especially useful for lists of references).
You can also have your links display an arbitrary text instead. To do this, the target address within square brackets should be followed by a space and then by the text to be displayed.
All this is valid also for links to an e-mail address, except that an envelop will be displayed instead of an arrow.
| What it looks like | What you type |
|---|---|
|
This is the simple way to insert a link: http://www.google.it. The use of brackets allows us to conceal the URL: [1] [2] It's also possible (and probably advisable) to add a descriptive name to the link: Wizards of the Coast |
This is the simple way to insert a link: http://www.google.it. The use of brackets allows us to conceal the URL: [http://www.repubblica.it] [http://www.corriere.it] It's also possible (and probably advisable) to add a descriptive name to the link: [http://www.wizards.com Wizards of the Coast] |
|
Here's an e-mail link: George W. Bush |
Here's an e-mail link: [mailto:mr-president@whitehouse.gov George W. Bush] |
Pictures and other files
Before including a picture into an article, it's necessary to upload it into the Wiki database: embedding of external pictures is disabled. To upload a file, just click on the link with the same name in the column on the left side of the screen, then browse your computer for the file you want to upload.
Once you have uploaded a file, its page (that includes information such as who uploaded it and the file description) will be accessible as Image:<filename.ext>, and you can link to it as you would link to any EMRWiki article, but you have to prefix the name with a :. If you absolutely need to link to the raw file, you should replace Image: with Media:.
This is not the usual way to handle pictures, but can be useful to link to other types of file, notably PDF documents. Note that all files will be listed as images by the Wiki software, regardless of their actual type.
The simplest way to embed a picture into your article is to put it into double square brackets (including the Image: prefix): it will be displayed in the at the spot you lace the tag, without frame and aligned to a single line of text.
There is a number of parameters that can be given inside the double brackets. The complete syntax can be written as follows:
[[Image:filename.ext[|alignment][|mode][|size][|caption]]]
- The alignment parameter can have one of the following values:
- right: The picture is aligned right, and text flows around it.
- left: The picture is aligned left, and text flows around it.
- center: The picture is centered, and text is allowed only above and bottom.
- none: The picture is aligned left, and text is allowed only above and bottom.
- The mode parameter can have one of the following values:
- frame: The picture will be encased in a frame, and the caption (if present) will be displayed below it.
- thumb: A thumbnail of the picture (whose size depends from preferences set by each user) will be displayed in a frame, with a button that links to the full-scale image and the caption (if present) below it.
- The size parameter can be used to resize a picture to a given width (in pixels). It must be expressed as a number suffixed by px.
- The caption parameter is a string that briefly describes the picture. It will be displayed in the hoverbox instead of the file name, and it will be displayed below the picture if it's displayed in a frame or as a thumbnail.
| What it looks like | What you type |
|---|---|
|
The STMicroelectronics logo (File:Logo.png) should be watermarked on all internal documents. |
The STMicroelectronics logo ([[Image:Logo.png]]) should be watermarked on all internal documents. |
| The STMicroelectronics logo should be watermarked on all internal documents. |
[[Image:Logo.png|left]] The STMicroelectronics logo should be watermarked on all internal documents. |
|
Please remember that all articles and files hosted on EMRWiki are for internal use only. Don't leak it to customers without checking before! (Also, note that animated GIFs and PNGs are supported.) |
[[Image:Mostruoso.gif|right|frame]] Please remember that all articles and files hosted on EMRWiki are for internal use only. Don't leak it to customers without checking before! ''(Also, note that animated GIFs and PNGs are supported.)'' |
|
A poorly-handled conflict can easily escalate into an excruciating discord. (Click on the thumbnail for a full-size version.) |
[[Image:Peppone_e_don_Camillo.jpg|right| thumb|70px]] A poorly-handled conflict can easily escalate into an excruciating discord. ''(Click on the thumbnail for a full-size version.)'' |
|
Hover the mouse on the picture to see its caption: |
Hover the mouse on the picture to see its caption: [[Image:Latte+.jpg|left|Screenshot from A Clockwork Orange.]] |
Tables
The Wiki software offers a special syntax for drawing tables, albeit the HTML tags <table>, <tr>, and <td> can be used as well.
In the so-called piped syntax, all of the table code must be contained within the following two symbols: {| and |}. After the first sign, a caption for the whole table can be given, introduced by a |+ tag.
A single pipe starts a new row, and a single ! starts a row formatted as a header. The cells within a row should be separated with either a double pipe or a pipe and a new line, while cells in a header row should be separated with either a double exlamation mark or an exlamation mark and a new line. The sign |- is used to separate rows, and the first cell of a row can be formatted as a row heading starting the row with a ! rather than a |.
This markup makes for tables whose code can be decently understood. The following code:
{|
|+ '''Table's caption'''
! Column heading 1 !! Column heading 2 !! Column heading 3
|-
| Content || Content || Content
|-
| Content || Content || Content
|}
will be rendered as:
Table's caption Column heading 1 Column heading 2 Column heading 3 Content Content Content Content Content Content
It's possible to format Wiki tables using the same parameters of the corresponding HTML tags (border, cellpadding, align, etc.), or CSS-style elements such as class, <span>, or <div>. For example, this code:
{| class="wikitable" border="1" cellpadding="5" cellspacing="0" align="top"
|+ <span style="font-weight:bold; color:red">'''Table's caption'''</span>
! Column heading 1 !! Column heading 2 !! Column heading 3 !! Column heading 4
|-
! Row heading 1
| Content || Content || Content
|- style="background:red; color:white"
! Row heading 2
| Content || Content || Content
|-
! Row heading 3
| Content || Content || Content
|}
will be rendered as:
Table's caption Column heading 1 Column heading 2 Column heading 3 Column heading 4 Row heading 1 Content Content Content Row heading 2 Content Content Content Row heading 3 Content Content Content
It's possible to set the width of a column and the height of a row, as opposed to have its ize autamatically determined. This will also activate word wrap in that column. It's also possible to set the alignment (both vertical and horizontal) on a row or column basis, nest tables or have a particular cell span over two or mor columns/rows. Here's an example that takes advantage of these techniques:
{| class="wikitable" border="1" cellpadding="5" cellspacing="0" align="top"
! style="background:#808080; color:white" width="15%" | Name of the book
! style="background:#808080; color:white" width="65%" | Plot summary
! style="background:#808080; color:white" width="20%" | Main Characters
|-
! The Hobbit
|
"The Hobbit" synopsis
| align="center" |
Bilbo Baggins<br>
Gandalf<br>
Thorin Oakenshield<br>
Smaug the Dragon
|-
! The Fellowship of the Ring
|
{|
|-
|
Book I synopsis
|-
|
Book II synopsis
|}
| rowspan="3" align="center" |
Frodo Baggins<br>
Sam Gamgee<br>
Merry Brandybuck<br>
Pippin Took<br>
Gandalf<br>
Aragorn<br>
Boromir<br>
Legolas<br>
Gimli<br>
Gollum
|-
! The Two Towers
|
{|
|-
|
Book III synopsis
|-
|
Book IV synopsis
|}
|-
! The Return of the King
|
{|
|-
|
Book V synopsis
|-
|
Book VI synopsis
|}
|}
This code will be rendered as:
Name of the book Plot summary Main Characters The Hobbit Gandalf tricks Bilbo into hosting a party for Thorin's band of dwarves, who sing of reclaiming the Lonely Mountain and its vast treasure from the Dragon Smaug. When the music ends, Gandalf unveils a map showing a secret door into the Mountain and proposes that the dumbfounded Bilbo serve as the expedition's "burglar." The dwarves ridicule the idea, but Bilbo, indignant, joins despite himself.
Bilbo Baggins
Gandalf
Thorin Oakenshield
Smaug the DragonThe Fellowship of the Ring
The first book sets the stage for the adventure and follows the Hobbit Frodo Baggins as he flees from his home in the Shire to escape the minions of the Dark Lord Sauron.
Book II opens at Rivendell in the house of Elrond. Frodo, recovering from his injuries, also discovers that Bilbo has been safe in Rivendell. A plan is hatched to destroy the Ring in Mordor.
Frodo Baggins
Sam Gamgee
Merry Brandybuck
Pippin Took
Gandalf
Aragorn
Boromir
Legolas
Gimli
GollumThe Two Towers
As Aragorn searches for Frodo, he suddenly hears Boromir's horn. He finds Boromir mortally wounded by arrows, his assailants gone. Before Boromir dies he reveals that Merry and Pippin had been captured by Orcs in spite of his efforts to defend them, and that Frodo had disappeared after Boromir had tried to take the Ring from him.
Frodo and Sam discover and capture Gollum, who has been stalking them in their quest to reach Mount Doom and destroy the One Ring, for Gollum hopes to reclaim the Ring for himself. Sam loathes and distrusts him, but Frodo pities the poor creature.
The Return of the King
The story begins with Gandalf and the hobbit Peregrin Took (Pippin) delivering news to Denethor, the Lord and Steward of Gondor, that a devastating attack on his city by the armies of Mordor is imminent. Pippin then enters the service of the Steward as repayment of a debt he owes to Boromir, Denethor's dead son and preferred heir.
Book VI begins with Frodo held captive in the enemy stronghold of Cirith Ungol after being poisoned by Shelob. The brave and loyal Sam—who for a short time bears the One Ring in Frodo's place—rescues his master from torture and death by Orcs and the two navigate the barren wasteland of Mordor.
Code
Given the specific use of this Wiki, it's likely that you'll want to include blocks of code or names of functions in your articles. To use a monospace font (such as this), surround it with the tags <tt> or <code>.
Sometimes you will need to disable some or all of the Wiki syntax. To stop the tags (both Wiki and HTML) from being interpreted, enclose your text between <nowiki> tags. If you want your text to be displayed exactly as you type it (that is, with no suppression of multiple spaces, no automatic word wrap, and so on), use the tag <pre> instead. Please be careful when using <pre>, and remember to manually insert line breaks, otherwise readers will have to scroll your text left and right.
If you have a whole snippet of program to insert, you can use the tag <source>, which also accept the parameter lang="language name".
| What it looks like | What you type |
|---|---|
|
All STAPI drivers should be initialized with a call to STXXX_Init(). |
All STAPI drivers should be initialized with a call to <tt>STXXX_Init()</tt>. |
The standard command to obtain a status of the repository is: svn status -q -u |
The standard command to obtain a status of the repository is: <pre>svn status -q -u</pre> |
|
Here's a sample of a C program: <source lang="c">
int main(void) { printf("hello, world\n");
return 0;
} </source> |
Here's a sample of a C program:
<source lang="c">
#include <stdio.h>
int main(void)
{
printf("hello, world\n");
return 0;
}
</source>
|
