コールアウトを使うことで、ノートの流れを中断せずに追加コンテンツを含めることができます。
コールアウトを作成するには、引用ブロックの最初の行に `[!info]` を追加します。ここで `info` は_タイプ識別子_です。タイプ識別子によってコールアウトの見た目と雰囲気が決まります。利用可能なすべてのタイプについては、[[#サポートされるタイプ]]を参照してください。コールアウトは[[Obsidian Publishの概要|Obsidian Publish]]でもネイティブにサポートされています。
```markdown
> [!info] コールアウトタイトルの例
> コールアウトブロックです。
> **Markdown**、[[内部リンク|ウィキリンク]]、および[[ファイルの埋め込み|埋め込み]]をサポートしています！
> ![[Engelbart.jpg]]
```
> [!info] コールアウトタイトルの例
> コールアウトブロックです。
> **Markdown**、[[内部リンク|ウィキリンク]]、および[[ファイルの埋め込み|埋め込み]]をサポートしています！
> ![[Engelbart.jpg]]
デフォルトの `[!note]` コールアウトは、`コールアウトを挿入` [[コマンドパレット|コマンド]]を使って挿入できます。カーソルは自動的にコールアウト名のフィールドに配置されるので、デフォルトの名前を削除して新しい名前を入力してからコンテンツを編集できます。
既存のコンテンツをコールアウトで囲むには、テキスト（リスト、コードブロックなどを含む）を選択して `コールアウトを挿入` コマンドを実行します。選択したコンテンツが自動的にコールアウト内に囲まれます。
[[ビューと編集モード#ライブプレビュー|ライブプレビュー]]では、コールアウト名を右クリックしてコールアウトタイプを変更することもできます。
### タイトルを変更する
デフォルトでは、コールアウトのタイトルはタイプ識別子のタイトルケースになります。タイプ識別子の後にテキストを追加することで変更できます。
```markdown
> [!tip] コールアウトにはカスタムタイトルを付けられます
> このように。
```
> [!tip] コールアウトにはカスタムタイトルを付けられます
> このように。
本文を省略してタイトルのみのコールアウトを作成することもできます。
```markdown
> [!tip] タイトルのみのコールアウト
```
> [!tip] タイトルのみのコールアウト
### 折りたたみ可能なコールアウト
タイプ識別子の直後にプラス（`+`）またはマイナス（`-`）を追加することで、コールアウトを折りたたみ可能にできます。
プラス記号はデフォルトでコールアウトを展開し、マイナス記号はデフォルトで折りたたみます。
```markdown
> [!faq]- コールアウトは折りたたみ可能ですか？
> はい！折りたたみ可能なコールアウトでは、コールアウトが折りたたまれているときにコンテンツが非表示になります。
```
> [!faq]- コールアウトは折りたたみ可能ですか？
> はい！折りたたみ可能なコールアウトでは、折りたたまれているときにコンテンツが非表示になります。
### ネストされたコールアウト
コールアウトを複数のレベルでネストできます。
```markdown
> [!question] コールアウトはネストできますか？
> > [!todo] はい！ネストできます。
> > > [!example] 複数のレベルのネストも使えます。
```
> [!question] コールアウトはネストできますか？
> > [!todo] はい！ネストできます。
> > > [!example] 複数のレベルのネストも使えます。
### コールアウトのカスタマイズ
[[CSSスニペット]]や[[コミュニティプラグイン]]を使って、カスタムコールアウトを定義したり、デフォルトの設定を上書きしたりできます。
カスタムコールアウトを定義するには、以下の CSS ブロックを作成します。
```css
.callout[data-callout="custom-question-type"] {
--callout-color: 0, 0, 0;
--callout-icon: lucide-alert-circle;
}
```
`data-callout` 属性の値は使用したいタイプ識別子です。例えば `[!custom-question-type]` のように指定します。
- `--callout-color` は赤、緑、青の数値（0〜255）を使って背景色を定義します。
- `--callout-icon` には [lucide.dev](https://lucide.dev) のアイコン ID、または SVG 要素を指定できます。
> [!warning] lucide アイコンバージョンに関する注意
> Obsidian は定期的に Lucide アイコンをアップデートします。現在含まれているバージョンは以下の通りです。カスタムコールアウトではこれ以前のアイコンを使用してください。
> ![[クレジット#^lucide]]
> [!tip] SVG アイコン
> Lucide アイコンの代わりに、SVG 要素をコールアウトアイコンとして使用することもできます。
>
> ```css
> --callout-icon: '<svg>...custom svg...</svg>';
> ```
### サポートされるタイプ
いくつかのコールアウトタイプとエイリアスを使用できます。各タイプには異なる背景色とアイコンが設定されています。
これらのデフォルトスタイルを使用するには、例の `info` を任意のタイプに置き換えてください。例えば `[!tip]` や `[!warning]` のようにします。コールアウトタイプは、ライブプレビューモードでコールアウトを右クリックして変更することもできます。
[[#コールアウトのカスタマイズ]]をしない限り、サポートされていないタイプは `note` タイプがデフォルトで使用されます。タイプ識別子は大文字と小文字を区別しません。
> [!note]
> ```md
> > [!note]
> > Lorem ipsum dolor sit amet
> ```
---
> [!abstract]-
> ```md
> > [!abstract]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`summary`、`tldr`
---
> [!info]-
> ```md
> > [!info]
> > Lorem ipsum dolor sit amet
> ```
---
> [!todo]-
> ```md
> > [!todo]
> > Lorem ipsum dolor sit amet
> ```
---
> [!tip]-
> ```md
> > [!tip]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`hint`、`important`
---
> [!success]-
> ```md
> > [!success]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`check`、`done`
---
> [!question]-
> ```md
> > [!question]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`help`、`faq`
---
> [!warning]-
> ```md
> > [!warning]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`caution`、`attention`
---
> [!failure]-
> ```md
> > [!failure]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`fail`、`missing`
---
> [!danger]-
> ```md
> > [!danger]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`error`
---
> [!bug]-
> ```md
> > [!bug]
> > Lorem ipsum dolor sit amet
> ```
---
> [!example]-
> ```md
> > [!example]
> > Lorem ipsum dolor sit amet
> ```
---
> [!quote]-
> ```md
> > [!quote]
> > Lorem ipsum dolor sit amet
> ```
エイリアス：`cite`