> For the complete documentation index, see [llms.txt](https://docs.maiagent.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.maiagent.ai/maiagent-user-guide/ja/build/tools/quick-menu.md).

# クイックメニュー

Web Chat の入力バーに常時表示されるクイックメニューを作成し、訪問者がワンクリックでメッセージの送信、テキストの挿入、リンクの表示を行えるようにします

クイックメニューは Agent UI の一種です。Web Chat の入力バーに常時表示され、訪問者はテキストを入力せずに、2–6 個のメニュー項目から操作を始められます。各項目では、メッセージの送信、入力欄へのテキストの挿入、外部リンクの表示ができます。

{% hint style="info" %}
クイックメニューは Web Chat にのみ表示されます。LINE、Microsoft Teams、管理画面のテスト会話など、ほかのプラットフォームには表示されません。
{% endhint %}

## 活用場面 <a href="#use-case" id="use-case"></a>

ある EC サイトでは、訪問者がサポートチャットを開いた直後に「注文状況の確認」「返品・交換」「サポートへの問い合わせ」を選べるようにしたいと考えています。管理者はクイックメニューを作成し、最初の 2 項目には対応する質問を送信する動作を、3 項目目には「サポートに問い合わせたいです」を入力欄に挿入する動作を設定します。訪問者は項目をクリックするだけで、質問の仕方に迷わず適切なサービスフローを開始できます。

## クイックメニューの作成 <a href="#create" id="create"></a>

{% stepper %}
{% step %} <mark style="color:blue;">AI 機能</mark> → <mark style="color:blue;">Agent UI</mark> に移動し、「追加」をクリックして <mark style="color:blue;">クイックメニュー</mark> を選択します。

<figure><img src="https://2584873290-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTvHx8hgwYGDTLD3A7xoW%2Fuploads%2Fgit-blob-228b5dbf7cbfe70339c1b2324c4e7ba2010b8bbf%2Fquick-menu-type-picker.png?alt=media" alt="Agent UI のタイプ選択ページにあるクイックメニューのカード"><figcaption><p>「クイックメニュー」を選択して設定を開始します</p></figcaption></figure>
{% endstep %}

{% step %} <mark style="color:blue;">表示名</mark>、<mark style="color:blue;">ツール名</mark>、任意の説明を入力します。ツール名は AI が使用するため、命名規則に従った英語の名前を使用してください。
{% endstep %}

{% step %} <mark style="color:blue;">外観</mark> でグリッド Grid またはリスト List を選択します。訪問者がチャットに入った直後にメニュー全体を表示する場合は、<mark style="color:blue;">デフォルトで展開</mark> を有効にします。
{% endstep %}

{% step %}
2–6 個のメニュー項目を設定し、各項目の動作を選択します。右側の <mark style="color:blue;">プレビュー</mark> に、Web Chat での表示がリアルタイムで反映されます。

<figure><img src="https://2584873290-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTvHx8hgwYGDTLD3A7xoW%2Fuploads%2Fgit-blob-4e19ed5e5d020b9243eb734e2d099b4052ac93b2%2Fquick-menu-editor.png?alt=media" alt="左側で基本情報、外観、メニュー項目を設定し、右側に Web Chat のプレビューを表示するクイックメニューエディター"><figcaption><p>クイックメニューエディターとリアルタイムプレビュー</p></figcaption></figure>
{% endstep %}

{% step %}
プレビューを確認し、右上の <mark style="color:blue;">保存</mark> をクリックします。
{% endstep %}
{% endstepper %}

## クイックメニューを Agent に追加 <a href="#attach-to-agent" id="attach-to-agent"></a>

クイックメニューは保存しただけでは Web Chat に表示されません。Agent モードを使用する Agent に追加する必要があります。

{% stepper %}
{% step %} <mark style="color:blue;">AI 機能</mark> → <mark style="color:blue;">AI アシスタント</mark> に移動し、クイックメニューを使用する Agent を開きます。
{% endstep %}

{% step %}
Agent の回答モードが <mark style="color:blue;">Agent モード</mark> になっていることを確認します。Agent モードでない場合は、「Agent UI」セクションにモードの切り替え案内が表示されます。
{% endstep %}

{% step %}
Agent の設定で <mark style="color:blue;">Agent UI</mark> をクリックし、<mark style="color:blue;">Agent UI を選択</mark> をクリックします。
{% endstep %}

{% step %}
作成したクイックメニューにチェックを入れて確定し、最後に Agent を保存します。この Agent の Web Chat を開き直すと、入力バーでクイックメニューを使用できます。
{% endstep %}
{% endstepper %}

## 3 種類の動作の違い <a href="#actions" id="actions"></a>

| 動作           | クリック後の結果                                      | 適した用途                     |
| ------------ | --------------------------------------------- | ------------------------- |
| **メッセージを送信** | 設定した prompt を AI に直接送信します。会話にはボタンのテキストが表示されます | よくある質問、定型のサービスフロー         |
| **入力欄に挿入**   | 入力欄にテキストを挿入し、訪問者が編集してから送信できます                 | 注文番号や質問の詳細を追加する必要がある場合    |
| **リンクを開く**   | 指定した URL を開きます                                | 公式サイト、フォーム、外部サービスのページへの移動 |

「メッセージを送信」では、ボタンのテキストと AI に送信する prompt を別々に設定できます。ただし、訪問者が見る選択肢と AI が実際に受け取る要求が食い違わないよう、意味を一致させてください。

## 外観とアイコン <a href="#appearance" id="appearance"></a>

グリッドメニューは項目数に応じて自動で配置されます。リストはテキストが長い項目に適しています。各項目では、アイコンなし、Emoji、画像のアップロードを選択できます。アイコンを設定しない場合は、ボタンのテキストの最初の文字が識別用に表示されます。

{% hint style="warning" %}
メニューから外部リンクを開く場合は、URL が HTTPS を使用していることを確認し、リンクにアクセスできるか定期的に確認してください。
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.maiagent.ai/maiagent-user-guide/ja/build/tools/quick-menu.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.