Kapitel 7: Erweiterte Markdown-Syntax

In diesem Kapitel lernen Sie fortgeschrittene Markdown-Techniken und -Erweiterungen.

7.1 Fußnoten

Fußnoten sind nützlich für Referenzen und zusätzliche Informationen.

Grundlegende Syntax

Das ist ein Text mit einer Fußnote[^1].

Noch eine Fußnote[^2].

[^1]: Das ist der Inhalt der ersten Fußnote.
[^2]: Das ist der Inhalt der zweiten Fußnote.

Ergebnis:

• Fußnoten werden am Ende des Dokuments angezeigt
• Automatische Nummerierung

Inline-Fußnoten

Manche Dialekte unterstützen Inline-Fußnoten:

Das ist ein Text mit einer Fußnote^[Das ist der Inhalt der Fußnote.].

7.2 Abkürzungen (Abbreviations)

In einigen Markdown-Dialekten (z.B. Pandoc, MultiMarkdown):

Das ist HTML und CSS.

*[HTML]: HyperText Markup Language
*[CSS]: Cascading Style Sheets

7.3 Definitionen (Definition Lists)

Begriff 1
: Definition 1

Begriff 2
: Definition 2a
: Definition 2b

Ergebnis: Begriff 1 : Definition 1

Begriff 2 : Definition 2a : Definition 2b

7.4 Mathematische Formeln (MathJax/LaTeX)

Viele Markdown-Editoren und Static Site Generators unterstützen LaTeX-Mathematik:

Inline-Mathematik

Die Formel für die Energie ist $E = mc^2$.

Ergebnis: Die Formel für die Energie ist (E = mc^2).

Block-Mathematik

$$
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
$$

7.5 Diagramme (Mermaid, PlantUML)

Mermaid-Diagramme

Viele Tools (GitHub, GitLab, VS Code mit Erweiterung) unterstützen Mermaid:

```mermaid
graph TD
    A[Start] --> B{Entscheidung}
    B -->|Ja| C[Aktion 1]
    B -->|Nein| D[Aktion 2]
    C --> E[Ende]
    D --> E
```

Sequenzdiagramme

```mermaid
sequenceDiagram
    Alice->>Bob: Hallo Bob!
    Bob->>Alice: Hallo Alice!
```

7.6 Einbettungen (Embeds)

YouTube-Videos

Markdown unterstützt kein direktes Einbetten von Videos, aber Sie können HTML verwenden:

<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe>

CodePen-Einbettungen

<p data-height="265" data-theme-id="0" data-slug-hash="KWzLNE" data-default-tab="css,result" data-user="rfalor" data-embed-version="2" class="codepen"></p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

7.7 Metadaten (Front Matter)

Viele Static Site Generators (Jekyll, Hugo, VuePress) verwenden YAML Front Matter:

---
title: Meine Seite
author: Max Mustermann
date: 2024-01-15
tags: [markdown, tutorial, deutsch]
---

Inhalt nach dem Front Matter

# Meine Seite

Das ist der Inhalt...

7.8 Kommentare

Standard-Markdown unterstützt keine Kommentare. Aber Sie können HTML-Kommentare verwenden:

<!-- Das ist ein Kommentar, der nicht angezeigt wird -->

Kommentare in GFM

Bei GitHub können Sie Kommentare in Issues und Pull Requests mit:

<!--
Das ist ein mehrzeiliger Kommentar.
Er wird nicht angezeigt.
-->

7.9 Benutzerdefinierte Container (bei manchen Dialekten)

In VuePress oder ähnlichen Tools:

::: tip
Das ist ein Tipp!
:::

::: warning
Das ist eine Warnung!
:::

::: danger
Das ist eine Gefahr!
:::

7.10 Attribute (bei manchen Dialekten)

![Bild](bild.jpg){ width=50% }

Oder:

# Überschrift {.custom-class}

7.11 Zusammenfassung

In diesem Kapitel haben Sie gelernt:

• ✅ Fußnoten für Referenzen
• ✅ Mathematische Formeln mit LaTeX
• ✅ Diagramme mit Mermaid
• ✅ Einbettungen (YouTube, CodePen)
• ✅ Metadaten (Front Matter)
• ✅ Kommentare und benutzerdefinierte Container

Im nächsten Kapitel werden wir lernen, wie man Markdown in Kombination mit Pandoc für verschiedene Exportformate nutzt!

---

Übung: Erstellen Sie eine wissenschaftlich.md Datei mit:

1. Einem mathematischen Satz (LaTeX)
2. Einer Fußnote
3. Einem Mermaid-Diagramm (Flussdiagramm)
4. Metadaten im Front Matter