コードブロックの作成と強調表示

フェンスされたコードブロック

三連バッククォート ``` をコードブロック前後に入力すると、フェンスされたコードブロックを作成できます。ソースコードを読みやすくするために、コードブロックの前後に空の行を入れることをお勧めします。

```
function test() {
  console.log("notice the blank line before this function?");
}
```

3 重のバッククォートによってコードブロックが未加工の形式でレンダリングされることを示す、GitHub Markdown をレンダリングしたスクリーンショット。ブロックは "function test() {" で始まっています。

参考: リスト内でフォーマットを保持するために、フェンスされていないコードブロックをスペース 8 つでインデントします。

フェンスされたコードブロックの中に 3 重のバッククォートを表示するには、4 重のバッククォートで囲みます。

````
```
Look! You can see my backticks.
```
````

4 重のバッククォートが、コードブロックを囲む 3 重のバッククォートをそのまま表示することを示す、GitHub Markdown をレンダリングしたスクリーンショット。このブロックには、「ほら! バッククォートが見えますよ」と書かれています。

コードスニペットとテーブルを頻繁に編集する場合は、GitHub Enterprise Cloud のすべてのコメントフィールドで固定幅フォントを有効にするとメリットが得られる可能性があります。詳しくは、「GitHub 上での執筆とフォーマットについて」を参照してください。

言語識別子を追加して、コードブロックの構文を強調表示することができます。

構文の強調表示は、ソースコードの色やスタイルを変えて読みやすくするものです。

たとえば、Ruby コードの構文を強調表示するには:

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```

これは、コードブロックを構文強調表示で表示します。

GitHub に表示された 3 行の Ruby コードのスクリーンショット。コードの要素が紫、青、赤の文字で表示され、より視覚的に読み取りやすくなっています。

Linguist を使って言語検出を行い、サードパーティの文法を選んで構文の強調表示を行います。どのキーワードが有効かは、languages YAML ファイルで確認できます。

コードブロックを使って Markdown でダイアグラムを作成することもできます。 GitHub は、Mermaid、GeoJSON、TopoJSON、ASCII STL 構文をサポートしています。詳しくは、「ダイアグラムの作成」を参照してください。