DotMDMarkdownでコードブロックを書くには：バッククォート3つで囲む。
コードブロックは、空白をそのまま保ち、等幅フォントで表示され、言語名を付けるとシンタックスの色も付きます。ここではフェンスの構文、言語名、コード自体にバッククォートが含まれるときの対処を説明します。
macOS 14以降。閲覧は無料で、編集とレビューは1回のお支払いです。
要点
コードの前の行と後ろの行に、バッククォートを3つ置きます。開きのバッククォートの直後に言語名を書くと、シンタックスハイライトが有効になります。文中のコードは、バッククォート1つで囲みます。
```swift
let greeting = "Hello"
print(greeting)
```·
フェンス付きコードブロック
フェンスは、バッククォート3つ以上が並ぶ行です。ブロックは、同じ長さ以上のフェンスの行で終わります。間にあるものはすべて入力のまま表示され、太字もリンクも行の連結も起こりません。
```
plain text, no colors
indentation is kept
```バッククォートの代わりに、チルダ3つも使えます。~~~で開き、~~~で閉じます。2種類は混ぜられないので、チルダで開いたブロックはチルダで閉じます。各行を4スペースでインデントしてもコードブロックになりますが、これは古い書き方で、言語名を付けられないため、フェンスのほうがおすすめです。
言語名とシンタックスハイライト
開きのフェンスの後ろの単語は情報文字列（info string）と呼ばれます。ほとんどのアプリは、これでハイライターを選びます。
```json
{ "name": "dotmd", "private": true }
```GitHub、DotMD、ほとんどのアプリで使える一般的な名前：
jsまたはjavascript、tsまたはtypescript、python、swift、go、rust- シェルのコマンドには
bash、sh、zsh json,yaml,html,css,sql- Markdown自体を見せるには
markdownまたはmd、変更にはdiff、色を付けないならtext
使える名前の一覧は、アプリとそのハイライターによって異なります。アプリが知らない名前でもエラーにはならず、色なしで表示されるだけです。言語を付けないブロックも、色なしで表示されます。
コードブロックの中にバッククォートを表示する
コードの中にバッククォート3つの行があるときは、より長いフェンスで囲みます。閉じのフェンスは開きと同じかそれ以上の長さが必要なので、3つを表示するには4つを使います。
````markdown
```swift
let x = 1
```
````このページがコードブロックを含むMarkdownの例を表示しているのは、この方法です。チルダのフェンスも同様で、~~~~で開いたブロックの中には~~~を含められます。
インラインコード
文中のコマンドや名前は、バッククォート1つで囲みます：`npm install`はnpm installになります。バッククォートそのものを表示するには、全体をバッククォート2つで囲み、コードがバッククォートで始まる、または終わるときは内側にスペースを入れます。
``a `tick` inside``インラインコードは、*や_のような文字が書式として解釈されるのも防ぐので、ファイル名や変数名に最適です。
リストや引用の中のコード
フェンス付きブロックはリスト項目の中に置けます。項目の本文の位置に合わせてフェンスをインデントすると、項目の一部のままになります。
1. Install the tool:
```bash
brew install example
```
2. Run it.フェンスの前に空行を入れ、コードのすべての行を同じ量だけインデントしてください。引用ブロックの中では、フェンスの各行を>で始めます。
diffブロック
ブロックにdiffと付けると、GitHubを含むdiffをハイライトするアプリで、+や-で始まる行が緑と赤で表示されます。
```diff
- let timeout = 30
+ let timeout = 60
```スクリーンショットなしで、ドキュメントやREADME、仕様の中の変更を示すのに便利な方法です。
よくある間違い
- 閉じのフェンスが開きより短い。ブロックが終わらず、ページの残りを飲み込みます。
- 厳密なアプリで言語名の前にスペースがある。色が付かないときは、
``` jsではなく```jsと書きます。 - 1つのブロックでバッククォートとチルダを混ぜる。
- アプリによっては、リスト項目や段落のあとにフェンスの前の空行がない。空行を入れてください。
- スマート引用符。ワープロから貼り付けると、コード中の直線の引用符が曲線の引用符に変わることがあります。プレーンテキストとして貼り付けてください。
コードを見せるためではないフェンスもあります。mermaidと付けたブロックは、構文が正しければ、GitHubやDotMDで図として描かれます。
色を確認する
言語名を試すいちばん手早い方法は、ファイルをリーダーで開くことです。DotMDはhighlight.jsでフェンス付きブロックに色を付け、ライトテーマでもダークテーマでも表示し、ブロックにカーソルを重ねるとCopyボタンが現れます。閲覧は無料で、そのほかの構文はMarkdownチートシートに1ページでまとめてあります。
Markdownのコードブロックに関するよくある質問
Markdownでコードブロックを作るには？
コードの前の行と後ろの行にバッククォート3つを置き、必要なら開きのバッククォートの後ろに言語名を書きます。4スペースのインデントでも作れますが、言語名は付けられません。
Markdownのコードブロックにシンタックスハイライトを付けるには？
開きのフェンスのすぐ後ろに言語名を書きます。例：```python。色はアプリが選びます。アプリが知らない名前なら、色なしで表示されます。
Markdownのコードブロックの中にバッククォートを入れるには？
中にあるものより長いフェンスでブロックを開閉します。たとえば、バッククォート3つを含むコードなら、4つで囲みます。バッククォートを1つ含むインラインコードには、バッククォート2つを使います。
```と~~~の違いは？
ブロックの見た目に違いはありません。どちらもフェンスですが、ブロックは開いたときと同じ文字で閉じる必要があります。