All features listed in this section are available to all page authors.
See the Creole 1.0 Spec for more details about basic Creole directives and behavior.
There are many cases where Creole directives are triggered by non-alpha-numeric characters as the first character on a line. Therefore, if you do not intend to write a directive, you should either avoid or escape non-alpha-numeric characters as the first non-whitespace character on lines. There are several easy ways to accommodate this.
One very general tip about nesting document elements with document authoring systems. Paragraphs can not nest other block elements. This makes sense if you understand the English meaning of the word "paragraph". Paragraph means a group of regular sentences, and if some text contains a list or a sample code block or anything else, it can not be a paragraph. Therefore, you should use a mechanism like sectioning to signify if other blocks are dependent upon a paragraph. Some document authoring systems (including plain HMTL) leave the author with the incorrect impression that their instructions to nest block elements under paragraphs are being honored, but really silently convert the elements to be peers. JCreole purposefully prohibits specifying blocks as children of paragraphs so that the .creole text always accurately reflects the structure of the (eventual) output document.
Plain text is grouped into (HTML) paragraphs. Separate paragraphs with blank lines in the wikitext. Paragraphs will automatically end without a blank like if you trigger a list, paragraph, or heading as described below (though it won't hurt anything if you add a blank line also).
See?
See?
Row lines must begin with the | character. Use | to separate each cell. Add a = immediately after the | to mark the cell as a heading cell (as opposed to a data cell). Note that These tables are not suitable for formatting purposes (as HTML tables are), but only for displaying tabular data.
Without coding anything special, all content for a table row must be specified on a single wikitext line— as you may imagine, that can be quite inconvenient. To split a single table into multiple rows, you can end a row line with the tilde character ~, or use a jcxBlock.
Looks | Like | this |
---|---|---|
and | like | this |
and | like | this |
On lines beginning with one or more # characters, where the number of #'s indicates the list level. There is a constraint on the list item levels allowed. The level (number of #'s) of a row line must be less than, equal to, or one level higher than the level of the row on the previous line. Consequently, you must start numbered lists with a line starting with just one #.
See the Headed List Items and List Enumeration Symbols sections below about Jcreole enhancements.
Same as Numbered lists, but use * characters instead of the # characters to identify the rows and indicate levels.
See the Headed List Items section below about a Jcreole list enhancement.
Begin the line with from one to six = characters.
One = sign means a top-level ("h1" in HTML) heading, and ====== means a lowest-level heading.
(The line above that says "Headings" serves as an example).
See the Section Enumeration and Automatic id's to use as Hyperlink Targets sections below about Jcreole enhancements.
Automatically made into hyperlinks with a label matching the URL.
http://wiki.wikicreole.org/Creole%201.0
To prevent link-generation, add a tilde (~) right before an URL, like ~http://wiki.wikicreole.org/Creole%201.0 .
To show a label as something other than the URL, add a pipe character and the
label text right after the URL,
[[http://wiki.wikicreole.org/Creole%201.0|like this]].
Looks like this.
Also see the Jcreole-specific Popup Links and Window-targeted Links enhancements to explicit hyperlinks.
Inter- and intra- wiki links with colons are supported by JCreole, but require application integration. If your application has provided JCreole with a mapping function from wiki-link to URL, these links will work. You can end your Inter- and Intra- wiki references with query strings or # anchors and the suffixes be preserved and honored.
Looks like...
You can add alternate text for non-graphical page viewers
like {{this.png|alternate text}}
You embed the {{...}} inside of a [[link...]] to have the image hot
linked with a target URL,
Like [[http://wiki.wikicreole.org/Creole%201.0|{{http://upload.wikimedia.org/wikipedia/commons/a/af/Tux.png}}]]
Looks like
...by prefixing the special character(s) with ~, or by enclosing the text with
{{{ and }}}.
(Variable references like ${this} are not escaped with ~. See below about this.)
These tactics are called escaping, and the latter method is called Nowiki.
Nowiki where {{{ and }}} are on separate lines with no blank space also
cause the enclosed, escaped text to be wrapped in a HTML pre element.
~ normally escapes just the special markup character following it. The exceptions where ~ escapes more than one following character are (1) immediately before an URL will prevent bare-URL linking; and (2) immediately before "{{{" will escape the entire "{{{".
It makes no sense to escape inside of <<plugins>> (including the comment plugins), or {{{...}}} literals, because those spans of text are already escaped. It is not possible to escape the closing markers for these elements because, as I said, ~ is not allowed in these situations. Therefore, >> in a plugin tag will always close the current plugin, and }}} will always close the current Nowki.
See the EM Dash section about escaping hyphens.
Note that these methods escape Wikitext language interpretation, but do not prevent changing your input to be HTML safe (such as translating ">" to ">", etc.). To avoid this level of translation you would need to use the Raw HTML directive.
Creole variables like $[this], assuming they are enabled for your application, can be escaped with tilde or with backslash. Variables like ${this} can be escaped with backslash. {{{...}}} will escape either. But if you know that your application does not define the referenced variable, then you don't need to do anything, because unless you prefix your variable name with ! or -, undefined variable references are left exactly as-is.
Preformatting is extreme escaping. Whereas escaping will prevent the special meaning for the creole text, with preformatting your white-space and formatting will be preserved and JCreole won't attempt to format it. This is specified with a Creole-specified special case for the {{{...}}} operator described in the previous item. When the {{{ and }}} are alone on their respective lines, the interceding text is displayed with the author-typed formatting (via HTML pre tag). Since pre is usually styled with a monospaced font, it works great for code sample blocks.
class Voila { public: // Voila static const string VOILA = "Voila"; // will not interfere with embedded tags. }
You could definitely user Stylers to indent or decorate the code block however you wish to, but most authors will want their code pretty-printed, so see the Pretty-printed Code section.
Can use multiple to create blank lines.
Looks like that.
All features listed in this section are available to all page authors.
Take a look at the generated code and you will see id attributes written to all of your heading elements. You can use these as targets from [[...]] links on the same page, as targets from external pages, to use in CSS selectors, or for any other purpose. (They are also used for the TOC feature described elsewhere).
If you don't supply a label, then labels are created automatically when you
write links to headings/sections in the same page (these will begin with #).
(And also for inter-wiki links if your application supports that).
Note that we prefix the heading link names that we create with jcsect_,
to prevent naming collisions with your own content or third party products.
An auto-labeled link to the Plain text section looks like this:
Plain text.
Just add named (not numerical) character entities and they will be preserved.
"see?".
This is equivalent to writing .
Four such spaces looks like this.
Since the HTML element "u" is deprecated, JCreole depends on the application (or page author by using the Style sheet directive) to make a CSS class assignment like this:
span.jcreole_underline { text-decoration: underline; }
Can you see?
Regular Super
Regular Sub
See the section below about Styling.
See?
See the section below about Styling.
See?
An EM Dash is a single long hyphen.
If you write --, that would not generate two hyphens, but would trigger
overstrike, due to the Overstrike directive.
You can avoid the Overstrike directive by writing ~-, but I recommend the
fancier EM Dash, ---, which looks like...
This—
or
This feature is JCreole-specific, but it is designed so as to degrade gracefully if using another Creole engine.
This feature is a generalization paralleling table's "|=" option. By suffixing the * or # list directive characters with "=", like "***=", you instruct JCreole to divide the list item into a heading segment and a data (non-heading) segment. The first pipe character, "|", in your content specifies where the heading ends and the data starts, in the same way as | delimits table cells.
CSS styling can be used to easily display headed list items consistently and meaningfully, for example by displaying the data intended on a separate line. The JCreole-supplied sample styles just bold and monospace the heading and separate it from the data with white space.
If you submit this to a Creole engine other than JCreole, it will not know about the special usage of = and | here, so that another Creole engine would display an input line of "#=Like|this as a list item with content "=Like|this", but JCreole will make it look...
To change ordered list symbols from normal digits, you set a general rule for what symbols to use for ordered list items at each nesting level and/or add an enumeration symbol specifier to the first list item of the list. Specifiers in lists override the document-level setting.
By default, ordered lists will be enumerated with the default ordered list symbol set of the presentation layer (usually HTML). The command above says to enumerate top-level (#) list items like "1", "2', "3",... to enumerate second-level (##) list items like "i", "ii"..., etc.
To make it clear that the listEnumSymbols directive sets a state and is in no way a part of any other element, it must be placed on a line by itself, separated from other content. You can use multuple listEnumSymbols in a document, each one effecting list items from it's location down to the next listEnumSymbol.
The specifier is one of 1 (default), a, A, i, I, followed immediatley by #. The specifier immediately follows the # character(s) at the beginning of the line. (If also specifying = to make this same item a headed list item too, then this enumeration specifier must immediately follow the = instead).
This feature is JCreole-specific, but it is designed so as to degrade gracefully if using another Creole engine.
This requires application integration, and the page author needs a specific privilege.
You write the tab label and the content for that tab just very similar to a headed list item. Start the line with * followed with the label then | then the content. Write one line for each tab that you want.
If you submit this to a Creole engine other than JCreole, it will interpet the *]... lines as a regular 1-level list, with the ] and | characters displayed in the list item contents.
If this reference guide was built without tab support, the following will be displayed as a regular list.
The first colon separates the definiendum from the definiens. Definition Lists are similar to numbered and un-numbered lists in several points
Definition Lists are not as powerful as lists though (and are even less powerful than the HTML DL+DT+DD elements that render them, due to the rather limp Creole specification for this directive). Each list item may have no more than one definiendum and one definiens; and the lists and items may not nest at all.
Pops up a message.
This requires simple application integration (at least a one-line JavaScript function definition), and the page author needs a specific privilege. This is exactly the same as Explicit hyperlinks with double-quoted URL and specified label.
or
Same as a regular link, with or without explicit label, but targets the page display to a new browser window (or tab, depending on your web browser and settings). I.e. the new web page will open elsewhere and not replace the current page.
Usage of this feature requires a specific page author privilege.
Variable references are coded as above. What variables are available for expansion is entirely dependent upon how your application has integrated JCreole. The command-line JCreole application (which is invoked most simply by using java... -jar commands) makes all Java system properties available in this way. Since what variables are available is application-specific, be aware that .creole files that contain $ variable references are therefore application-specific. For example, if you use java... -jar with a .creole file and then use that same .creole file with some web or other application, the same variables may not be available for expansion.
$[...] variables are only available to you if your application has enabled them. They are dereferenced very early, and the variable values are Creole which will be translated to HTML. Some applications allow end-users to use $[...] references to use application-predefined Creole macros. Some applications may allow privileged users to write their own Creole variable definitions (and therefore their own Creole macros).
${...} variables are dereferenced late, and the variable values are HTML. Most applications provide some of these variables for you to use, and some applications let you define your own.
$(...) variables are for use in boilerplates (non-Creole template text that wraps and formats your output), and are not strictly a Creole construct, so they are not described here.
If you will use variable references, you should be aware of the rules for their usage.
Use of Plugin Directives is restricted. If you do not have the privilege needed to use a specific directive, you will be given a precise message to that effect when you submit the wikitext. Applications may also activate some plugin features without page author involvement (specifically, enumerating sections by default, and automatic generation and display of table-of-contents).
The <<prettyPrint>> directive is an optional enhancement for nowiki {{{...}}} preformatted blocks as described in the Preformatting section. The <<prettyPrint>> directive may only be used on the line before a Preformatting opening {{{.
Since nowiki {{{ must always be the only thing on a line, your code to be pretty-printed must be preceded by "<<prettyPrint>>" and then a line containing only "{{{". (Except that you may add CSS class specifiers right after prettyPrint. See below about that).
<<prettyPrint>> is not allowed inside paragraphs. If you start a line with it after a paragraph has begun, it will end the paragraph. <<prettyPrint>> is allowed inside of lists.
Sample creole:
<<prettyPrint linenums>> {{{ class Voila { public: // Voila static const string VOILA = "Voila"; public String toString() { return "me"; } } }}}
Generates:
class Voila { public: // Voila static const string VOILA = "Voila"; public String toString() { return "me"; } }
This feature does require simple http support. If the code above is not pretty-printed, then you are viewing the standalone mode reference doc.
JCreole uses the google-code-prettify library to perform pretty-printing.
As shown in the example above, the word prettyPrint may be followed by CSS classes to control optional prettify behaviors, as shown in our example. JCreole (actually google-code-prettify) can usually detect what the code language is, but for ambiguous cases like little code snippets, you can specify the language by CSS class like this: prettyPrint lang-java. The language must be specified with one of the supported lang-x class names exactly as specified in the google-code-prettify documentation. The same documentation describes the linenums CSS class to display line numbers (as shown in the example above) and other features. JCreole does not yet support prettify's nocode class for illustrative code comments.
Code HTML right into your wikitext page. This directive is usually restricted to users with a special authorization.
or
You can assign CSS classes to your custom elements as shown by the second sample here, or by using Styler directives as shown below.
Due to HTML syntax rules, you can not create a jcxBlock (or any HTML block element) inside of a HTML paragraph.
or
You can assign CSS classes to your custom elements as shown by the second sample here, or by using Styler directives as shown immediately below.
Here is a sample that colors some text yellow.
<<addClass =block className1 classname2>>
or
<<addClass =inline className1>>
or
<<addClass =jcxBlock className1 className2 className3>>
or
<<addClass =jcxSpan className1>>
These samples show how to add classes to immediate parent HTML block element,
HTML inline element, jcxBlock, or jcxSpan element.
<<addClass -block className1 classname2>>
Just change the = to - to add the class name to the previous
element which was closed.
This works for all 4 element types.
<<addClass +block className1 classname2>>
Just change the direction character to + to add the class name to the
next element which was closed.
This works for all 4 element types.
A few HTML elements can not be targets of stylers (i.e., you can not add classes to them using Stylers). Some elements are purposefully omitted because they make it more difficult to target more important elements nearby (e.g. spans added for internal formatting purposes and thead and tbody elements). Elements added in a very late pass (only TOC-related elements AFAIK) can not be targeted because the are not written until after the Stylers are applied.
This is a sample that colors this HTML p element yellow.
CSS file links will be inserted into the HTML pages's head section. You can use multiple styleSheet directives on a single page and the links will be inserted in the correct order.
This plugin requires application integration to insert into the framing HTML page. If you have permission to use this directive, then that should all be taken care of.
To make it clear that styleSheet directives are in no way a part of any other element (like a paragraph, list, or table), each styleSheet directive must be placed on a line by itself.
Comments written this way never make it to the HTML page.
These comments can be seen by end-users who know how to view source HTML.
By default, no headings/sections in the generated page will be enumerated. The command above says to enumerate top-level (h1) headings like "A", "B', "C",... and to enumerate the second-level (h2) headings like "1", "2"..., etc. This effects both headings in the main body and TOCs if you add any (see the TOC: Table of Contents directive below).
You may only use one sectionEnumSymbols directive on a single page, since there is only one such setting for a page (and location of the directive doesn't matter). The sectionEnumReset and toc directives can be used to make location-specific adjustments to the document-wide sectionEnumSymbols. To make it clear that a sectionEnumSymbols directive is in no way a part of any other element, it must be placed on a line by itself, separated from other content.
See the Enumeration Symbol Specification Strings section below about the meaning of the characters in the enumerationFormats string ("A1a1_x" above).
Far easier to explain this with an example. Assume we start a page out with numerical ("1") enumeration symbols and this:
=== First === Second === Third === Fourth <<sectionEnumReset A>> === Fifth
The generated section enumerations will be "1", "2", "3", "A', "B". Note that the reset both changed the enumeration symbols and reset the sequence counting. If you assign the same symbol that was already in use ("1" here), then the only effect will be to reset the counting sequence.
or
or
or
toc elements must be in a separate block. I.e. they have to be separated from other text with a blank line.
These samples all generate a table of contents listing at the location where you code the directive— just like the one at the top of this page. The first two samples will include/exclude sections and use enumerations symbols per the page settings. The last two samples specify section-inclusion explicitly. CSS classes must be specified in the TOC directive (as opposed to using Stylers) because Stylers can not effect TOCs (because the table of contents are generated by a pass after Stylers are applied).
See the Enumeration Symbol Specification Strings section below about the meaning of the characters in the section-inclusion string ("___xxx" above).
You can include as many table-of-contents in a page as you want to. The Java API also has getters for obtaining both TOC HTML and the data structures, so that applications can write the TOC to a framing tile or header, either using a pre-fab or building it manually.
To make it clear that toc directives are in no way a part of any other element (like a paragraph, list, or table), each toc directive must be placed on a line by itself.
Add references<<footNote yourEntryName>> like this, and..
Mark paragraphs as footNote entries like <<footNoteEntry yourEntryName>> this. The footNoteEntry directive instructs Creole to remove this paragraph from its position in the document body and put it into the footnotes listing instead. The paragraph may contain any regular paragraph markup, excepting footnote, master list, and index Directives. For reference or bibliography entries, you will often want to use Explicit hyperlinks with & Window-targeted Links in the paragraph.
Then finally, where you want the footnote entries to appear in the document, add...
or
or
or
footNotes elements must be in a separate block. I.e. they have to be separated from other text with a blank line.
Just use "<<footNotes>>" for the default footnotes layout. "DEF_ORDER" specifies to list the footnotes in the sequence that the footnotes were written (with footNoteEntrys), instead of the default order (REF_ORDER, the order of the first reference to each footnote in the main document body). To make it clear that footNotes directives are in no way a part of any other element (like a paragraph, list, or table), the footNotes directive must be placed on a line by itself.
You place footNote directives where you want references to appear; you place the single footNotes directive where you want the footnotes listing to appear; and you put footNoteEntry directives any place at all (because JCreole will collect all footNoteEntry paragraphs into the footnotes listing). Write the footNoteEntrys wherever it is more convenient for you. You may want to keep them together, or maintain each one by the relevant body content.
The entry names, yourEntryName in the examples above, are arbitrary. Though they do not appear in the generated document at all, they serve an important purpose. They allow multiple references (footNote directives) to point to a single footnote entry. Since you can use any names that you want to, you can use names that remind you of what the entry is for, are easy to remember, and are easy to type. For example, if you have a footnote entry listing your source documents for genetic inheritance details, you could name that entry something like genetic-inheritance-sourcedocs or inheritance-src, depending on your compromise between conciseness and descriptiveness.
If you click on a footnote link (superscripted digit) and the footnote text is not displayed in a pop-up, then you are viewing a standalone mode reference doc. In that case, your browser will scroll to the target location in the document.
Main body text paragraph here, with the first reference1 and a second reference2. And to show that multiple references to a shared entry work, here's a second ref to the first entry1.
Note that though you will usually want to insert the footnote entry listing at the end of your document, it's awful useful for special cases like this one, to be able to place it wherever you want to.
First sample entry.
Second sample entry.
Mark entries in the document body <<(>>like this<<)>> or like this<<indexed Entry name>>.
Then where you want the index to appear in the document, add...
or
or
or
Just use "<<index>>" for the default index layout. "REF_ORDER" or "NAME_BY_JAVA" specify to display the index entries sorted by reference order or by Java collation of the heading text, instead of by the default dictionary sorting of the heading text. To make it clear that index directives are in no way a part of any other element (like a paragraph, list, or table), the index directive must be placed on a line by itself.
You place indexed or (...) directives in the document body where you want index entries to point to; and you place the single index directive where you want the index listing to appear.
Mark targets of index entries in the main document body using these two methods.
For the first method, enclose just the target text, not markup, or the markup characters may appear in the generated heading. If you don't want to deal with that, then just use the second method.
Main body text paragraph here, with the first index target and a second index target. And to show that multiple index targets for a shared entry work, here's a second target for the first entry.
Another paragraph with two instances of index targets. Here's a third target for the multi-entry first Entry .
Note that though you will usually want to insert the index at the end of your document, it's awful useful for special cases like this one, to be able to place it wherever you want to.
Add [[entryName|explicitly labelled reference]]s or default-labelled references like this: [[entryName]], and...
Mark paragraphs as master definition entries like <<masterDefEntry yourEntryName>> this. The masterDefEntry directive instructs Creole to remove this paragraph from its position in the document body and put it into the masterDefList listing instead. The paragraph may contain any regular paragraph markup, excepting footnote, glossary, and index Directives. Then finally, where you want the definition entries to appear in the document, add...
or
or
or
masterDefList elements must be in a separate block. I.e. they have to be separated from other text with a blank line.
Just use "<<masterDefList>>" for the default list layout. "REF_ORDER" or "NAME_BY_JAVA" above are samples of (optional) specification for ordering of the list entries. The supported values are
A Master Definition List is a generalization of a glossary. One Creole document can have only one master definition file (hence master). Add definitions for any words, terms, phrases, or whatever you want to explicitly define for your audience.
You place explicit link directives where you want references to appear; you place the single masterDefList directive where you want the entry listing to appear; and you put masterDefEntry directives any place at all (because JCreole will collect all masterDefEntry paragraphs into the entry listing). Write the masterDefEntrys wherever it is more convenient for you. You may want to keep them together, or maintain each one by the relevant body content.
Notice that you write links to definition entries as Explicit hyperlinks. Each explicit hyperlink in your document with a relative URL (i.e. not #localAnchor URL and not absolute URL and not wiki:link) is checked against all def list entries. If the URL matches a master definition list entry name, then it is linked to it.
Multiple links can point to a single definition entry. Definition entries do not need to be linked to at all.
If you click on a reference link and the definition text is not displayed in a pop-up, then you are viewing the standalone mode reference doc. In that case, your browser will scroll to the target location in the document.
You can insert the Definition List wherever you want to in your document.
Saleswoman. Previously the office receptionist.
Office manager.
Main body text paragraph here, with the Scott, Michael auto-labelled link, and a second explicitly labelled link. And to show that multiple references to a shared entry work, here's a second link to the Scott entry.
This section of the reference guide explains how to style text beyond the abilities of the basic text styling directives (Strong text, Emphasized text, Monospace fonts, etc.).
If you have permissions to use the Style sheet directive, then you can customize the appearance and layout of the many un-classed elements that JCreole generates, as well as the several CSS classes that JCreole writes for this purpose.
To avoid unintended consequences to the framing HTML page, you should always narrow your CSS selectors. Since applications should always wrap JCreole-generated content with a jcreole div, you should narrow with div.jcreole. For example, say you want to color all divs and paragraphs blue, you should not style with
div, p { background-color: blue; }
but with
div.jcreole div, div.jcreole p { background-color: blue; }
The following CSS selectors are useful for targeting styles as described.
Class names with the string "jcx" instead of "jcreole" are for management of Plugin-specific functionalities. For example, class names related to tables are prefixed with "jcreole_" since tables are a basic Creole 1.0 feature; but class names related to table-of-contents are prefixed with "jcx_" since table-of-contents are implemented as a JCreole plugin and there is no such feature in basic Creole.
As mentioned in the relevant sections above, by default JCreole generates no section enumerations or table-of-contents, so setting the CSS classes for those functions will have no effect if you or your application don't enable the feature.
If your JCreole system has been set up with pretty-printing support, then you can use or modify the CSS classes written by the google-code-prettify Javascript library. The google-code-prettify web site is the definitive source for documentation about google-code-prettify CSS.
An enumeration symbols string is a 6-character string that specifies what symbols to use to enumerate each of the six heading/section levels or ordered-list nesting levels. For example, in the sectionEnumFormat specification "A0a1__", A specifies the formatting for level 1 headings (h1's), 0 specifies the formatting for level 2 headings, etc.
Each character in the enumeration formatting string specifies the formatting of level indicated by the character's position, as follows.
We intend to add support for additional formatting symbols in the future (especially I and i for headings/sections.
Table-of-contents may display all section levels, or may exclude specified levels.
A section-inclusion string is a 6-character string that specifies inclusion of a heading/section for each of the 6 supported heading levels. For example, in the specification "x_0101", x specifies inclusion (or in this case exclusion) for level 1 headings (h1's), _ specifies inclusion for the level 2 heading, etc.
Each character in the section-inclusion string specifies inclusion or exclusion of the level indicated by the character's position, as follows.
To state this more generally, the character x means to exclude the level, and any other supported character means to include the level— where the supported characters are characters listed in the list in the Formatting characters section.
You can completely control section inclusion/exclusion by using just the characters x and _. The only reason we support the alternative characters in place of _ is so you can make up one optimized enumeration-formatting + section-inclusion string that can fulfill both purposes. I.e. you could use the same exact string in both <<sectionEnumSymbols>> and <<toc>> directives.