Markdown
Hugoは、テキストのフォーマットやリストの作成などにMarkdown構文をサポートしています。このページでは、最も一般的なMarkdown構文の例をいくつか紹介します。
Markdownの例
テキストのスタイル
スタイル | 構文 | 例 | 出力 |
---|---|---|---|
太字 | **太字テキスト** | **太字テキスト** | 太字テキスト |
斜体 | *斜体テキスト* | *斜体テキスト* | 斜体テキスト |
取り消し線 | ~~取り消し線テキスト~~ | ~~取り消し線テキスト~~ | |
下付き文字 | <sub></sub> | これは<sub>下付き文字</sub>です | これは下付き文字です |
上付き文字 | <sup></sup> | これは<sup>上付き文字</sup>です | これは上付き文字です |
ブロッククォート
引用元付きのブロッククォート
メモリを共有してコミュニケーションするのではなく、コミュニケーションしてメモリを共有せよ。
— ロブ・パイク1
Markdown
> メモリを共有してコミュニケーションするのではなく、コミュニケーションしてメモリを共有せよ。<br>
> — <cite>ロブ・パイク[^1]</cite>
[^1]: 上記の引用は、2015年11月18日のGopherfestでのロブ・パイクの[講演](https://www.youtube.com/watch?v=PAAkCSZUG1c)から抜粋したものです。
アラート
アラートは、ブロッククォート構文に基づくMarkdown拡張で、重要な情報を強調するために使用できます。 GitHubスタイルのアラートがサポートされています。 Hextraの最新バージョンとHugo v0.134.0以降を使用していることを確認してください。
Note
ユーザーが知っておくべき有用な情報で、内容をざっと見る際にも役立ちます。
Tip
物事をより良く、または簡単に行うための役立つアドバイス。
Important
ユーザーが目標を達成するために知っておくべき重要な情報。
Warning
問題を避けるために即座にユーザーの注意を引く必要がある緊急の情報。
Caution
特定のアクションのリスクやネガティブな結果についてのアドバイス。
Markdown
> [!NOTE]
> ユーザーが知っておくべき有用な情報で、内容をざっと見る際にも役立ちます。
> [!TIP]
> 物事をより良く、または簡単に行うための役立つアドバイス。
> [!IMPORTANT]
> ユーザーが目標を達成するために知っておくべき重要な情報。
> [!WARNING]
> 問題を避けるために即座にユーザーの注意を引く必要がある緊急の情報。
> [!CAUTION]
> 特定のアクションのリスクやネガティブな結果についてのアドバイス。
テーブル
テーブルはMarkdownのコア仕様には含まれていませんが、Hugoはデフォルトでサポートしています。
名前 | 年齢 |
---|---|
ボブ | 27 |
アリス | 23 |
Markdown
| 名前 | 年齢 |
|--------|------|
| ボブ | 27 |
| アリス | 23 |
テーブル内のインラインMarkdown
斜体 | 太字 | コード |
---|---|---|
斜体 | 太字 | コード |
Markdown
| 斜体 | 太字 | コード |
| -------- | -------- | ------ |
| *斜体* | **太字** | `コード` |
コードブロック
リスト
順序付きリスト
- 最初の項目
- 2番目の項目
- 3番目の項目
Markdown
1. 最初の項目
2. 2番目の項目
3. 3番目の項目
順序なしリスト
- リスト項目
- 別の項目
- さらに別の項目
Markdown
* リスト項目
* 別の項目
* さらに別の項目
ネストされたリスト
- 果物
- りんご
- オレンジ
- バナナ
- 乳製品
- 牛乳
- チーズ
Markdown
* 果物
* りんご
* オレンジ
* バナナ
* 乳製品
* 牛乳
* チーズ
画像
Markdown
![風景](https://picsum.photos/800/600)
キャプション付き:
Markdown
![風景](https://picsum.photos/800/600 "Unsplashの風景")
設定
HugoはMarkdownの解析にGoldmarkを使用しています。
Markdownのレンダリングは、hugo.yaml
のmarkup.goldmark
で設定できます。
以下はHextraのデフォルト設定です:
hugo.yaml
markup:
goldmark:
renderer:
unsafe: true
highlight:
noClasses: false
その他の設定オプションについては、HugoのドキュメントConfigure Markupを参照してください。
学習リソース
最終更新日