DotMDSo schreibst du einen Codeblock in Markdown:mit drei Backticks umzäunen.
Ein Codeblock behält deine Abstände, nutzt eine Festbreitenschrift und bekommt mit einem Sprachnamen Syntaxfarben. Hier siehst du die Fence-Syntax, die Sprachangaben und was zu tun ist, wenn der Code selbst Backticks enthält.
macOS 14 oder neuer. Lesen ist kostenlos; Bearbeiten und Reviews kaufst du einmalig.
Kurze Antwort
Setze drei Backticks in die Zeile vor und nach dem Code. Schreibe die Sprache direkt hinter die öffnenden Backticks, um die Syntaxhervorhebung einzuschalten. Code mitten im Satz setzt du in einzelne Backticks.
```swift
let greeting = "Hello"
print(greeting)
```·
Fenced Codeblöcke
Ein Fence ist eine Zeile aus mindestens drei Backticks, und der Block endet mit einer Zeile mindestens derselben Länge. Alles dazwischen wird so angezeigt, wie es getippt wurde: kein Fettdruck, keine Links, kein Zusammenfügen von Zeilen.
```
plain text, no colors
indentation is kept
```Du kannst stattdessen drei Tilden nehmen: ~~~ öffnet und ~~~ schließt. Die beiden Arten lassen sich nicht mischen, ein mit Tilden geöffneter Block muss also mit Tilden enden. Auch ein Einrücken jeder Zeile um vier Leerzeichen ergibt einen Codeblock, der ältere Stil, aber er kann keinen Sprachnamen tragen, deshalb sind Fences die bessere Wahl.
Sprachangaben und Syntaxhervorhebung
Das Wort nach dem öffnenden Fence ist der Info-String. Die meisten Apps wählen damit einen Highlighter:
```json
{ "name": "dotmd", "private": true }
```Gängige Namen, die in GitHub, DotMD und den meisten anderen Apps funktionieren:
jsoderjavascript,tsodertypescript,python,swift,go,rustbash,shoderzshfür Shell-Befehlejson,yaml,html,css,sqlmarkdownodermd, um Markdown selbst zu zeigen,difffür Änderungen,textfür keine Farben
Die genaue Liste der Namen hängt von der App und ihrem Highlighter ab. Ein Name, den die App nicht kennt, ist kein Fehler: Der Block erscheint nur ohne Farben. Auch ein Block ohne Sprache wird schlicht angezeigt.
Backticks in einem Codeblock zeigen
Enthält der Code eine Zeile mit drei Backticks, umzäune ihn mit mehr. Der schließende Fence muss mindestens so lang sein wie der öffnende, nimm also vier, um drei zu zeigen:
````markdown
```swift
let x = 1
```
````So zeigt diese Seite Markdown-Beispiele, die Codeblöcke enthalten. Tilde-Fences funktionieren genauso: Ein mit ~~~~ geöffneter Block kann ~~~ enthalten.
Inline-Code
Für einen Befehl oder einen Namen mitten im Satz setze ihn in einzelne Backticks: `npm install` ergibt npm install. Um einen Backtick zu zeigen, setze das Ganze zwischen doppelte Backticks und füge innen ein Leerzeichen hinzu, wenn der Code mit einem Backtick beginnt oder endet:
``a `tick` inside``Inline-Code verhindert außerdem, dass Zeichen wie * und _ als Formatierung gelesen werden, und ist damit das richtige Mittel für Dateinamen und Variablen.
Code in Listen und Zitaten
Ein Fenced Block kann in einem Listeneintrag stehen. Rücke den Fence passend zum Text des Eintrags ein, damit er Teil des Eintrags bleibt:
1. Install the tool:
```bash
brew install example
```
2. Run it.Lass vor dem Fence eine Leerzeile und rücke jede Codezeile gleich weit ein. In einem Blockzitat beginnst du jede Zeile des Fence mit >.
diff-Blöcke
Markiere einen Block mit diff, und Zeilen, die mit + oder - beginnen, erscheinen in Apps, die Diffs hervorheben, grün und rot, auch auf GitHub:
```diff
- let timeout = 30
+ let timeout = 60
```So zeigst du bequem eine Änderung in einem Dokument, einer README oder einer Spec, ohne Screenshots.
Häufige Fehler
- Ein schließender Fence, der kürzer ist als der öffnende, sodass der Block nie endet und den Rest der Seite verschluckt.
- Leerzeichen vor der Sprachangabe in strengen Apps. Schreibe
```js, nicht``` js, wenn keine Farben erscheinen. - Backticks und Tilden mischen in einem Block.
- Keine Leerzeile vor dem Fence nach einem Listeneintrag oder Absatz in manchen Apps. Füge eine ein.
- Typografische Anführungszeichen. Aus einem Textverarbeitungsprogramm eingefügter Text kann gerade Anführungszeichen im Code in typografische verwandeln. Füge ihn als reinen Text ein.
Manche Fences dienen nicht dazu, Code zu zeigen. Ein mit mermaid markierter Block wird von GitHub und von DotMD als Diagramm gezeichnet, solange die Syntax gültig ist.
Die Farben prüfen
Am schnellsten testest du eine Sprachangabe, indem du die Datei in einem Reader öffnest. DotMD färbt Fenced Blöcke mit highlight.js im hellen und im dunklen Erscheinungsbild ein und zeigt eine Copy-Schaltfläche, wenn du mit der Maus über einen Block fährst. Lesen ist kostenlos, und der Markdown-Spickzettel hat den Rest der Syntax auf einer Seite.
Fragen zu Codeblöcken in Markdown
Wie erstelle ich in Markdown einen Codeblock?
Setze drei Backticks in die Zeile vor und nach dem Code und, wenn du willst, den Sprachnamen hinter die öffnenden Backticks. Auch vier Leerzeichen Einrückung funktionieren, tragen aber keine Sprache.
Wie füge ich einem Markdown-Codeblock Syntaxhervorhebung hinzu?
Schreibe die Sprache direkt hinter den öffnenden Fence, zum Beispiel ```python. Die App wählt die Farben; ein Name, den sie nicht kennt, zeigt einfachen Text.
Wie setze ich Backticks in einen Markdown-Codeblock?
Öffne und schließe den Block mit einem längeren Fence als alles darin, zum Beispiel vier Backticks um Code, der drei enthält. Nimm doppelte Backticks für Inline-Code, der einen enthält.
Was ist der Unterschied zwischen ``` und ~~~?
Keiner im Aussehen des Blocks. Beides sind Fences, aber ein Block muss mit demselben Zeichen enden, mit dem er geöffnet wurde.