Wikidot Wiki Syntax

Wiki Syntax

This document describes the Wiki Syntax used within the Wikidot.com project.

Any page of any of the sites exists in two different forms: the source code and the compiled code. Source code is what you can edit and what describes the content of the page. Source code is compiled intoediting the source code.

If you are looking for wiki code snippets ready to copy/paste/modify, please visit our Code Snippets Site.

Documents you might also be interested in:

Code embedding list of supported embeds, i.e. pieces of code from other websites you can use on Wikidot, like films from YouTube or Google Gadgets.Modules description of modules interactive elements you can put on your pages.

Fold

Table of Contents

Inline FormattingText Size

Relative text sizesAbsolute text sizes

Paragraphs and newlinesTypographyLiteral TextUniversal Escaping

Live exampleCommentsHeadingsTable of ContentsHorizontal RulesLists

Bulleted ListsNumbered Lists

Definition ListsBlock QuotesCollapsible blocksLinks

Site: Wikidot - Free and Pro Wiki Hosting at http://www.wikidot.comSource page: Wiki Syntax at http://www.wikidot.com/doc:wiki-syntax

Wikidot - Free and Pro Wiki Hosting: Wiki Syntax http://www.wikidot.com/printer--friendly//doc:wiki-syntax

1 of 30 1/2/2013 12:15 PM

Internal linksURLsAnchorsEmailsInterWikiMagic URIs

Hash Magic URIsImages

Single imagesGallery of images

NotesHTML BlocksCode BlocksTables

Simple tablesAdvanced (custom) tables

Block formatting elementsLeft, right, centered and justifiedCustom div blocks

MathEquationsInline math

FootnotesBibliographyDate: How Long Ago?

How it worksCode WizardExamplesLimitations

Include other pagesEmbedding media

VideoAudio

Embedding code from other sites[[embed]] tag[[iframe]] element

IftagsModulesAttached filesUsersSocial bookmarkingStandalone buttons for page optionsButton for tag updateLayout elements


2 of 30 1/2/2013 12:15 PM

Tab view

Inline Formattingwhat you type

//italic text//

**bold text**

//**italic and bold**//

__underline text__

--strikethrough text--

{{teletype (monospaced) text}}

normal^^superscript^^

normal,,subscript,,

[!-- invisible comment --][[span style="color:red"]]custom //span// element[[/span]]

##blue|predefined## or ##44FF88|custom-code## color

Text SizeText (font) size can be set with the [[size ]] [[/size]] tags. These tags can be nested.

Relative text sizes

Relative text sizes are based on the current font they increase or decrease the current font size. To specify a relative text size use [[size smaller]], [[size larger]], [[size

what you type

[[size smaller]]smaller text[[/size]]

[[size larger]]larger text[[/size]]

[[size 80%]]80% of current size[[/size]]



3 of 30 1/2/2013 12:15 PM


[[size 0.8em]]80% of current size[[/size]]

[[size 1em]]100% of current size[[/size]]

[[size 1.5em]]150% of current size[[/size]]

Absolute text sizes

Absolute text sizes are not based on the current font size. To specify an absolute text size use [[size xx-small]], [[size x-small]], [[size small]], [[size large]], [[size x-large]]

what you type

[[size xx-small]]xx-small text[[/size]][[size x-small]]x-small text[[/size]]

[[size small]]small text[[/size]]

[[size large]]large text[[/size]]

[[size x-large]]x-large text[[/size]]

[[size xx-large]]xx-large text[[/size]]

[[size 7px]]text size 7 pixels[[/size]]

[[size 18.75px]]text size 18.75 pixels[[/size]]

Paragraphs and newlinesParagraphs are separated by two new lines. One new line produces a new line.

First paragraph. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Second paragraph. Aenean a libero. Vestibulum adipiscing, felis ac faucibus imperdiet, erat lacus accumsan neque, vitae nonummy lorem pede ac elit.Just a new line.Another new line.

First paragraph. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Second paragraph. Aenean a libero. Vestibulum adipiscing, felis ac faucibus imperdiet, erat lacus accumsan neque, vitae nonummy lorem pede ac elit.Just a new line.


4 of 30 1/2/2013 12:15 PM

Another new line.

TypographyIf you do care about typography there are a few ways to improve it in your text:

you type you get

``quotation'' quotation

`quotation' quotation

,,quotation'' quotation

quotation

>>quotation@. Inside this sequence, convert each "&" to "&", each ""

The escape sequence will decode HTML entities like < including:

entities such as ()numeric entities like ()


5 of 30 1/2/2013 12:15 PM

Unicode entities like () or ()

Live example

HTML entities: @@@@@@@@@@@@@@Or, @@ and @@

Which gives:

HTML entities: U umlaut: [[code]]Hello world @@ !!!!Something **not** bold[[module ListPages]]Copyright sign: [[/code]]Or, @< and >@

CommentsA comment is a source block that is not rendered in the compiled version. To add a comment to the source use [!-- ... --] construct, e.g.:

[!--This text will not be rendered.--]

HeadingsTo make a heading start a line with a "plus". Make as many pluses as the heading level you want to get.

+ Level 1 Heading++ Level 2 Heading+++ Level 3 Heading++++ Level 4 Heading


6 of 30 1/2/2013 12:15 PM

+++++ Level 5 Heading++++++ Level 6 Heading

Table of ContentsTo create a list of every heading, with a link to that heading, put a table of contents tag on its own line.

[[toc]][[f>toc]] - right-float table of contents[[f

If you need to put more than one line in the bullet list, please use _ (underscore) at the end of the line you want to break (after one space). Remember not to insert any character after the underscore.

* Bullet 1 _ another line* Bullet 2 * Bullet 2.1

Bullet 1another lineBullet 2

Bullet 2.1

Numbered ListsSimilarly, you can create numbered lists by starting a paragraph with one or more hashes.

# Item 1# Item 2 # Item 2.1

Item 11.Item 2

Item 2.11.2.

If you need to put more than one line in the numbered list, please use _ (underscore) at the end of the line you want to break (after one space). Remember not to insert any character after the underscore.

# Item 1 _ another line# Item 2 # Item 2.1

Item 1another line

1.

Item 2Item 2.11.

2.

You can mix bulleted lists and number lists.

Definition Lists


8 of 30 1/2/2013 12:15 PM

You can create a definition (description) list with the following syntax:

: Item 1 : Something: Item 2 : Something else

Item 1Something

Item 2Something else

If you need to put more than one line in the definition list, please use _ (underscore) at the end of the line you want to break (after one space). Remember not to insert any character after the underscore.

: Item 1 : Something _another line: Item 2 : Something else

Item 1Somethinganother line

Item 2Something else

Block QuotesYou can mark a blockquote by starting a line with one or more '>' characters, followed by a space and the text to be quoted.

This is normal text here.

> Indent me! The quick brown fox jumps over the lazy dog. \Now this the time for all good men to come to the aid of \their country. Notice how we can continue the block-quote \in the same "paragraph" by using a backslash at the end of \the line.>

> Another block, leading to...>> Second level of indenting. This second is indented even \more than the previous one.

Back to normal text.

This is normal text here.


9 of 30 1/2/2013 12:15 PM

Indent me! The quick brown fox jumps over the lazy dog. Now this the time for all good men to come to the aid of their country. Notice how we can continue the block-quoteAnother block, leading to

Second level of indenting. This second is indented even more than the previous one.

Back to normal text.

Collapsible blocks+ explain collapsible blocks

LinksInternal linksUnlike some other wiki engines Wikidot.com does not process SquashedAndCapitalized words as page links. Instead any link should be marked with 3 nesting square brackets.

If a page address contains disallowed characters the address will be "unixified" to contain only allowed chars. The displayed name however will maintain original form.

what you type what you get

[[[link-to-a-page]]] link-to-a-page[[[link "TO" pagE]]] link "TO" pagE[[[category: sample page]]] sample page[[[some page| custom text]]] custom text[[[doc|Documentation]]] Documentation[[[some page|]]] some-page[[[doc#toc1|Section 1]]] Section 1[[[doc#toc1]]] doc

URLs


[[[http://www.wikidot.com | Wikidot]]] Wikidot named link (custom anchor)


10 of 30 1/2/2013 12:15 PM

[[[*http://www.wikidot.com | Wikidot]]] Wikidot named link (custom anchor), opene

[[[/category:page/option1/option2 | link text]]] link text

You can create shorter links to yourparameters without writing whole hE.g. you can use[[[/blog:post/edit/true | einstead of[[[http://site.wikidot.com/

http://www.wikidot.com http://www.wikidot.com simple inline link

[http://www.wikidot.com wikidot] wikidot named link (custom anchor)*http://www.wikidot.com[*http://www.wikidot.com wikidot]

http://www.wikidot.comwikidot

opens in a new window

[# empty link] empty link link with href="javascript:;"

[/category:page/option1/option2 link text] link text

You can create shorter links to yourparameters without writing whole hE.g. you can use[/blog:post/edit/true edit this post]instead of[http://site.wikidot.com/ blog:post

AnchorsTo place an anchor use [[# anchor-name]] syntax. To refer to an anchor (and scroll to it) use [#anchor-name text to display].

Emails


[email protected] [email protected]

[[email protected] email me!] email me!

Although we discourage anyone from putting his/her email address on the web, Wikidot engine provides a simple scrambling mechanism to prevent automated bots from reading emails. Each email is scr

InterWikiTo link directly to a Wikipedia article you can use a syntax:

what you type

[wikipedia:Albert_Einstein]


11 of 30 1/2/2013 12:15 PM

[wikipedia:Albert_Einstein Albert]

[wikipedia:it:Albert_Einstein Albert]

Other links defined by example:

[google:free+wiki] - search google for the "free wiki" term[dictionary:wiki] - look up definitions of the word wiki from dictionary.reference.com

Magic URIsMagic URIs (or Magic Links) are the way to control pages within the URL address.


[http://site-name.wikidot.com/page-name#_editpage Edit] Edit Goes to the page with the edit mode alr[http://site-name.wikidot.com/page-name/title/whatever Edit with title] Edit with title set Works only with not existing pages. Wh[http://site-name.wikidot.com/page-name/parentPage/parent-page-name Edit with parent page set] Edit with parent page set Works only with not existing pages. Wh[http://site-name.wikidot.com/page-name/noredirect/true Page without redirect] Page without redirect Turning off redirection, if the [http://site-name.wikidot.com/page-name/tags/tag1,tag2 Set tags] Set tags Sets tags on the page via URL, comma-d[http://site-name.wikidot.com/page-name/norender/true No Render] No Render Goes to the page, but does not render it

Hash Magic URIshttp://site-name.wikidot.com/page-name#_option


#_wantedpages lists Wanted Pages

#_orphanedpages lists Orphaned Pages

#_draftpages lists Draft Pages on site

#_editpage opens Editor

#_edittags opens Tag Editor

#_history displays History

#_files lists Files attached to the page

#_sitetools opens Site Tools


12 of 30 1/2/2013 12:15 PM

ImagesSingle imagesTo insert an image into the page use the following syntax:

[[image image-source attribute1="value1" attribute2="value2" ...]]

And here is the list of allowed attributes:

attributename

allowed values example value

link wiki page name or URL

"wiki-page""http://www.example.com""#anchor""#"

makes image a link to another page or web address; this is actions when image is clicked

alt any string "a photo of me" Text substitution when image not available. It is also used by screen read

title any string "a photo of me" Displays mouse-over text for the image.

width number of pixels "200px" forces width of a image when displaying

height number of pixels "200px" forces height of a image when displaying

style valid CSS style definition"border: 1px solid red; padding: 2em;" adds extra CSS style to the image

class CSS class "mystyle" forces the image CSS class - suggested use only with customized themes

size

"square" - 75x75 pixels"thumbnail" - 100 on longest side"small" - 240 on longest side"medium" - 500 on longest side"medium640" - 640 on longest side (Flickr only)"large" - 1024 on longest side (only for Flickr largeimages)"original" - original image (Flickr only)

any of allowed ;-)

displays a resized image; great for thumbnails(transparency is lost and clicking the thumbnail opens the original imagif flickr is the source it pulls required size from a Flickr server;this option has effect only on local images or Flickr images

size attribute works very well with local files (attached to pages) not only with image files, but with e.g. PDF or PostScript. See this page for more details.

The image-source can be one of the following:

source type format example value


13 of 30 1/2/2013 12:15 PM

URL address any valid URL address http://www.example.com/image.jpg displays image from the web addressfile attachment (current page) filename exampleimage.jpg displays image attached to the current page:first :first :first displays first image attached to the current p

file attachment (different page) /another-page-name/filename /another-page/exampleimage.jpg displays image attached to a different pageflickr image flickr:photoid flickr:83001279 displays image from Flickr and links to the o

flickr image (private) flickr:photoid_secret flickr:149666562_debab08866 displays image from Flickr and links to the o

To make the linked document in a new window you can either prepend the link attribute with '*' (e.g. link="*http://www.example.com" or prepend the src element with '*' (e.g.

To choose horizontal alignment use:

[[=image - centered image[[image - image on right[[fimage - image on right floating (surrounded by text)

Gallery of imagesTo insert a series of images into a page content use the [[gallery]] element:

[[gallery size="image-size"]]

or

[[gallery size="image-size"]]: image-source1 attribute1="value1" attribute2="value2" ...: image-source2 attribute1="value1" attribute2="value2" ......

[[/gallery]]

The allowed attributes within the [[gallery]] tag are:

attribute allowed values default

size "square", "thumbnail", "small", "medium" "thumbnail"

order "name", "name desc", "created_at", "created_at desc" "name"


14 of 30 1/2/2013 12:15 PM

viewer "false", "no", "true", "yes" "yes"

Order parameter also takes the following deprecated values: "nameDesc", "dateAddedDesc" and "dateAdded". For consistency with ListPages module it also takes the following values:

If the [[gallery]] tag is invoked without a list of images it automatically displays rescaled images (thumbnails) of image files attached to the current page (without .pdf and .ps document

If [[gallery]] is invoked with a list of images, only these images are displayed. image-source must not be a URL in this case. Allowed "per-image attributes are:

link - URL or wiki page name (does not work with Flickr images to be o.k. with Flickr terms)alt - alternative text when the image is not available

To make a document open in a new window the same rules as with a single image applies.

The gallery by default is using LightBox to view images. It means that if you click on an image in the gallery, a very nice looking pop-up will show up with a possibility to scroll images forward / backward w

[[gallery viewer="no"]] or [[gallery viewer="false"]]

Also see FlickrGallery module if you wish to import images from Flickr.

Put the [[gallery]] tag on its own line or the parser will not recognize it.

NotesCreate notes on a page using [[note]] [[/note]] tags (each on its own line).

This is an example note:

For more information, please contact:

HTML BlocksCreate HTML blocks by using [[html]] [[/html]] tags (each on its own line). HTML block is a Code Block inserted in the IFRAME. It makes HTML - scripting much easier.

[[html]]Custom HTMLSomething else

[[/html]]

All wiki syntax inside a html block is treated as literal text and not processed.


15 of 30 1/2/2013 12:15 PM

You can apply styles (both by means of and ) to elements, but styling html and body (that are added transparently to your content if needed) is not sstyle, for example:

[[html]]

This is a test.

[[/html]]

This renders the whole HTML block black with text color light green:

This is a test.

Each HTML block on a page has a unique URL that lets you access it individually. You can do it by right clicking on the HTML block element on the rendered page and choose "Show only this frame" and c

Code BlocksCreate code blocks by using [[code]][[/code]] tags (each on its own line).

This is an example code block!

All wiki syntax inside a code block except [[include]] tags is treated as literal text and not processed. To prevent an include tag from being processed, put a single space in front of it.

Each code block on a page has a unique URL that lets you access it individually. This is especially useful for code blocks that contain CSS code (type = "css"):

http://mysite.wikidot.com/category:page/codehttp://mysite.wikidot.com/category:page/code/2 -- second block

This way you can extract code blocks defined in the page source itself, without taking any _template into account. To access code blocks form page source combined with _template, use the following URL

http://mysite.wikidot.com/category:page/code_http://mysite.wikidot.com/category:page/code_/2 -- second block

To create PHP blocks that get automatically colorized when you use PHP tags, simply surround the code with [[code type="php"]][[/code]] tags).

To get PHP code colorized you should surround it with .

Wikidot.com uses PEAR::Text_Highlighter and supports a number of color schemes. Here is what is supported (allowed type values):


16 of 30 1/2/2013 12:15 PM

[[code type="php"]]

[[/code]]

||~ head 1 ||~ head 2 ||~ head 3 |||| cell 1 || cell 2 || cell 3 |||||| long cell 4 || cell 5 ||||cell 6 |||| long cell 7 |||||||| looong cell 8||

php, html, cpp, css, diff, dtd, java, javascript, perl, python, ruby, xml.

TablesSimple tablesYou can create simple tables using pairs of vertical bars:

|| lines must start and end || with double vertical bars || nothing |||| cells are separated by || double vertical bars || nothing |||||| you can span multiple columns by || starting each cell |||| with extra cell |||| separators |||||||| but perhaps an example is _the easiest way to see ||

lines must start and end with double vertical bars

cells are separated by double vertical bars

you can span multiple columns by

with extra cell separators

but perhaps an example is


17 of 30 1/2/2013 12:15 PM

the easiest way to see

For a new line inside the table cell use _ (underscore) at the end of the line (see the example above).

Advanced (custom) tablesTo create more advanced tables, special tags can be used that can accept class and style attributes for managing appearance. To create an advanced table use the following syntax:

[[table]][[row]][[cell style="border: 1px solid silver; background-color: yellow;"]]cell 0.0[[/cell]][[cell style="border: 1px solid silver"]]cell 0.1[[/cell]][[/row]][[row]][[cell style="border: 1px solid silver"]]cell 1.0[[/cell]][[cell style="border: 1px solid silver; background-color: yellow;"]]cell 1.1[[/cell]][[/row]][[/table]]

transforms to

cell 0.0 cell 0.1

cell 1.0 cell 1.1

Each of elements [[table]], [[row]] and [[cell]] can accept attributes style and class and they are transformed to (X)HTML tags: , and .

If you wish to remove the spacing between cells in the above example, change the first line to [[table style="border-collapse:collapse;"]].

An example of using tables for page layout can be found on our Snippets Wiki at: http://snippets.wikidot.com/code:layout-with-tables .

Tables can be nested.

Block formatting elements


18 of 30 1/2/2013 12:15 PM

[[=]]Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\Aenean a libero. Vestibulum adipiscing, felis ac faucibus \imperdiet, erat lacus accumsan neque, vitae nonummy lorem \pede ac elit.

Maecenas in urna. Curabitur hendrerit risus vitae ligula.[[/=]]

Lorem ipsum dolor sit ame

= Centered line

Left, right, centered and justifiedTo apply horizontal alignment to a block of text use:

[[]]align right

[[=]]

[[/=]]align center

[[==]]

[[/==]]align justified

E.g.

To center a single line use = at the beginning:

Note: The block formatting tags must be on their own line with nothing after them, not even a space. For example, [[=]] and [[/=]] must be immediately followed by the return character (press Enter).

Custom div blocksTo improve the layout you can use [[div]] ... [[/div]] elements which transform to html ... blocks.Allowed attributes are: class and style only but this should be more than enough to create desired layout.


19 of 30 1/2/2013 12:15 PM

left column left column left column left column left column left column left column left column left column left column right column right colum

[[div]] blocks can be nested. Put the [[div]] and [[/div]] tags on their own lines or the parser will not recognize them.

Below is an example how to create a 2-column layout using div block:

[[div style="float:left; width: 45%; padding: 0 2%"]]left column left column left column left column left columnleft column left column left column left column left column[[/div]][[div style="float:left; width: 45%; padding: 0 2%"]]right column right column right column right column right columnright column right column right column right column right column[[/div]]

~~~~

The ~~~~ element is used to clear floats and translates more or less to ).

Custom [[div]] blocks can be used to create very advanced page layouts.

MathWikidot.com uses MathJax to render beautiful LaTeX equations. For those that know LaTeX syntax using wikidot equations should be straightforward.

EquationsSimply put the equation between [[math label]] [[/math]] block tags (the label is optional). The equation is rendered within LaTex \begin{equation} ... \end{equation}

[[math label1]]\rho _{\rm GJ} = -\sigma (r) \left[ (1 - \eta _{\ast }^2 {\kappa \over {\eta ^3}}) \cos \chi \right.+ \left. {3\over 2} \theta (\eta) H(\eta)\xi \sin \chi \cos \phi \right][[/math]]

To refer to a labeled equation simply use [[eref label]] to get a raw number or e.g. Eq. ([[eref label1]]) which gives Eq. (1).

= (r)[(1 ) cos + GJ 2 3

3

2


20 of 30 1/2/2013 12:15 PM

[[$ E = mc^2 $]] is much more popular than[[$ G_{\mu\nu} - \Lambda g_{\mu\nu} = \kappa T_{\mu\nu} $]]

You can specify the LaTeX environment in 2 ways, either by passing a type="" parameter, or using \begin{} and @\end{}@@ within the equation. E.q

[[math type="align"]]E = mc^2[[/math]]

[[math]]\begin{align}E = mc^2\end{align}[[/math]]

The equation environment is default. Other supported math environments are: align, alignat, aligned, alignedat, array, Bmatrix, bmatrix, cases, eqnarray, equation

Inline mathTo use math expressions inside text (sentence) use [[$ ... $]] block tags.

FootnotesTo make footnotes in the text use [[footnote]] block. To force the list of footnotesto appear not at the end of the page, use [[footnoteblock]].

Some text[[footnote]]And a small footnote.[[/footnote]]. Here we gowith another footnote[[footnote]]Content of another footnote.[[/footnote]].

[[footnoteblock]]

Some text1. Here we go with another footnote2.

Footnotes

1. And a small footnote.2. Content of another footnote.

E =


21 of 30 1/2/2013 12:15 PM

If you are not satisfied with the default title ("Footnotes") you can force your own title by using [[footnoteblock title="Custom title"]] or even do not use title at all (title="").

BibliographyThe bibliography block is defined by [[bibliography]]...[[/bibliography]]. Each bibliography item has the form:label : full referenceTo cite a bibliography entry use ((bibcite label)).

The first pulsar was observed by J. Bell and A. Hewish [((bibcite bell))]. Another reference [see ((bibcite guy))].

[[bibliography]]: bell : Bell, J.; Hewish, A.; Pilkington, J. D. H.; Scott, P. F.; and Collins, R. A. //Observation of a Rapidly Pulsating Radio Source.// Nature 217, 7: guy : Guy, R. K. //Modular Difference Sets and Error Correcting Codes.// C10 in Unsolved Problems in Number Theory, 2nd ed. New York: Springer-Verlag[[/bibliography]]

The first pulsar was observed by J. Bell and A. Hewish [1]. Another reference [see 2].

Bibliography

1. Bell, J.; Hewish, A.; Pilkington, J. D. H.; Scott, P. F.; and Collins, R. A. Observation of a Rapidly Pulsating Radio Source. Nature 217, 709, 1968.2. Guy, R. K. Modular Difference Sets and Error Correcting Codes. C10 in Unsolved Problems in Number Theory, 2nd ed. New York: Springer-Verlag, pp. 118-121, 1994.

If you are not satisfied with the default title ("Bibliography") you can force your own title by using [[bibliography title="Custom title"]] or even do not use title at all (title=""

Date: How Long Ago?In several places (forum, private messages, last revision date, etc.) Wikidot pages use dates and timestamps that automatically calculate (either when hovering with the mouse or directly in the text) how lo

15 Mar 2009, 17:44 GMT+01 (move the mouse over the date to see the hovering text) or,Sunday, March 15, 2009 5:44:00 PM

If you want dates that you type on your pages to also automatically show "how long ago'', here is how you can do it.

How it worksThe syntax needed is:

[[date timestamp ]]


22 of 30 1/2/2013 12:15 PM

where

< > denote optional parameterstimestamp is the number of seconds between Jan 1, 1970 and the wanted date. To find this number for a specific date, see Code Wizard below.format is an arbitrary text string that may include %modifiers, which are replaced by an actual (part of the) date or time. If not specified, format defaults to "%e''.|agohover when specified displays a "hovering'' text ("nn seconds/minutes/hours/days ago") when the mouse is moved over any part of the displayed format string.

Code WizardTo find out what code you should use on your page for a specific date:

select the required date and time, 2 2013 12 : 09

and type any format string %e %b %Y, %H:%M %Z|agohover

What you type What you get

[[date 1357124940 format="%e %b %Y, %H:%M %Z|agohover"]] 2 Jan 2013, 12:09 GMT+01

Then copy/paste the displayed code into your page.

Examples

What you type What you get

[[date 1216153821]] Tuesday, July 15, 2008 10:30:21 PM[[date 1216153821 format="%d. %m. %Y|agohover"]] 15. 07. 2008[[date 681746400 format="James is %O young"]] James is 7816 days young

+++ Minutes from [[date 1234567890 format="%e %B|agohover"]] Minutes from 14 February

Note: You can use %O also with the future dates as well.

LimitationsNote that currently:

dates before Jan 1, 1970 are not rendered at all

Author


23 of 30 1/2/2013 12:15 PM

created by ErichSteinboeck

Include other pagesIf you want to include contents of another page use:

[[include pagename]]

or

[[include :sitename:pagename]]

The include tag should start and end with a newline. [[include]] tags are parsed inside code blocks. To prevent an [[include]] tag from being parsed, put a space in front of it. This does make copy/paste of

The sitename can be a Wikidot subdomain (e.g. :www) or a full name, including a custom domain.

The [[include]] tag can also take parameters and substitute variables in the included source. To denote variables in the included page use:

{$var1}, {$number_books}, {$title}, {$variable_name}, {$variableName}

and in the including page use:

[[include pagename var1=value1 | number_books = 43 | title=Best Wiki Ever | variable_name = just a variable | variableName = another variable ]]

As you can see you can split variable definitions over several lines for cleaner code.

NOTE: includes and images/files: The [[include]] works just by inserting the page source at a given place. If you have any images or files attached in the included page and you refer to them as page/filename.jpg]]

Includes across sites are called cross-site includes or CSIs. CSIs are a powerful way to link page templates and code from other sites.

Embedding mediaVideo


24 of 30 1/2/2013 12:15 PM

To embed video directly into the page use [[embedvideo]] ... [[/embedvideo]] block.Between the the "embedding html code" should be placed from any of the following video online galleries:

Google VideoYouTube

E.g.

[[embedvideo]] [[/embedvideo]]

AudioTo embed audio use [[embedaudio]] ... [[/embedaudio]] and the html embedding code found on the audio hosting website.

Currently supported are:

Odeo.com

E.g.

[[embedaudio]]

The [[embed]] block tag allows you to do the same with your wiki pages. E.g. to display del.icio.us tag cloud as generated from http://del.icio.us/help/tagrolls simply wrap the html code:

[[embed]]

This page is labeled as: science.

Click here to view more science articles >[[/iftags]]

[[iftags +bug -fixed]]This is a bug, but it's not fixed yet.[[/iftags]]

ModulesModules are independent widgets that can be placed in the pages. The general syntax is:[[module ModuleName param1="value1" param2="value2" ...]]

To read more about modules see the modules section of the documentation.

Attached fileswhat you type

[[file filename | custom-text]] produces a link to a file attached to this page.custom-text changes the name of a link (

[[file /another-page/filename | custom-text]] produces a link to a file attached to

The destination file must be first attached to the page by clicking "files" and "upload file" from the options at the bottom of any page. Do not use a leading slash on filenames, unless you really mean tha

Userswhat you type what you get

[[user user-name]]e.g. [[user michal frackowiak]] michal frackowiak

[[*user user-name]]e.g. [[*user michal frackowiak]]

michal

frackowiak

Social bookmarkingIt is easy to add "social bookmarking" buttons to your pages just write [[social]] (without any parameters) and get:


27 of 30 1/2/2013 12:15 PM

This is equivalent to:

[[social blinklist,blogmarks,connotea,del.icio.us,digg,fark,feedmelinks,furl,linkagogo,newsvine,netvouz,reddit,simpy,spurl,wists,yahoomyweb,facebook]]

You can also choose only selected services, e.g. to choose digg, furl and del.icio.us use:

[[social digg,furl,del.icio.us,facebook]]

and get:

Tip: Use social bookmarking! It is always a good idea to put social shortcuts under an article or inside your side bar.

Standalone buttons for page optionsSometimes it might be convenient to hide the default page options and present only selected buttons to the users. The syntax for accomplishing this is:

[[button type options]]

Where the type is: edit, edit-append, edit-sections, history, print, files, tags, source (view page source), backlinks, talk (works similar as in MediaWiki/Wikipedia),

Possible attributes are:

text alternative text to be displayedclass CSS class of the A elementstyle CSS style definition

For some nice "view source" and "print" buttons with icons you can use the following code:

[[>]][[button source style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-positi[[button print style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-posi[[/>]]

to get:


28 of 30 1/2/2013 12:15 PM

Button for tag updateYou can use [[button set-tags text=""]] to change page tags easily.

is one or more of the following (separated by space):

+tag will add a tag to the page if not already present-tag will remove a tag from the page if present-* will remove all the visible tags from the page (those not starting from "_")

-_* will remove all the hidden tags from the page (those starting from "_")

The action will happen when user clicks on the button and has permissions to edit the page. The page will reload afterwards (this is useful if you have some iftags constructions on the page).

Any tag removal will happen before tag addition.

Examples:

code

[[button set-tags +tag1 -tag2 text="Change tags"]] adds tag tag1

[[button set-tags +favorite +_book -_movie text="Change tags"]] add tags favorite

[[button set-tags +favorite -* text="Change tags"]] add tags favorite

[[button set-tags -* -_* text="Change tags"]] clears all the tags[[button set-tags -* +favorite +_book text="Change tags"]] adds tag favorite, removes other visi

Class and style attributes work like for standalone buttons for page actions.

Layout elementsTab viewTab view is a container that creates some clickable tabs that allow to switch between content to show.

NOTE: TabView breaks TOCs, anchor links and back button

you can't link to anchor inside of a tabTOC won't link properly to any header inside of a tabif you click a link from within a tab and go back, you will be always shown the first tab

To generate a tabview, i.e. a set of tabs, the following syntax can be used:


29 of 30 1/2/2013 12:15 PM

[[tabview]][[tab Title of Tab No. 1]]Content of Tab No. 1.[[/tab]][[tab Title of Tab No. 2]]Content of Tab No. 2.[[/tab]][[tab Title of Tab No. 3]]Content of Tab No. 3.[[/tab]][[/tabview]]

This will produce the following tabset:

Tabs will accept any content, but at the moment it is not possible to nest tabviews.

Another example of tabview can be found at our Snippets Wiki at http://snippets.wikidot.com/code:tabs

Unless stated otherwise Content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License

Title of Tab No. 1 Title of Tab No. 2 Title of Tab No. 3

Content of Tab No. 1.


30 of 30 1/2/2013 12:15 PM