Markdown Hilfe

Bilder einbetten

Vorschau

Bild mit 64x64 Pixel

Das Bild ist direkt Bild mit 16x16 Pixel im Text eingebettet.
Damit es gut in den Textfluss passt, ist die Auflösung entsprechend auf 16x16 Pixel gesetzt.
Ohne die optionale Angabe der Dimension würde das Bild in voller Auflösung ausgegeben.

Quelltext

![Bild mit 64x64 Pixel](/site/baukasten.png =64x)

Das Bild ist direkt ![Bild mit 16x16 Pixel](/site/baukasten.png =16x) im Text eingebettet.
Damit es gut in den Textfluss passt, ist die Auflösung entsprechend auf `16x16 Pixel` gesetzt.
Ohne die optionale Angabe der Dimension würde das Bild in voller Auflösung ausgegeben.

Bilder einbetten (mit Spoiler)

Vorschau

Bild im Spoiler

Quelltext

<details>

![Bild im Spoiler](/site/baukasten.png)

</details>

Blockzitat

Vorschau

Dies ist ein reguläres Blockzitat oder auch Blockquote genannt.

Dies ist ein {.is-info}-Blockzitat.

Dies ist ein {.is-success}-Blockzitat.

Dies ist ein {.is-warning}-Blockzitat.

Dies ist ein {.is-danger}-Blockzitat.

Quelltext

> Dies ist ein reguläres Blockzitat oder auch Blockquote genannt.

> Dies ist ein `{.is-info}`-Blockzitat.
{.is-info}

> Dies ist ein `{.is-success}`-Blockzitat.
{.is-success}

> Dies ist ein `{.is-warning}`-Blockzitat.
{.is-warning}

> Dies ist ein `{.is-danger}`-Blockzitat.
{.is-danger}

Emojis

Vorschau

Man kann eine Reihe von Emojis verwenden wie zum Beispiel oder .

Quelltext

Man kann eine Reihe von Emojis verwenden wie zum Beispiel :palm_tree: oder :tea:.

Anmerkungen

Eine genaue Übersicht der unterstützten Emojis findet man in diesem Cheat Sheet.

Sollte die Webseite nicht erreichbar sein, so gibt es alternativ hier das Cheat Sheet auch als Bild.

Fussnotizen

Vorschau

In diesem Text^[1] gibt es zwei Fussnotizen^[2].
Die Fussnotizen sind jeweils ganz am Ende einer Seite zu finden.

Quelltext

In diesem Text[^1] gibt es zwei Fussnotizen[^2].
Die Fussnotizen sind jeweils ganz am Ende einer Seite zu finden.

[^1]: Dies ist die 1. Fussnotiz.
[^2]: Dies ist die 2. Fussnotiz.

Horizontale Trennlinie

Vorschau

Dieser Text ist durch eine horizontale

Trennlinie getrennt.

Quelltext

Dieser Text ist durch eine horizontale

---

Trennlinie getrennt.

Hyperlinks

Vorschau

Hyperlinks können als Text und als Bild eingebettet werden.
Hyperlinks können auch mit Target versehen werden Ecosia, wenn man html syntax verwendet

Quelltext

Hyperlinks können als [Text](/markdown-Hilfe) und als Bild [![Bild mit 16x16 Pixel](/site/baukasten.png =16x)](/markdown-Hilfe) eingebettet werden.
Hyperlinks können auch mit Target versehen werden <a href="https://www.ecosia.org" target="_blank">Ecosia</a>, wenn man html syntax verwendet

Liste (Aufgaben)

Vorschau

Dieser Listeneintrag ist abgeschlossen.
Dieser Listeneintrag ist noch zu erledigen.

Quelltext

- [X] Dieser Listeneintrag ist abgeschlossen.
- [ ] Dieser Listeneintrag ist noch zu erledigen.

Liste (Nummerierung)

Vorschau

Erster Eintrag
Zweiter Eintrag
Dritter Eintrag

Quelltext

1. Erster Eintrag
1. Zweiter Eintrag
1. Dritter Eintrag

Anmerkungen

Es reicht, die Nummerierung durchgehend für alle Einträge mit 1. zu versehen.
Beim Seitenaufbau wird die Nummerierung automatisch in der erfassten Reihenfolge korrigiert und durchgezählt.

Liste (ohne Nummerierung)

Vorschau

Hier ein Beispiel einer einfachen Liste:

Ein einfaches Listenelement.
Noch ein weiteres einfaches Listenelement.
Und noch ein einfaches Listenelement.

Hier ein Beispiel einer Liste mit Gitter:

Ein Gitter-Element.
Noch ein weiteres Gitter-Element.
Und noch ein Gitter-Element.

Hier ein Beispiel einer speziell formatierten Liste für Hyperlinks:

Quelltext

Hier ein Beispiel einer einfachen Liste:
- Ein einfaches Listenelement.
- Noch ein weiteres einfaches Listenelement.
- Und noch ein einfaches Listenelement.

Hier ein Beispiel einer Liste mit Gitter:
- Ein Gitter-Element.
- Noch ein weiteres Gitter-Element.
- Und noch ein Gitter-Element.
{.grid-list}

Hier ein Beispiel einer speziell formatierten Liste für Hyperlinks:
- [Ein Hyperlink *mit Beschreibung*](/markdown-Hilfe)
- [Noch ein weiterer Hyperlink *mit zusätzlicher Beschreibung*](/markdown-Hilfe)
- [Und noch ein Hyperlink *ebenfalls mit Beschreibung*](/markdown-Hilfe)
{.links-list}

Quelltext

Vorschau

Dieser Text enthält eine Inline-Quelltext-Formatierung.

Dieser ganze Textblock ist als Quelltext formatiert.

Beispiel mit Syntax-Highlighting:

public static void Main(string[] args)
{
		Environment.Exit(0);
}

Quelltext

Dieser Text enthält eine `Inline`-Quelltext-Formatierung.

```
Dieser ganze Textblock ist als Quelltext formatiert.
```

Beispiel mit Syntax-Highlighting:

```csharp
public static void Main(string[] args)
{
		Environment.Exit(0);
}
```

Spoiler

Vorschau

Achtung: Spoiler

Dies ist ein Spoiler-Text.

Quelltext

<details>
  <summary>Achtung: Spoiler</summary>
  Dies ist ein Spoiler-Text.
</details>

Tabelle

Vorschau

Bezeichnung	Typ	Wert
Erstes Element	Erster	1600
Zweites Element	Zweiter	12
Drittes Element besonders viel text führt nicht zu Problemen	Dritter hier auch	1

Quelltext

| Bezeichnung     | Typ     | Wert |
|:--------------- |:-------:| ----:|
| Erstes Element  | Erster  | 1600 |
| Zweites Element | Zweiter |   12 |
| Drittes Element <br> besonders viel text führt **nicht** zu Problemen  | Dritter <br> hier auch |    1 |

Tabs

Vorschau

Die Tabs, welche hier auf der ganzen Seite schon zu sehen sind, sollten als Beispiel gut dienen.

Quelltext

## Tabs {.tabset}

### Vorschau

Die Tabs, welche hier auf der ganzen Seite schon zu sehen sind, sollten als Beispiel gut dienen.

### Quelltext

```markdown
TEXT
```

Anmerkungen

Die Tabs können nur verwendet werden, wenn die entsprechenden Überschriften genutzt werden.
Wie im Beispiel zu sehen, muss bei einer übergeordneten Überschrift das {.tabset}-Element angehängt werden.
Für jeden Tab muss dann eine Stufe tiefer eine entsprechende Überschrift angegeben werden, welche als Tab-Bezeichnung dienen.

Tastatursymbole

Vorschau

Tastensymbole können zur Verbesserung von Dokumentationen und Anleitungen auch gerendert werden:

CTRL + X um einen Inhalt auszuschneiden.
CTRL + C um einen Inhalt zu kopieren.
CTRL + V um einen Inhalt einzufügen.

Quelltext

Tastensymbole können zur Verbesserung von Dokumentationen und Anleitungen auch gerendert werden:

<kbd>CTRL</kbd> + <kbd>X</kbd> um einen Inhalt auszuschneiden.
<kbd>CTRL</kbd> + <kbd>C</kbd> um einen Inhalt zu kopieren.
<kbd>CTRL</kbd> + <kbd>V</kbd> um einen Inhalt einzufügen.

Textformatierung

Vorschau

Dieser Text ist fett.

Dieser Text ist kursiv.

Dieser Text ist unterstrichen.

Dieser Text ist ~~durchgestrichen~~.

Dieser Text ist ^hochgestellt.

Dieser Text ist _tiefgestellt.

Quelltext

Dieser Text ist **fett**.

Dieser Text ist *kursiv*.
Dieser Text ist _kursiv_.

Dieser Text ist <ins>unterstrichen</ins>.
Dieser Text ist <u>unterstrichen</u>.

Dieser Text ist ~~durchgestrichen~~.

Dieser Text ist ^hochgestellt^.

Dieser Text ist ~tiefgestellt~.

Tastenkombination

CTRL + B für fett.
CTRL + I für kursiv.

Überschriften

Vorschau

Die Überschriften werden auf dieser Seite ebenfalls schon sehr häufig verwendet.

Durch Verwendung von # kann die Stufe der Überschrift bestimmt werden. Je weniger #, desto höher die Stufe und umgekehrt.
Die Syntax kann im Quelltext-Tab entsprechend überprüft werden.

Alternativ kann auch unter der Überschrift = oder - eingefügt werden.

Quelltext

# Überschrift der 1. Stufe
## Überschrift der 2. Stufe
### Überschrift der 3. Stufe
#### Überschrift der 4. Stufe
##### Überschrift der 5. Stufe
###### Überschrift der 6. Stufe

####### Dies ist keine Überschrift mehr.

Dies ist eine alternative Schreibweise für eine Überschrift der 1. Stufe
==

Dies ist eine alternative Schreibweise für eine Überschrift der 2. Stufe
--

Weiteres

Es gibt noch weitere Funktionen, welche noch nachdokumentiert werden müssen oder durch Plugins geliefert werden.

Wiki.js unterstützt die vollständige Syntax von Markdown.
Daher sollten auch Funktionen, die hier nicht beschrieben sind, funktionieren (z.B. das Einbetten von Youtube-Videos, etc.).

Spielwiese:

graph TD;
    USB_Platte-->Noch_nie_für_backup_verwendet;
    USB_Platte-->Bereits_für_backup_vorbereitet;
    Noch_nie_für_backup_verwendet-->Als_LUKS_DEVICE_initialisieren;
    Bereits_für_backup_vorbereitet -->diskmount.sh_starten;
    Als_LUKS_DEVICE_initialisieren-->diskmount.sh_starten;
diskmount.sh_starten-->backup2usb;
backup2usb -->diskmount.sh_starten;

Dies ist die 1. Fussnotiz. ↩︎
Dies ist die 2. Fussnotiz DEr Autor dieser Syntax Beschreibung ist
SDXC. ↩︎