¶ Markdown
Wiki.js uses markdown. There is plenty of documentation online on how to use it. Use your favourite search engine to find out more about it. You can also take a look at the source code of this page by clicking the edit button.
¶ Headings
Use the H# button in the editor or the following code.
The headings structure the page, this is important for accessibility. But contrary to normal websites you are allowed to use several first headers.
Only first and second header (# and ##) will be displayed in the page content index on the left side.
# main heading
## sub heading
### sub sub heading
#### etc...
¶ Links
The easiest way to create links to other wiki pages or external links is to use the links button in the markup editor.
The following code lines
[this is a link to the English home screen](/en/home)
[this is a link to the home screen (language neutral)](/home)
[this is an external link](https://x-hain.de)
will look like this:
this is a link to the English home screen
this is a link to the home screen (language neutral)
this is an external link
¶ Lists
Unordered lists are created with lines. Use tabs (press tab on your keyboard) or two spaces for indentations.
- L1
<tab>- L1.1
<tab>- L1.2
- L2
or
- L1
- L1.1
- L1.2
- L2
will look like this:
- L1
- L1.1
- L1.2
- L2
Ordered lists are created by using any(!) number and a dot.
1. L1
<tab>1. L1.1
<tab>1. L1.2
1. L2
or
1. L1
1. L1.1
1. L1.2
1. L2
will look like this:
- L1
- L1.1
- L1.2
- L2
¶ Tables
To create tables it is easiest to generate the code using a Markdown Tables Generator.
Here's some example code:
| H1 | H2 | H3 |
|-------------|-----------|-------|
| aaaaaaaaaaa | ddddd | gg |
| bbbbb | eeeeeee | hhhhh |
| ccccccccc | fffffffff | iii |
which will look like this:
| H1 | H2 | H3 |
|---|---|---|
| aaaaaaaaaaa | ddddd | gg |
| bbbbb | eeeeeee | hhhhh |
| ccccccccc | fffffffff | iii |
¶ Code
Inline code has `backticks` around it and will look like this. Alternatively you can use opening and closing <code>tags</code> which also creates inline code.
A block of multiline code begins and ends with three backticks. The following lines:
```
This is
a multiline
code block
```
will look like this:
This is
a multiline
code block
Instead of backticks you can also use three tildes (~~~).
¶ Escape
Put a backslash in front of a command to escape it.
Example:
A backtick around text will create inline code.
To escape the backticks, use the following code:
\`A backslash before each backtick will render the backtick instead of inline code.\`
which will then look like this:
`A backslash before each backtick will render the backtick instead of inline code.`
¶ Quotes and info boxes
This boxes elevate their content above the layout. Use them wisely, if you have three of these on a page they loose they appeal.
> This is a quote
> This is an information!
{.is-info}
> This is a very important information!
{.is-warning}
Renders as:
This is a quote
This is an information!
This is a very important!
¶ Assets: Images, Videos and Documents
Use the assets button to upload images, videos and other files (max 5MB each). Please don't make a mess in our folder structure. Create a subfolder for your documents.
¶ Images
It's good practice to wrap your image inside a link, linking to the image itself. This makes the image clickable for full size view.
Example:
[](/800px-xhain-36c3.jpg)
will look like this:
Note:
- The size can be given by the width in pixels
=200xor the height in pixels=x200for aspect ratio scaling, - or both
=200x200for non-ratio scaling. - Percentages can be used too.
¶ Videos
¶ Linking to Videos
Videos can be uploaded and linked to, but there will not be a visual preview.
Example:
[manually_lock_xdoor.mp4](/infrastructure/xdoor/manually_lock_xdoor.mp4)
will look like this:
Instead, you can create an image (with e.g. Gimp or Inkscape) with a Playbutton overlay and link it to the video.
Example:
[](/infrastructure/xdoor/manually_lock_xdoor.mp4)
will look like this:
If you click on the image, the video will be loaded in the browser.
You can download the *.svg or *.png playbutton overlay images here:
SVG: 
PNG: 
¶ Encoding Videos
Not all video formats can be streamed and only files up to 5MB are allowed.
To compress/convert your video to an appropriate format and size, run this line in a linux terminal:
ffmpeg -y -i in.mp4 -ac 1 -c:a aac -c:v libx264 -crf 18 -movflags +faststart out.mp4
Where "in.mp4" is the path to the input video, "out.mp4" the output video, and the CRF number is the compression rate (increase this number for greater compression aka. smaller file size).
- Note: ffmpeg package needs to be installed!
¶ Comments
For comments which are hidden in rendering use
[comment]: <> (This is a comment)
You can also use html comments
<!--
This is a comment
on multiple lines
-->