Home A - Z
Menu

An Otter Wiki

Blame

5d6203 Ralph Thesen 2023-12-04 20:33:58
added example for all syntax features
1 
# All Syntax Features
2
3
This page should be an example for all the syntax features supported
4
by An Otter Wiki. You display the markdown code via
5
<span class="help-button"><span class="btn btn-square btn-sm">
6
<i class="fas fa-ellipsis-v"></i></span> <i class="fas fa-caret-right"></i>
7
<span class="btn btn-square btn-sm"><i class="fab fa-markdown"></i></span>
8
View Source</span> or click [here](/Examples/All%20Syntax%20Features/source).
9
10
## Markdown paragraphs and text formatting
11
12
In markdown paragraphs are seperated by a blank line.
13
14
Without an empty
15
line, a block of
16
words will be rendered
17
as paragraph.
18
0cd553 Ralph Thesen 2023-12-30 19:39:38
fixed some typos
19
Individuals words or sentences can be emphasized as `monospace`, **bold**, _italic_
20
or **_bold and italic_**. Or go wild and ==mark== or ~~strike out~~ words.
5d6203 Ralph Thesen 2023-12-04 20:33:58
added example for all syntax features
21
22
An Otter Wiki stores all pages in UTF-8 in a git repository. With UTF-8 you get emojis
23
like 🥳 and 🎆, that all modern browsers can display.
24
0cd553 Ralph Thesen 2023-12-30 19:39:38
fixed some typos
25
If you don't want to user a header for seperating paragraphs,
26
or a header is just not enough, add a horizontal line:
5d6203 Ralph Thesen 2023-12-04 20:33:58
added example for all syntax features
27
28
---
29
30
## Links
31
0cd553 Ralph Thesen 2023-12-30 19:39:38
fixed some typos
32
Some example for links in the middle of a paragraph.
33
[A link to the otterwiki github project](https://github.com/redimp/otterwiki),
34
followed by an auto linked url to http://example.com, followed by a mail address
c0ae15 Ralph Thesen 2024-08-07 19:54:17
added example for a wikilink with sapces
35
<mailto:mail@example.com>. Commonly used are links inside the wiki, e.g. one pointing [[Home]] or to another example [[Syntax Highlighting|Examples/Syntax Highlighting]].
5d6203 Ralph Thesen 2023-12-04 20:33:58
added example for all syntax features
36
37
## Footnotes
38
39
Here's a sentence with a footnote.[^1]
40
41
[^1]: This is the footnote.
42
43
## Quotes
44
45
> One quoted line.
46
47
Got more to quote?
48
49
> You can highlight paragraphs as a quote.
50
>
51
> The quote can span multiple lines!
52
>> And it can nest more quotes.
53
>>
54
>> **Markdown syntax will be rendered inside quotes.**
55
56
## List examples
57
58
Itemized lists look like
59
60
* this one
61
* with three
62
* items.
63
64
A numbered list
65
66
1. first item
67
2. second item
68
3. third item
69
70
And a task list
71
72
- [ ] a unchecked item
73
- [x] and **bold** checked item
74
75
*The task list can only be mofied by editing it, not by clicking the checkboxes while viewing it.*
76
77
## Tables
78
79
A wide table with different aligend columns:
80
81
| Very wide column without expliciit alignment | Left aligned column | Centered column | Rght aligned Column |
82
| -------------------------------------------- |:------------------- |:---------------:| -------------------:|
83
| Cell with Text | Cell with Text | Cell with Text | Cell with Text |
84
| Cell with <br> two lines. | Cell with Text | Cell with Text | Cell with Text |
85
86
87
A table with some formatting and an emoji.
88
89
| Alpha | Bravo | Charlie |
90
| -------- | ----------------- | -------- |
91
| `D`elta | Echo | Foxtrott |
92
| Golf | **Hotel** | India |
93
| Juliett | Kilo | _Lima_ |
94
| ~~Mike~~ | November | Oscar |
95
| Papa | Quebec | Romeo |
96
| Sierra | Tango | Uniform |
97
| Victor | [Whisky](#tables) | X-Ray |
98
| Yankee | Zulu | 🦦 |
99
100
101
## Code blocks
102
103
Markdown is often used for documentation, so it's not a
104
surprise that it should be excellent in displaying code and configurations.
105
For example a minimal `docker-compose.yaml` for running An Otter Wiki:
106
107
```yaml
108
version: '3'
109
services:
110
otterwiki:
111
image: redimp/otterwiki:2.0
112
ports:
113
- 8080:80
114
```
115
116
This and many other examples for syntax highlighting can be found in [[Examples/Syntax Highlighting|/Examples/Syntax Highlighting]].
117
118
## Lists can nest blocks
119
120
List can nest lists and other block.
121
122
1. For example
123
* an unordered list
124
* with two items
125
2. or
126
1. an new level
127
2. of an ordered list
128
3. with three items.
129
3. Somtimes you might have to add
130
131
an entire paragraph to a list. To do that indent it with
132
4 spaces and add an empty line before and after the paragraph.
133
134
5. Maybe you want to add a fenced block of code
135
136
```python
137
class Example:
138
"""Finding examples is hard."""
139
var = True
140
```
141
4. or a quote
142
143
> You get the concept.
144
145
## Math or LaTeX
146
0cd553 Ralph Thesen 2023-12-30 19:39:38
fixed some typos
147
If you want to share math formulas in your wiki, [MathJax](https://www.mathjax.org/) comes
148
to the rescue. For example:
5d6203 Ralph Thesen 2023-12-04 20:33:58
added example for all syntax features
149
150
When `$a \ne 0$`, there are two solutions to `$ax^2 + bx + c = 0$` and they are
151
```math
152
x = {-b \pm \sqrt{b^2-4ac} \over 2a}.
153
```
154
155
## Special blocks
156
157
An Otter Wiki supports also some special blocks, whose syntax is derived
158
from various dialects.
159
160
You can create spoiler blocks:
161
162
>! ![](/static/img/otterhead-100.png)
163
>! Not a massive spoiler, but useful to show that you can hide images and text inside
164
>! a spoiler block.
165
166
---
167
168
Blocks with summary, that unfold the details on click:
169
170
>| # Do you want to know more?
171
>|
172
>| Detail blocks could be used for handling spoilers, too.
173
174
---
175
176
In case you have to highligh important informations,
177
An Otter Wiki provides special blocks in different flavors.
178
179
:::info
180
# An info block
181
182
with some content.
183
:::
184
185
and in the flavor of a
186
187
:::warning
188
# Warning block (in yellow)
189
190
With _some_ `formatting` in it.
191
:::
192
193
or a
194
195
:::danger
196
# Danger block (in red)
197
198
In case a warning not warning enough.
199
:::