Yioop - Public[Feed|Wiki]

Yioop Wiki Syntax

Wiki syntax is a lightweight way to markup a text document so that it can be formatted and drawn nicely by Yioop. This page briefly describes the wiki syntax supported by Yioop.


In wiki syntax headings of documents and sections are written as follows:
and would look like:







In Yioop two new lines indicates a new paragraph. You can control the indent of a paragraph by putting colons followed by a space in front of it:
: some indent

:: a little more

::: even more

:::: that's sorta crazy
which looks like:
  some indent
  a little more
  even more
  that's sorta crazy

Horizontal Rule

Sometimes it is convenient to separate paragraphs or sections with a horizontal rule. This can be done by placing four hyphens on a line by themselves:
This results in a line that looks like:

Text Formatting Within Paragraphs

Within a paragraph it is often convenient to make some text bold, italics, underlined, etc. Below is a quick summary of how to do this:

Wiki Markup

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


Yioop also supports several html tags such as:
<s>strike through</s> or
<strike>strike through</strike> 
strike through
<sup>superscript</sup> and
superscript and subscript

Spacing within Paragraphs

The HTML entity
can be used to create a non-breaking space. The tag
can be used to produce a line break.

Preformatted Text and Unformatted Text

You can force text to be formatted as you typed it rather than using the layout mechanism of the browser using the
<pre>preformatted text tag.</pre>
Alternatively, a sequence of lines all beginning with a space character will also be treated as preformatted.
Wiki markup within pre tags is still parsed by Yioop. If you would like to add text that is not parsed, enclosed it in `<`nowiki> `<`/nowiki> tags.

Styling Text Paragraphs

Yioop wiki syntax offers a number of templates for control the styles, and alignment of text for a paragraph or group of paragraphs:
`{{`left| some text`}}`,
`{{`right| some text`}}`,
`{{`center| some text`}}`
can be used to left-justify, right-justify, and center a block of text. For example, the last command, would produce: {{center| some text }} If you know cascading style sheets (CSS), you can set a class or id selector for a block of text using:
`{{`class="my-class-selector" some text`}}`
`{{`id="my-id-selector" some text`}}`.
You can also apply inline styles to a block of text using the syntax:
`{{`style="inline styles" some text`}}`.
For example, `{{`style="color:red" some text`}}` looks like {{style="color:red" some text}}.


The Yioop Wiki Syntax supported of ways of listing items: bulleted/unordered list, numbered/ordered lists, and definition lists. Below are some examples:

Unordered Lists

* Item1
** SubItem1
** SubItem2
*** SubSubItem1
* Item 2
* Item 3
would be drawn as:
  • Item1
    • SubItem1
    • SubItem2
      • SubSubItem1
  • Item 2
  • Item 3

Ordered Lists

# Item1
## SubItem1
## SubItem2
### SubSubItem1
# Item 2
# Item 3
  1. Item1
    1. SubItem1
    2. SubItem2
      1. SubSubItem1
  2. Item 2
  3. Item 3

Mixed Lists

# Item1
#* SubItem1
#* SubItem2
#*# SubSubItem1
# Item 2
# Item 3
  1. Item1
    • SubItem1
    • SubItem2
      1. SubSubItem1
  2. Item 2
  3. Item 3

Definition Lists

;Term 1: Definition of Term 1
;Term 2: Definition of Term 2
Term 1
Definition of Term 1
Term 2
Definition of Term 2


A table begins with {`|` and ends with `|`}. Cells are separated with | and rows are separated with |- as can be seen in the following example:
a b
c d
Headings for columns and rows can be made by using an exclamation point, !, rather than a vertical bar |. For example,
a b
c d
Captions can be added using the + symbol:
|+ My Caption
My Caption
a b
c d
Finally, you can put a CSS class or style attributes (or both) on the first line of the table to further control how it looks:
{| class="wikitable"
|+ My Caption
My Caption
a b
c d
Within a cell attributes like align, valign, styles, and class can be used. For example,
| style="text-align:right;"| a| b
| lalala | lalala
a b
lalala lalala


Math can be included into a wiki document by either using the math tag:
\sum_{i=1}^{n} i = frac{(n+1)(n)}{2}
` \sum_{i=1}^{n} i = frac{(n+1)(n)}{2} `

Adding Resources to a Page

Yioop wiki syntax supports adding search bars, audio, images, and video to a page. The magnifying class edit tool icon can be used to add a search bar via the GUI. This can also be added by hand with the syntax:
{{search:default|size:small|placeholder:Search Placeholder Text}}
This syntax is split into three parts each separated by a vertical bar |. The first part search:default means results from searches should come from the default search index. You can replace default with the timestamp of a specific index or mix if you do not want to use the default. The second group size:small indicates the size of the search bar to be drawn. Choices of size are small, medium, and large. Finally, placeholder:Search Placeholder Text indicates the grayed out background text in the search input before typing is done should read: Search Placeholder Text. Here is what the above code outputs:
{{search:default|size:small|placeholder:Search Placeholder Text}}
Image, video and other media resources can be associated with a page by dragging and dropping them in the edit textarea or by clicking on the link click to select link in the gray box below the textarea. This would add wiki code such as
( (resource:myphoto.jpg|Resource Description))
to the page. Only saving the page will save this code and upload the resource to the server. In the above myphoto.jpg is the resource that will be inserted and Resource Description is the alternative text to use in case the viewing browser cannot display jpg files. A list of media that have already been associated with a page appears under the Page Resource heading below the textarea. This table allows the user to rename and delete resources as well as insert the same resource at multiple locations within the same document. To add a resource from a different wiki page belonging to the same group to the current wiki page one can use a syntax like:
( (resource:Documentation:ConfigureScreenForm1.png|The work directory form)) 
Here Documentation would be the page and ConfigureScreenForm1.png the resource.

Page Settings, Page Type

In edit mode for a wiki page, next to the page name, is a link [Settings]. Clicking this link expands a form which can be used to control global settings for a wiki page. This form contains a drop down for the page type, another drop down for the type of border for the page in non-logged in mode, a checkbox for whether a table of contents should be auto-generated from level 2 and level three headings and then text fields or areas for the page title, author, meta robots, and page description. Beneath this one can specify another wiki page to be used as a header for this page and also specify another wiki page to be used as a footer for this page.
The contents of the page title is displayed in the browser title when the wiki page is accessed with the Activity Panel collapsed or when not logged in. Similarly, in the collapsed or not logged in mode, if one looks as the HTML page source for the page, in the head of document, <meta> tags for author, robots, and description are set according to these fields. These fields can be useful for search engine optimization. The robots meta tag can be used to control how search engine robots index the page. Wikipedia has more information on Meta Elements.
The Standard page type treats the page as a usual wiki page.
Page Alias type redirects the current page to another page name. This can be used to handle things like different names for the same topic or to do localization of pages. For example, if you switch the locale from English to French and you were on the wiki page dental_floss when you switch to French the article dental_floss might redirect to the page dentrifice.
Media List type means that the page, when read, should display just the resources in the page as a list of thumbnails and links. These links for the resources go to a separate pages used to display these resources. This kind of page is useful for a gallery of images or a collection of audio or video files.
Presentation type is for a wiki page whose purpose is a slide presentation. In this mode, .... on a line by itself is used to separate one slide. If presentation type is a selected a new slide icon appears in the wiki edit bar allowining one to easily add new slides. When the Activity panel is not collapsed and you are reading a presentation, it just displays as a single page with all slides visible. Collapsing the Activity panel presents the slides as a typical slide presentation using the Slidy javascript.