Text Formatting
Also available in Deutsch, Español, Français, Polski, Русский, 简体中文.
See also: Actions
Wacko text formatting is slightly different from other wikis, so you should read the examples below.
You can experiment with the Wiki Markup in the Sandbox.
Text enclosed in pairs of double quotes is not formatted and remains unchanged when displayed.
source | displayed |
1. Table of contents
detailed description... |
|
NB: if you are using this with the 'include' plugin, but don't want the headers that you're pulling in from the include file to be listed in the generated table of contents, use the 'notoc' option like so:
|
2. Basic Formatting
**bold** | bold |
//italic// | italic |
__underline__ | underline |
##code## | code |
--strikethrough-- | |
++small++ | small text |
!!note!! (also ''note'', but it is better not to use it). | note |
!!(blue) blue color!! | blue color |
!!(green) green color!! | green color |
!!(red) red color!! | red color |
??emphasis?? | emphasis |
??(blue)emphasis?? | emphasis |
??(red)emphasis?? | emphasis |
??(green)emphasis?? | emphasis |
%%embed code%% |
int main(int arc,char **argv) { printf("Hello, %s!\n", (argc>1) ? argv[1] : "World"); return 0; } |
NB: Strikethrough, like all formattings below (in this chapter), are multiline. All previous formattings are not multiline because we going to make formatting that doesn't break your texts. |
3. Alignment
The alignment is carried out with the help of such a complex structure:
default |
left
|
%%(wacko wrapper=text wrapper_align=center) center%% |
center
|
%%(wacko wrapper=text wrapper_align=right) right%% |
right
|
%%(wacko wrapper=text wrapper_align=justify) justify%% |
justify
|
wrapper_align
can be center
, right
or justify
.
4. Links
As character markup for creating links, you can use round ((, ))
or square [[, ]]
brackets. Both characters are equal. Square brackets can be useful if the page text already contains simple round brackets, which may be mistakenly considered markup.
4.1. External Links
((http://wackowiki.org WackoWiki)) | WackoWiki |
http://wackowiki.org is highlighted automatically. | http://wackowiki.org |
PPR:OneMinuteWiki InterWiki linking | PPR:OneMinuteWiki |
mailto:address@example.com ((address@example.com)) email. | mailto:address@example.com address@example.com |
xmpp:addresse@example.com Jabber. | xmpp:addresse@example.com |
((https://example.com/archive.zip Archive (zip) )) https://example.com/archive.zip | Archive (zip) https://example.com/archive.zip |
4.2. Internal Links
[[Sandbox]] or ((Sandbox)) | Sandbox |
((Sandbox The sandbox page)) | The sandbox page |
https://wackowiki.org/wacko_logo.png Image with no link. | |
((/HomePage https://wackowiki.org/wacko_logo.png)) Image with a link. | |
{{anchor href="test"}} anchor declaration. |
|
((#test)) or ((/HomePage#TOC_1)) anchor reference. | test or /HomePage#TOC_1 |
Notes
- For internal links, relative or absolute addressing can be used.
- Mixed case words (
LikeThis
) do not need to be enclosed in brackets, when wikilinks are not disabled. For internal links (inside this Wiki), the complete URL should not be written (otherwise the link will not work). Add "https://
" only for external links. - To prevent a WordLikeThis from becoming a link, place a
~
(tilde) in front of it. - How do you use a link to a local file with spaces in it? (e.g.:
S:\Network Drive\File 1.txt
or//server1\file name.txt
)To link to local files on a server with spaces like that, use file:/// and switch all backslashes to forward slashes. Also, replace any spaces with%20
, so your link would becomefile://///server1/file%20name.txt
Also, there is an issue with linking to local files on Firefox: Solution
- To resize and align images from external sources you can use the following syntax:
((http://example.com/image.png width=500 align=center))
, available parameterswidth
,height
andalign=[left, center, right]
.
5. Including uploaded files
| file:/Subpage/archive.zip |
5.1. Media Parameters
Parameters are added to the file syntax by appending a question mark ?
and adding additional parameters by an ampersand &
.
e.g. file:/lotus_flower.jpg?right&caption&400
- linking
-
direct
- to file -
nolink
- shows only the image -
linkonly
- shows only link -
meta
- to filemeta handler (default)
-
- alignment
-
right
-
left
-
center
-
- resizing
-
400x300
- width × height -
0x700
- height -
600
- width
-
- others
-
caption
- shows caption -
clear
- clears float
-
6. Headlines
7. Bulleted and Numbered Lists
Indent lists with tabs or double spaces, and use
*
, 1.
, A
., a
., or i
. to specify the type of list you want.
Lists: first line indented line ---- * bullet list * bullet list-2 ---- 1. numbered list 1. numbered list-2 2.#8 numbered list, with transition ---- A. using upper case characters A. using upper case characters-2 ---- a. using lower case characters a. using lower case characters-2 ---- i. using Roman numbers i. using Roman numbers-2 ---- 1. list 1. nested list * and even more nested list 1. nested list 2 2. list 2 |
Lists: first line
indented line
|
8. Cite and definitions
<[ Citation of text | Citation of text |
(?Term Some definition?) | Term |
(?Term containing spaces == Some other definition?) | Term containing spaces |
9. Footnotes
Text, then footnote[[*]] and second one[[**]] | Text, then footnote* and second one** |
Text, then numeric footnote[[*1]] and second one[[*2]] | Text, then numeric footnote1 and second one2 |
[[#*]] Text for first footnote [[#**]] Text for second footnote [[#1]] Text for numeric footnote [[#2]] Text for second numeric footnote | * Text for first footnote ** Text for second footnote 1 Text for numeric footnote 2 Text for second numeric footnote |
auto-generated footnotes [[^ text of footnote here]] | generates the footnotes at the end of the page, see example |
10. Quoting
To mark a text as a reply or comment, you can use the following syntax:
Hi! > Yes, it is. >> Are you sure? > Of course, yes! >> Really? >>> Now what? | Hi! > Yes, it is. >> Are you sure? > Of course, yes! >> Really? >>> Now what? |
11. Tables
Table with border
#|
*|header 1|header 2|header 3|*
||cell11|cell12|cell13||
||cell21|cell22||
|#
header 1 | header 2 | header 3 |
---|---|---|
cell11 | cell12 | cell13 |
cell21 | cell22 |
Table without border, 100% width
#||
||cell11|cell12|cell13||
||cell21|cell22||
||#
cell11 | cell12 | cell13 |
cell21 | cell22 |
Note: Complex tables can be created by using inline HTML, if available.
To include a pipe |
as content within your cell, enclosed the pipe by a pair of double quotes: ""|""
.
12. Miscellaneous
Horizontal rule (separator):
----
Forced line break:
test---new line
test
new line
Forced empty line:
---"" ""---
Text output "as-is" -- ignoring markup
Text should be enclosed by a pair of double quotes, e.g. ""test---new line""
. You can look at the source of this page for numerous examples.
Furthermore, for the screening of any form of marking, it is possible to use ~
(tilde).
13. Inline HTML
HTML output "as-is"
This works only if the site admin allows it.
<# <input type="text"> #> | <# <input type="text"> #> |
If you see <input type="text">
instead of the input field, the site admin don't turn up this function (config parameter: allow_rawhtml
).
NB: It is very dangerous option, avoid XSS!.
14. Special Character
The automatic proofreader built into the wiki automatically adjusts the saved text to the formatting norms, saving the authors from excessively detailed editing. Here are the changes he makes:
SuperscriptE=mc^^2^^ | E=mc2 |
Subscript Insert spaces before and after vv. H vv2vv O | H 2 O |
Additional | |
^F | °F |
^C | °C |
(p) | § |
(tm) | (tm) |
(c) | (c) |
(r) | (r) |
+- | +- |
~~ | ~ |
15. Macros
Macros are little shortcuts which automatically update the document you're writing with relevant variables such as your name and wikiname, the date of writing etc. Basically, they're just little text shortcuts.
To automatically insert your name, use:
::::
RomanIvanov
Auto name and date:
::@::
RomanIvanov /20.06.2003 18:13/
Date:
::+::
20.06.2003 18:13
16. Code and Syntax highlighting
WackoWiki is easily extended with text formatters. They are called using syntax %%(name) text%%
.
As character markup for text formatters, you can use percent signs %%, %%
or grave accents ``, ``
. Both characters are equal. Grave accents can be useful if the text already contains percent signs, which may be mistakenly considered markup.
Beyond that this allows you to wrap a formatter in a formatter, e.g. wrapping a CSS highlighter in a details formatter.
There are several formatters included in Wacko package:
%%(wacko)The text as it is. ((/HomePage))%% This format displays the text in the same way as if it was written without a formatter. Convenient for applying additional wrappers to text (alignment, boxes, etc. See below.) | The text as it is. /HomePage
| |||||||||
%%(php) PHP-code%% |
Attention: that code should begin with | |||||||||
%%(comment) Comments, they will be hidden when the page is stored and redisplayed %% | ||||||||||
%%(noautolinks) no AutoLinks if CamelCase-Words%% | no AutoLinks if CamelCase-Words
| |||||||||
%%(details title="Summary" open=1) Details info. %% |
SummaryThe HTML Details Element (<details> ) creates a disclosure widget in which information is visible only when the widget is toggled into an "open" state. A summary or label can be provided using the <summary> element.
| |||||||||
%%(cl)zypper dup --no-recommends%% |
zypper dup --no-recommends | |||||||||
%%(chat [type="div|table"]) |
| |||||||||
%%(email) Email%% |
Hi! RI>> Yes, it is. >Are you sure? Of course, yes! Roman. | |||||||||
%%(sql) SQL-code%% |
SELECT * FROM sometable | |||||||||
There's also (ini), (html), (css), (java) and (pascal) highlighters. | ||||||||||
%%(html) HTML-Code%% |
<html> <a href="http://example.com">test</a> </html> | |||||||||
%%(ini) ini-Code%% |
[Wiki] BestEngine="WackoWiki" Version=6 | |||||||||
%%(css) CSS-Code%% |
body {margin: 0; padding: 5px;}
.class {background: url("http://example.com/");}
| |||||||||
%%(pascal) PASCAL-Code%% |
program megaprogramme; { comment } BEGIN if a = 15 then writeln('test'); END. | |||||||||
16.1. Info box
Types: default , error , example , important , note , question , quote , success , warning title box titleicon show icon, default value is 1 | ||||||||||
%%(info type="note")
|
A wiki is a website where users can add, remove, and edit every page using a web browser. It's so terrifically easy for people to jump in and revise pages that wikis are becoming known as the tool of choice for large, multiple-participant projects.
| |||||||||
%%(info type="warning")
|
As with any software that you expose to the internet, there may be bugs or security problems. Do not install WackoWiki unless you intend to keep up with security upgrades.
| |||||||||
16.2. PEAR Text HighlighterPEAR package for syntax highlighting
Formatter: abap , cpp , css , diff , dtd , html , java , javascript , perl , php , ruby , python , sh , sql , vbscript , xml . | ||||||||||
%%(hl css) CSS-Code%%
|
body {margin: 0; padding: 5px;} .class {background: url("http://example.com/");} | |||||||||
%%(hl javascript) Javascript-Code%%
|
var a = document.getElementById("test"); a.value = new Array(15, 31); function echo (msg) {alert(msg)}; | |||||||||
%%(hl php numbers=2) PHP-Code%%
|
| |||||||||
%%(hl xml) xml-Code%%
|
<config> <section name="test"> <var>Test</var> <val><![CDATA[..text...]]></val> </section> </config> | |||||||||
16.3. GeSHiGeSHi Code Highlighting - Generic Syntax Highlighter %%(geshi [Formatter] numbers=1 start=35 lines=37) source%% | ||||||||||
%%(geshi css) CSS-Code%%
| Formatierer
highlight/geshi nicht gefunden | |||||||||
If you see Formatter highlight/geshi not found, the GeSHi formatter was not added to this site. | ||||||||||
17. Wrappers around formatters
Also available in Deutsch, Français, Русский, 简体中文.
Additionally it is possible to assign a specific wrapper for each formatter %%(formatter) text%%
with the parameter wrapper=
.
%%(formatter
[wrapper="box | shade | page | text"]
[wrapper_align= "left | center | right | justify"]
[wrapper_title="Titel"]
[wrapper_type="default | error | example | important | note | question | quote | success | warning"]
[wrapper_width="pixel"]
[col=1 | 2 | 3 | 4 | 5]
[clear])
Text
%%
box | shade | page | text | |
---|---|---|---|---|
type | + | + | – | - |
title | + | + | – | - |
alignment | + | –1 | –2 | + |
clear | + | + | – | – |
width | + | –1 | + | –3 |
column | – | + | – | + |
frame | + | + | – | – |
automatic line feed | + | + | + | – |
1 This option does not make sense, because the width of the block is always equal to the width of the page.
2 Only to the left.
3 If you don't put the line feeds yourself, the block width is fixed by the engine at approximately 90% of the page width.
Grammar = [FORMATTER | FORMAT WRAPPER | FORMAT WRAPPER OPTION | Text]
FORMATTER = [ cl | comment | css | email | hl * | html | info | ini | java | pascal | php | sql | wacko ]
FORMAT WRAPPER = box
, shade
, page
und text
TEXT = alles, frei.
How to resize an image?
Re: How to resize an image?
It's better to resize the image before the upload.
1. Media parameters
Since R5.5.8 you can resize an image by appending the following media parameters:
e.g.
file:/image.png?200x400
400x300
- width x height (pixel)0x700
– height (pixel)600
- width (pixel)2. Wrapper and autoresize
%%(wacko wrapper=page wrapper_width=500)file:/image.png%%
%%(wacko wrapper=box wrapper_width=600)file:/image.png%%
A wrapper might also be useful if you use it with an unknown image size, e.g.
{{randomimage global=1}}
3. HTML & CSS
Using percentage is not supported, but if you have HTML enabled, you can use CSS style to do that e.g.
<# <img style="width: 50%; height : auto;" align="left" alt="WackoWiki" src="file/global/wacko_logo.png"> #>