【MTS Simple Booking-C】の使い方～サイトに予約システムを導入！～

MTS Simple Booking-Cのzipファイルをダウンロード

公式サイトにアクセスし、DOWNLOAD >シンプル予約システムをクリックします。

ダウンロード開始をクリックします。
これでzipファイルがダウンロードされます。

※管理画面で検索しても出てこないプラグインのため、公式サイトでダウンロードをおこなうようにしてください。

管理画面からプラグインをアップロード

管理画面の「プラグイン」>「新規プラグインを追加」を選択し、「プラグインのアップロード」をクリックします。

「ファイルを選択」をクリックして、ダウンロードしたzipファイルを選択します。

選択できたら、「今すぐインストール」をクリックします。

インストールが完了したら、「プラグインを有効化」をクリックします。

※インストール済みプラグインの一覧から有効化してもOKです。

すると、このように管理画面に、

• 予約品目
• 予約システム

の２つの項目が追加されます。

【予約システム】予約パラメータ・施設情報・メールの設定

まずは、各種設定をおこなっていきます。

管理画面から、「予約システム」> 「各種設定」を選択します。

「予約の受付」にチェックを入れます。

※チェックを入れないと、カレンダーが表示されずに、予約中止中のメッセージが表示されてしまうため、気をつけてください。

その他の項目は、状況に合わせて項目を設定します。

全て設定ができたら、「変更を保存」をクリックします。

施設情報を入力します。
ここに入力した情報は、予約が入ったときの自動返信メールに記載されます。
※必要な情報のみで問題ありません

ここでは、サロンの予約システムを作成したいので、施設名称は「テストサロン」としました。

E-mailのところに入力したアドレスは、予約完了メールの送信元アドレスにもなります。

全て設定ができたら、「変更を保存」をクリックします。

予約完了メールの編集をおこないます。
メールの本文の中には、予約フォームに入力された変数を使用できます。

• 姓名
  %CLIENT_NAME%
  ※フォームに入力したユーザーの情報を表示
• 予約ID
  %RESERVE_ID%
  ※予約時にIDが割り当てられます
• 施設名
  %NAME%
• 郵便番号
  %POSTCODE%
• 住所
  %ADDRESS%
• 電話番号
  %TEL%
  

※施設名、郵便番号、住所、電話番号は、施設情報に入力したものが反映されます。

実際のメールでは、メール前文とメール後文との間に、予約内容が自動で挿入されます。

【予約品目】予約詳細の設定

次に、予約カレンダーの設定をおこなっていきます。

管理画面から、「予約品目」> 「新規予約品目」を選択します。

タイトルを入力します。
ここでは、「サロン予約」としました。

※タイトルは、予約時に日付を選択すると、フォームのタイトルとして表示されます。

下にスクロールをすると、「予約時間割」のメニューがあるので、予約を受付したい時間を登録していきます。

①で時間を選択し、②で時間割追加をクリックすると、一覧に時間が登録されていきます。

※間違えた場合は、一覧の時間の右の削除をクリックすると、削除することができます。

今回はこのように、複数の時間を登録しました。

予約に関する条件を指定していきます。

• 制約タイプ
  ・収容人数・・・「人数」で管理する
  ・予約件数・・・「件数」で管理する
  のどちらで予約管理をおこなうかを設定します。
• 定員数／予約上限
  ・定員数
  制約タイプで「収容人数」を選択した場合は、ここで定員数を設定します。
  定員数以上の予約はできなくなります。
  
  ・予約上限
  制約タイプで「予約件数」を選択した場合は、ここで予約上限数を設定します。
  予約上限数以上の予約はできなくなります。
• 最少人数
  予約1件あたりの、必要最少人数を入力します。
  たとえば、2に設定しておくと、2名以上でのみ、予約が可能となります。
• 最大人数
  予約1件あたりの、上限最大人数を入力します。
  たとえば、5に設定しておくと、5名以下でのみ、予約が可能となります。
• 人数計算乗率
  たとえば、小人や幼児も予約の対象となる場合、小人を0.5に設定しておくとすると、2人で1人の予約としてカウントします。

ここまで入力ができたら、上にスクロールして、公開します。

【予約システム】予約のスケジュールの設定

最後に、予約を受付する日の選択をおこなっていきます。

管理画面から、「予約システム」> 「スケジュール」を選択します。

左上には、予約品目のところで入力したタイトルが表示されています。
※もし、複数の予約品目を登録した場合は、ここでスケジュールを設定したい品目を選択します。

まず、スケジュール設定をしたい年月を選択します。（選択後に、右横の変更ボタンをクリックしてください）

次に、予約を受付する日にチェックをいれていきます。
ここでは、12月25日以降、月曜日から金曜日の予約を可能としたいと思います。

画像のようにチェックを入れたら、左下の「スケジュール保存」をクリックします。

※数ヶ月に渡って予約を可能としたい場合も、ひと月ごとにスケジュール保存をクリックしてください。
（保存せずに年月を変更してしまうと、チェック内容がクリアされてしまいます）

1月のスケジュールも設定していきます。

①年月を選択
②変更をクリック
③月～金の曜日の横にチェックを入れる
※曜日の横にチェックを入れると、一括でチェックを入れることが可能です
（ex.月の横にチェックを入れると、全ての月曜日にチェックが入る）
④「スケジュール保存」をクリック

※ここでは、2月も同じように設定をおこないました。

予約カレンダーの埋め込み

カレンダーの埋め込みにあたって、作成した予約品目のidを確認していきます。

管理画面から、「予約品目」> 「予約品目」を選択します。

予約品目名を選択します。
ここでは、「サロン予約」を選択します。

アドレスバーを確認します。

post=○○
となっているところの数字を見ます。

ここでは、88という数字をメモしておきます。

予約カレンダーを埋め込みたいページを作成します。
ここでは、「予約カレンダー表示テスト」という固定ページを作成し、ここに埋め込みをおこなっていきます。

下記の手順で、ショートコードのブロックを挿入します。

①ブロックの追加ボタンを選択
②検索窓に「ショート」と入力
③ショートコードブロックが出てくるので選択

下記のように、ショートコードを入力します。
※●●の部分は、先ほど予約品目のアドレスバーのところで控えた数字を入力します。

[monthly_calendar id=●●]

ページをプレビューします。
STEP5で、予約受付日として設定した日付に○印が表示されていることがわかります。

予約受付日として設定していない土曜日と日曜日は予約ができなくなっています。

予約確認画面の作成

固定ページで予約確認画面を作成します
下記のとおり、入力とページの公開をおこないます。

• タイトル
  任意のタイトルを入力
  （予約確認画面のタイトルとして表示されます）
• 本文
  任意のテキストを入力
  （予約フォームの上に表示されます）
  ※空欄でもOKです
• パーマリンク
  booking-formと入力
• ここまで入力できたら、ページを公開
  

予約完了画面の作成

固定ページで予約完了画面を作成します
下記のとおり、入力とページの公開をおこないます。

• タイトル
  任意のタイトルを入力
  （予約完了画面のタイトルとして表示されます）
• 本文
  任意のテキストを入力
  （予約完了画面に表示されます）
• パーマリンク
  booking-thanksと入力
• ここまで入力できたら、ページを公開
  

予約のテスト

ここからは、実際に予約のテストをおこないます。

STEP6で埋め込んだカレンダーを表示させ、日付の下の○印をクリックします。

すると、STEP4で登録した時間が表示されます。
ここでは、10:00に予約を入れます。
時間の横の○印をクリックします。

予約フォームの画面になります。
フォームの上には、予約確認画面の本文に入力した内容が表示されています。

各項目に入力をおこないます。

• 人数を入力
  ※もし、STEP4の予約条件設定のところで、最少人数を2に設定していた場合には、1名での予約は不可となります。
• 必須項目を入力
• 任意項目を入力
• ここまで入力できたら、「予約確認」をクリック

入力内容の確認画面が表示されます。
内容に問題がなければ、「予約する」ボタンをクリックします。

※もし、入力内容を修正したい場合は、ブラウザの戻るボタンで戻って編集することが可能です！

予約完了画面が表示されます。

予約完了画面作成時に入力した、タイトルと本文が表示されていたら、OKです！

予約が完了すると、入力したメールアドレスに予約完了メールが届きます。

STEP3でおこなったメールの設定が反映されていることがわかります。

予約リストの確認

予約リストの確認方法をチェックしていきます。

管理画面から、「予約システム」> 「予約リスト」を選択します。

すると、予約のリストが一覧で確認できます。

確認の下のステータスが、赤色のマイナスマークになっている（未確認）になっていることがわかります。

予約日の下にカーソルを当てると、編集が表示されるので、クリックします。

予約の編集画面となります。
ここで、予約フォームに入力された情報を確認できます。

ここからメールアドレスの情報を取得できるので、別途予約完了のメールなどを送信することも可能です。

必須ではありませんが、右上の「予約確認済み」にチェックを入れて、「予約データ保存」をクリックすると、確認のステータスを変更することができるため、管理がしやすくなります。

ここでは、予約確認済みにチェックを入れて、予約データ保存をクリックしてみます。

もう一度、管理画面から、「予約システム」> 「予約リスト」を選択します。
すると、確認の下のステータスが緑のチェックマーク（確認済）に変わっていることがわかります。

このようにして、予約の管理をおこなうことが可能とです。