# インラインコンテンツ

<figure><img src="/files/bec7f1a829a0f207a163d28ae19729dd44350498" alt="A GitBook screenshot showing inline content options"><figcaption><p>コンテンツにインライン要素を追加します。</p></figcaption></figure>

インラインパレットを使うと、キーボードから手を離さずにテキストブロックへ追加コンテンツをすばやく挿入できます。 `/` を任意のテキストブロックで押すと、インラインパレットが開きます。スラッシュは、挿入するために選んだコンテンツに置き換えられます。

## 注釈

注釈を使うと、読者の思考の流れを妨げることなく、言葉に追加の文脈を加えられます。単語の意味を説明したり、補足情報を挿入したり、さまざまな用途に使えます。読者は注釈付きテキストにカーソルを合わせると、テキストの上に注釈を表示できます。

### 注釈を作成する

注釈を作成するには、注釈を付けたいテキストを選択し、 **注釈を付ける** オプションをコンテキストメニューでクリックします。注釈を書いたら、その外側をクリックしてテキストブロックでの入力を続けます。

### Markdown 表記

コンテンツを [Markdown の脚注](https://www.markdownguide.org/extended-syntax/#footnotes) として記述すると、GitBook で注釈として追加できます。脚注インジケーターは注釈を付けたい単語の直後に置く必要があり、句読点やその他の記号の後に置いてはいけません。

```markdown
これはシンプルな脚注[^1]です。こちらは長めの脚注[^bignote]です。

[^1]: これは最初の脚注です。

[^bignote]: これは複数の段落とコードを含むものです。

    脚注に含めるには段落をインデントしてください。

    `{ my code }`

    段落はいくつでも追加できます。
```

## 画像

インライン画像は、ページ上でテキストと並んで表示されます。

デフォルトでは、画像は元のサイズのままで最大幅 300px に設定されています。サイズを変更するには、画像をクリックして書式設定パレットを開き、次の 3 つのオプションのいずれかを選択します。

1. **インラインサイズ:** 画像はフォントに合わせて比例的にサイズ変更されます。アイコンやバッジに最適です。
2. **元のサイズ:** 画像は元のサイズのままインライン表示され、最大幅は 300 ピクセルです。
3. **ブロックに変換:** これにより、インライン画像が [画像ブロック](/docs/documentation/ja-gitbook-documentation/creating-content/blocks/insert-images.md)に変わり、コンテンツと同じ幅になります。

{% hint style="info" %}
[画像ブロック](/docs/documentation/ja-gitbook-documentation/creating-content/blocks/insert-images.md) では、より多くのサイズ指定やキャプション追加など、さらに多くのオプションを利用できますが、テキストとインラインでは表示されません。
{% endhint %}

### Markdown での表現

{% code overflow="wrap" %}

```markdown
これはインライン画像です: <img src=".gitbook/assets/GitBook - Dark.jpg" alt="GitBook ロゴのダークバージョン" data-size="line">
```

{% endcode %}

## 絵文字

を押してインラインパレットを開くと、絵文字を追加できます。 `/` または、 `:` と入力すると、絵文字の一覧がその場に直接表示されます。絵文字名を入力し始めると候補を絞り込めます。

### Markdown での表現

{% code overflow="wrap" %}

```markdown
:house:
:car:
:dog:
```

{% endcode %}

## リンク

3 種類のリンクを挿入できます:

* [相対リンク](#relative-links)
* [絶対リンク](#absolute-links)
* [メールアドレス `mailto` リンク](#email-address-mailto-links)

### 相対リンク

相対リンクは、 [ページ](/docs/documentation/ja-gitbook-documentation/creating-content/content-structure/page.md) すでにスペース内に存在するページへリンクして作成するリンクです。相対リンクを使う利点は、ページの URL、名前、または場所が変更されても参照が最新の状態に保たれることです。つまり、リンク切れが少なくなります。

相対リンクを挿入する方法は次のとおりです:

1. リンクを挿入したい段落内の場所をクリックするか、テキストを選択します。
2. インラインパレットを開くために / を押して Link を選ぶか、 **リンク** ボタンをコンテキストメニューでクリックするか、 **⌘ + K**.
3. リンクしたいページのタイトルを入力し始めます。
4. ドロップダウン検索結果からページを選択します。
5. 押す `Enter`.

### 絶対リンク

絶対リンクは、コンテンツにコピー＆ペーストできる外部リンクです。ドキュメントの外にあるものへリンクしたいときに最適です。

絶対リンクを挿入するには:

1. リンクを挿入したい段落内の場所をクリックするか、テキストを選択します。
2. インラインパレットを開くために / を押して Link を選ぶか、 **リンク** ボタンをコンテキストメニューでクリックするか、 **⌘ + K**.
3. リンク先にしたい URL を貼り付けます。
4. 押す `Enter`.

{% hint style="info" %}
**なぜ外部リンクは新しいタブで開かないのですか？**

ドキュメント内で外部サイトへのリンクを追加すると、同じタブで開きます。

GitBook はこの [W3C 推奨の動作](https://www.w3.org/TR/WCAG20-TECHS/G200.html) に従って、 [アクセシビリティ](https://it.wisc.edu/learn/make-it-accessible/websites-and-web-applications/when-to-open-links-in-a-new-tab/) をサポートし、読者に一貫性があり包括的な体験を提供します。
{% endhint %}

### メールアドレスの mailto リンク

メールアドレス `mailto` リンクは、訪問者がクリックすると既定のメールクライアントが開き、 `宛先` 欄にリンク先のメールアドレスが入力されるようにしたい場合に便利です。これにより、メールを書いて送信できます。

メールアドレスの `mailto` リンクを挿入する方法は次のとおりです:

1. リンクを挿入したい段落内の場所をクリックするか、テキストを選択します。
2. インラインパレットを開くために / を押して Link を選ぶか、 **リンク** ボタンをコンテキストメニューでクリックするか、 **⌘ + K**.
3. 貼り付けるか入力します `mailto:something@address.com`、ここで `something@address.com` を使用したいメールアドレスに置き換えます。
4. 押す `Enter`.

### Markdown での表現

```markdown
[これはこのスペース内の別のページへの相対リンクです](../content-structure/page.md)
[これは絶対リンクです](https://www.gitbook.com/blog)
[これはリンクです](mailto:support@gitbook.com)。サポート用メールアドレスへのリンクです
```

## 数式 & TeX

このオプションを使うと、コンテンツ内に次のようなインライン数式を作成できます: $$f(x) = x \* e^{2 pi i \xi x}$$。数式のレンダリングには [KaTeX](https://katex.org/docs/supported.html) ライブラリを使用しています。

{% hint style="info" %}
また、 [ブロックレベルの数式](/docs/documentation/ja-gitbook-documentation/creating-content/blocks/math-and-tex.md) を、空のブロックでコマンドパレットを開き、2 つ目の Math & TeX オプションを選ぶことで挿入することもできます。
{% endhint %}

### Markdown での表現

```markdown
# 数式と TeX ブロック

$$f(x) = x * e^{2 pi i \xi x}$$
```

## ボタン

ボタンは、行動喚起を目立たせたり、ドキュメントに検索バーや Ask AI バーを追加したりするのに最適な方法です。読者をどこかへ誘導したり、答えを見つける手助けをしたりできます。

### ボタンのアクション

ボタンは URL へのリンク以上のことができます。ページ上から直接、ボタンを検索バーや GitBook Assistant への質問バーにすることもできます。これらのアクションは公開ページでも機能します。以下の例で確認できます

次のアクションを設定できます:

#### **リンクボタンを追加する**

読者を別のページまたは外部 URL に送る:<a href="/pages/d74007c5891dbdec7feb5c3c8732f5a684aa5e91" class="button primary" data-icon="gitbook-assistant">Assistant について詳しく知る</a>

#### **検索バーを追加する**

任意の事前設定クエリで検索を開く: <button type="button" class="button primary" data-action="search" data-icon="magnifying-glass">検索...</button>

#### **Ask AI/GitBook Assistant バーを追加する**

開く [GitBook Assistant](/docs/documentation/ja-gitbook-documentation/ai-to/gitbook-ai-assistant.md) 任意の事前設定プロンプト付きで: <button type="button" class="button primary" data-action="ask" data-icon="gitbook-assistant">質問する...</button>

#### **無効なボタンを追加する**

意図的に無効化されたボタンを表示する:<a class="button primary">無効なボタン</a>

### ボタンを作成して設定する

1. 入力します `/` を選択し、 **Button**.
2. ボタンをクリックして **ラベル** メニューを開きます。
3. アクションを選び、ラベルとスタイルを設定します。
4. 任意: 事前設定の検索クエリまたは Assistant プロンプトを追加します。

### スタイル

リンクボタンと無効ボタンには、どちらもプライマリとセカンダリのスタイルがあります。以下にいくつか例を示します:

<a href="https://app.gitbook.com/join" class="button primary">GitBook にサインアップ</a> <a href="#annotations" class="button secondary">トップへ移動</a>

### Markdown での表現

```markdown
<a href="https://app.gitbook.com" class="button primary">GitBook</a>
```

## アイコン

アイコンを使うと、サイトに追加の視覚的な目印を加えられます。段落内にインラインで追加したり、カードの中に入れたり、その他アクセントを加えたい場所ならどこにでも追加できます。見た目は [カスタマイズ設定](/docs/documentation/ja-gitbook-documentation/docs-site/customization/icons-colors-and-themes.md).

<i class="fa-facebook">:facebook:</i> <i class="fa-github">:github:</i> <i class="fa-x-twitter">:x-twitter:</i> <i class="fa-instagram">:instagram:</i>

で定義されたビジュアルスタイルを使用します。訪問する [Font Awesome](https://fontawesome.com/) で利用可能なさまざまなアイコンを確認してください。

### Markdown での表現

```markdown
<i class="fa-github">:github:</i>
```

## 式

式を使うと、 [変数](/docs/documentation/ja-gitbook-documentation/creating-content/variables-and-expressions.md)で定義されたコンテンツを動的に表示できます。式は `/` メニューから挿入できます。挿入後に式をクリックすると式エディターが開き、変数を参照して [条件付きで書式設定](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_operator) できます。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/formatting/inline.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
