Loading...
 
Skip to main content

History: Wiki Syntax

Source of version: 43 (current)

Copy to clipboard
            ! Wiki Syntax
{DIV(class="lead")}Tiki Wiki CMS Groupware has a rich and flexible system for formatting and presenting pages. This page describes how to format text, using wiki syntax, on wiki pages and other area that support ((Wiki|wiki)) formatting (including articles, forums, and blogs).{DIV}
!! About wiki syntax
Wiki syntax is a markup language used in a wiki web page. (For a broader overview of wiki syntax, please see [https://tiki.org/Why-Wiki-Syntax-Is-Important|Why Wiki Syntax Is Important].) To avoid requiring users to learn HTML, wiki syntax uses common characters in uncommon ways (or character combinations that are not normally used together) and provides them with a special meaning. Some of the character combinations only work at the beginning of a line, while others can be inserted anywhere in the text and are active until a closing combination of characters is met. 

Wiki syntax uses a character repeated twice for most functions, but it also has a few two-character combinations. With a two-character combination, the characters are reversed to turn off the function. Monospaced text provides a good example of this; the minus (-) and plus (+) characters are used to start the using monospaced text and plus (+) and minus (-) characters specify the end of it. 

!!! Quick reference - basic text formatting
{FANCYTABLE(head=>Desired Formatting ~|~ Syntax ~|~ Result or description )}
Bold ~|~ ~np~__text__~/np~ ~|~{HTML()}<b>text</b>{HTML}
Centered ~|~ ~np~::text::~/np~ ~|~ ::text::
Colored Text ~|~~np~~~blue:text~~~/np~ ~|~ ~~blue:text~~
Italic ~|~ ~np~''text''~/np~ ~|~ ''text''
Monospaced ~|~ ~np~-+text+-~/np~ ~|~ -+text+-
Underlined ~|~ ~np~===text===~/np~ ~|~ ===text===
Text in a box ~|~ ~np~^text^~/np~ ~|~ ^text^
Display syntax ~|~ ~126~~110~~112~~126~~np~__not bold__~/np~~126~~47~~110~~112~~126~ ~|~ ~126~~110~~112~~126~~np~__not bold__~/np~~126~~47~~110~~112~~126~
Headings ~|~ !Heading 1 %%% !!Heading 2 %%% !!!Heading 3 ~|~ {HTML()}<h1>Heading 1</h1><h2>Heading 2</h2><h3>Heading 3</h3>{HTML}
Show/Hide sections ~|~ !+, !!- ~|~ (Headings display with plus or minus sign in brackets which, when clicked, show or hide the content following the heading.)
Autonumbered Headings ~|~ !#, !!#, !+#, !-# ... ~|~ (Headings display numbered in outline format.)
Table of contents ~|~ ~np~{toc}~/np~, ~np~{maketoc}~/np~ ~|~ These create a table of contents for the current page based on structures (toc) or  headings (maketoc). 
Dynamic variables ~|~ %Name% ~|~ Inserts an editable variable. See ((Dynamic Variable)).
External links ~|~ ~np~[http://example.com]~/np~ %%% ~np~[http://example.com|example.com]~/np~ ~|~ [http://example.com] %%% [http://example.com|example.com]
Square brackets ~|~  ~np~[[foo]~/np~ ~|~ [[foo]
Wiki references/links ~|~ ~np~((Homepage))~/np~ %%% ~np~((Homepage|the homepage)) ~/np~ ~|~ ((Homepage)) %%% ((Homepage|the homepage))
Lists ~|~ * at the left margin for bullet lists %%% # for numbered lists %%% ;Word:definition for definiton lists ~|~ (Use * or # or ; and : at the left margin - in left-to-right languages - to create lists.)
Indentation ~|~ + or ++ at the left margin ~|~ (Creates an indent for each plus character, useful in a list to place following text at the same indent level as the list item.)
Table ~|~ ~np~|| row1-col1 | row1-col2 | row1-col3 (here you need a physical carriage returns)
row2-col1 | row2-col2 | row2-col3 || ~/np~ ~|~ {HTML()}<table class="table"><tr><td> row1-col1 </td><td> row1-col2 </td><td> row1-col3 </td></tr><tr><td> row2-col1 </td><td> row2-col2 </td><td> row2-col3 </td></tr></table>{HTML}
Title bar ~|~ ~np~-=Title=-~/np~ ~|~ -=Title=-
Line break ~|~ ~np~Linebreak "%%%" (useful especially in tables)~/np~ ~|~  Linebreak %%% (useful especially in tables) 
Multi-page pages ~|~  ~np~...page...~/np~ ~|~ (Use ~np~...page...~/np~ to separate one wiki page's content into separate paginated pages.) 
Preformated sections ~|~ ~np~ ~pp~ data ~/pp~ ~/np~ %%% ~np~ ~pre~ data ~/pre~ ~/np~ ~|~  ~pp~ data ~/pp~ %%%(Displays preformated text/code; no Wiki processing is done inside these sections (as with np), and the spacing is fixed - no word wrapping is done.) %%% ~pre~ data ~/pre~ %%% (~np~ ~pre~ ~/np~ also displayes preformatted text with fixed spacing, but wiki processing still occurs on the text.)
Direction ~|~ ~np~ {r2l}, {l2r}, {rm}, {lm}~/np~ ~|~ Insert to create a right-to-left and left-to-right text direction HTML DIV (up to the end of text) and markers for langages as Arabic and Hebrew. See ((i18n Admin)).
Special characters ~|~ ~np~ ~hs~ ~/np~ %%% ~np~ ~c~ ~/np~ %%% ~np~  ~amp~ ~/np~ %%% ~np~  ~lt~ ~/np~ %%%  ~np~ ~gt~ ~/np~ %%%  ~np~ ~ldq~ ~/np~ %%% ~np~ ~rdq~ ~/np~ %%% ~np~ ~lsq~ ~/np~ %%% ~np~ ~rsq~ ~/np~ %%% ~np~ 	~--~ ~/np~ %%% ~np~ ~bs~ ~/np~ ~|~ hard space %%%  © %%% & %%% < %%% > %%% “ %%%  ” %%% ‘ %%% ’ %%% — %%%  \, numeric between ~ for HTML numeric characters entity {FANCYTABLE}
!!! Basic text formatting
The wiki syntax described in this section can be located anywhere in the text so that specific characters, words, or sentences can be emphasized.

!!! Colored text
Text can be any color you want it to be. Two tildes ( ~ ) are used followed by the name of a color and a colon ( : ) to specify the start of the colored text. Two more tildes ( ~ ) are used to end the section of colored text. 

^ Example: ~np~~~red:This is text is red.~~~/np~ produces:
~~red:This is text is red.~~ ^

Colored text can also be specified using HTML hex color codes. (See [https://en.wikipedia.org/wiki/Web_colors]). The syntax is two tildes ( ~ ) followed by the pound ( # ) character and the hex numbers with a colon ( : ) followed by the text to be colored. Two tildes mark the end of the colored text. 

^ Example: ~np~~~#ff00ff:This is text is the color Magenta. ~~~/np~ produces:
~~#ff00ff:This is text is the color Magenta. ~~ ^

!!! Bold text
Two underscore ( _ ) characters are used to make text bold.

^Example: -+~np~__This text is bold__~/np~+- produces: 
__This text is bold__^

!!! Italic text
Two single quote ( ' ) characters are used to make text italic.

^Example: ~np~''This text is italic.''~/np~ produces: 
''This text is italic.''^

!!! Underlined text
Three equal ( = ) characters are used to underline text. 

^Example: ~np~===This text is underlined.===~/np~ produces: 
===This text is underlined.===^

!!!Strikethrough text

Use two hyphens ( - ) to create strike-through text.

^Example: %%% __~np~--This is strikethrough text.--~/np~__ %%% produces: %%% --This is strikethrough text.--^

!!! Centered text
Two colon ( : ) characters are used to center text or other content. The centered-text syntax (which create a centered HTML div) can be used in conjunction with a box, a table, or other page element. 

^Example: ~np~::This text is centered.::~/np~ produces: 
::This text is centered.::^

!!! Monospace text
Monospace text is useful when displaying code and can be created in two ways. When an entire line is to be monospace, simply start the new line with one or more spaces. For instances of monospace text within a line of normal text, use a combination of minus (-) and plus (+) characters before and (reversing their poisitions) after the monospace text.

^Example: ~np~-+This Text uses a Monospaced Font+-~/np~ produces: 
 -+This is monospace text.+- ^
{icon name="exclamation_point"} When using monospace text, keep the line length short. If the line is too long, it may cause page display problems.
{icon name="exclamation_point"} Leading-space monospace text is an option and may be disabled on the Tiki site.

!!! Text box
Apply one caret at start and end of text or other content to display it with a border (in a box). 

Example: ~np~^This text is in a box.^~/np~ produces: 

^This text is in a box.^

Technical note: The box is an HTML div class="simplebox" (prior to Tiki 13) or "well" (Tiki 13 - 18) whose appearance  depends on the theme stylesheet in use. 

!!! Plain text
To turn off wiki formatting, surround the text with "np" (or "no processing/parsing") tags. 

^Example: ~126~~110~~112~~126~~np~This ''text'' is __not__ being ===formatted===~/np~~126~~47~~110~~112~~126~ 

produces: 

~np~This ''text'' is __not__ being ===formatted===~/np~^

NOTE: np tags cannot be used within an np block. To display an unprocessed ~126~~110~~112~~126~ tag, escape all the characters (not just the tildes) while in normal processing mode:

~126~126~126~~126~110~126~~126~112~126~~126~126~126~ produces: ~126~~110~~112~~126~
~126~126~126~~126~47~126~~126~110~126~~126~112~126~~126~126~126~ produces: ~126~~47~~110~~112~~126~

!!! Indent
(Prior to Tiki 13) Text can be indented using HTML definition list formatting, which in wiki syntax is created using a combination of the ; and : characters.  ; must appear at the beginning of a line and : must appear between introduction text and the indented text.  The introduction text portion is useful for forming definition type indention like Example 1 below.  However the introduction text can be eliminated by simply including ;: together followed by the text as shown in Example 2.

^Example 1:
~np~;Intro Text: First example of indented text~/np~ 
produces:
;Intro Text: Indented text
Example 2:
~np~;:2nd example of indented text~/np~
;:2nd example of indented text^

!! Using square brackets
To include square brackets in text (that is, as regular text and not to create an external link, which square brackets normally do in wiki syntax) simply add an additional opening bracket at the beginning.

^Example:
~np~[[This displays as text in square brackets, not as a link.]~/np~ 

produces

[[This displays as text in square brackets, not as a link.] ^ 

!! Non-breaking space
Use ~np~ ~hs~ ~/np~ to add the HTML " " for a hard space, or non-breaking space.

!!Comments
!!!Wiki comment
;~np~ ~tc~This is a wiki comment. ~/tc~ ~/np~:  It will be stored with the page and can be seen in the edit-page view but not seen when the page or page source is viewed.
!!! HTML Comment
;~np~ ~hc~ This is an HTML comment. ~/hc~ ~/np~:  It will be stored with the page and will generate an HTML comment of the form ^~np~<!-- This is an HTML comment. -->~/np~^ it will not be seen when the page is viewed but will be seen when the page source is viewed.

!!Wiki Syntax in Smarty Templates
To use wiki syntax in smarty templates use the follwoing:
{CODE()}
{wiki}
    ! Headline
    Put your wiki syntax here.
{/wiki}
{CODE}

!! Related pages
((Wiki-Syntax Images))
((Wiki-Syntax Links))
((Wiki-Syntax Lists))
((Wiki-Syntax Special Characters))
((Wiki-Syntax Tables))
((Wiki Argument Variables))
((Advanced Wiki Syntax usage examples))
((Plugins)) advanced features/formatting that can be included in wiki pages

!! Useful Links
*((tw:Why Wiki Syntax is Important))
* The Color Picker II is located at [http://www.pagetutor.com/pagetutor/makapage/picker/]
* [https://addons.mozilla.org/extensions/moreinfo.php?id=60|Web Developer extension] for [http://www.mozilla-europe.org/fr/products/firefox/|Mozilla Firefox]
* Wiki syntax is not standardised across applications. There has been an initiative to publish wiki syntax as an RFC from the [http://www.ietf.org/|IETF]. See [https://tiki.org/RFCWiki|RFCWiki].