> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://kb.rezio.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 予約エンジンと予約ボタン

# 概要

予約ボタンのデザインと外部に接続する方法を説明します。

---

**目録**
* [リンクを作成する](#1-44oq44oz44kv44ks5l2c5oiq44gz44kl)
* [UTMパラメータをカスタマイズ](#1-utm)
---

販売ツール＞予約エンジンと予約ボタン

![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/c/8/a9c8db7fff74e000/5fb99bf2-cc96-47c2-a7ad-d431f1_ha153r.png)

# リンクを作成する

商品・プラン毎に予約エンジンへのリンクとボタンを作成することができます

1. 商品一覧から商品を選択します

![](https://storage.crisp.chat/users/helpdesk/website/-/d/d/f/9/ddf93a7e2d0de000/df1834fd-12d9-4132-9ef7-608e08_26qul7.png)

2. キーワードから商品を検索することができます
3. 商品を選択し、適用するをクリック

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/7/7/e477aa7fd9362800/3a6854df-bec9-4600-aee9-6237e3_xmv0ts.png)

4. 商品選択後、ページ右側にリンクとコードが生産されます。更にプランを選択することもできます。

![](https://storage.crisp.chat/users/helpdesk/website/-/5/e/5/7/5e57579ab9573000/20f6282d-47fa-44f3-912d-1aaa64_1ke1w2.png)

| ヒント：プランを選択しない場合、リンク先ではプラン選択画面が開かれます。下記の画像を参考にしてください。

![](https://storage.crisp.chat/users/helpdesk/website/-/c/b/4/d/cb4d8098cc646000/167b6b67-70b6-4843-b89a-f7bc8e_qsr1ko.png)
プラン（套餐）を選択した場合、予約リンクを開くとプラン予約画面が表示され、顧客が自ら時間枠（セッション）を選択できるようになります。

| ヒント：ヒプランを選択した場合、日程を選択する画面が開かれます。下記の画像を参考にしてください。

![](https://storage.crisp.chat/users/helpdesk/website/-/7/7/c/c/77cca89f29dd6000/9c4ed57c-f9e8-4004-974d-83b165_169gyjd.png)

5. 予約エンジンのリンクをコピーしご自身のサイト等に直接貼り付けるか、予約ボタンを使用することができます
6. 予約ボタンのスタイルはボタンか文字から選べます。色や文面を変えることもできます

![](https://storage.crisp.chat/users/helpdesk/website/-/3/3/e/4/33e41a96b2c84000/c71b9774-e071-4492-86b1-d16383_1fccsf1.png)

7. 予約ボタンのスタイルをデザインした後、コードをコピーをクリックしてください

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/67017851288/original/1UL3lxTC7b_0Ca6StbF8klLa02bZqYbn4w.png?1627374517)

8. コードはご自身のサイトやブログに貼り付けることができます。お客様が予約ボタンをクリックすると、Rezio予約画面が開かれます。

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/67017851291/original/PJbDpcSWbF3Tqpk5J-wCSvy9ahXWYH03yw.png?1627374517)

# UTMパラメータをカスタマイズ

Googleアナリティクスを利用してサイトのトラフィックを測定している場合、予約ボタンにUTMパラメータを挿入することができます。

1. UTMパラメータをカスタマイズ ボタンをクリックします
2. Campaign Source パラメータ（必須項目）および必要な項目を入力

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/67017851283/original/s5ufaQS9EPHY7VVD5Uu7cemHkkgRpD0gbQ.png?1627374516)