予約システムが簡単に！MTS Simple Booking Cの使い方ーWordPressプラグイン【初心者向け】
完全日本語対応の予約システム運用プラグイン「MTS Simple Booking C」の使い方を解説しています。設定の部分から表示するところまで一連の流れを画像などを用いながら説明しています。店舗で予約システムなどが必要な場合はぜひご覧ください。
テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査
WordPressのプラグインについて初心者でも分かるように解説しています。
MTS Simple Booking Cは完全日本語対応の予約システム運用プラグインで、無料で使用することができます。イベントや店舗営業日の予約をWordPressのサイト上からフォームを利用して受け付けたり、管理することが可能になっています。
なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。
田島メンター！！予約サイトをWordPressで作れるって聞いたんですけど！！！
あぁ、できるよ。「MTS Simple Booking C」っていうプラグインを使うんだ。
それどうやってやるんですか〜？詳しく教えてください！！！
インストールと設定
このプラグインは、管理画面から「プラグインを検索」してインストールもできますし、プラグイン公式サイトからダウンロードすることも可能です。
インストールがわからない場合はWordPressのプラグインをインストールする方法をご覧ください。
「mts-simple-booking-c」フォルダをFTPクライアントを使用してwp-content/pluginsにアップロードします。
WordPress管理画面にログインし、「プラグイン」→「インストール済みプラグイン」にMTS Simple Booking Cが追加されていることを確認し「有効化」をクリックします。
次にMTS Simple Booking Cの設定を行います。左メニュー「予約システム」から「各種設定」を選択します。
設定画面の「予約パラメータ」タブです。
「予約の受付」にチェックが入っていることを確認します。カレンダー内に表示される予約可能日を表す記号などもここで設定することができます。
「施設情報」タブでは使用される会場や企業などの情報を入力します。
また、ここで連絡用のメールアドレスも設定します。予約を受け付けると、このアドレスに通知が送信されます。
「予約メール」タブでは訪問者が予約フォームに入力する際の必須項目と、完了時に相手側に自動送信されるメールの内容を設定することができます。
予約品目の作成
予約を受け付けるイベントや営業日などを設定します。
まず「予約品目」から「新規予約品目」を選択します。
予約を受け付ける内容が分かるものをタイトルに入力します。ここでは仮で「イベント予約」としています。本文は空のままでかまいません。
予約条件設定タブでは定員数や人数の上限を入力します。(ここが全てデフォルトの「0」になっている場合カレンダー上では「予約不可」として表示されるため必ず入力します)
「公開」をクリックすると予約品目が保存されます。
この時アドレスバーに表示されている以下の部分は、ショートコードで記事内にカレンダーを貼り付ける時に使用するIDなのであらかじめ控えておきます。
カレンダーの設定
次に、予約受付日を設定します。
「予約システム」から「スケジュール」を選択します。
各日付にチェックを入れると、その箇所が予約が可能な日としてサイト上に表示されます。
また、上の曜日の欄をチェックすると表示されているカレンダー内で同じ曜日がすべて選択されます。
予約可能にしたい箇所にすべてチェックを入れたら「スケジュール保存」をクリックします。
投稿フォーム・予約完了画面用の固定ページの作成
次に、二つの固定ページを用意します。
左メニューの「固定ページ」から「新規追加」を選択します。
固定ページ作成画面の右上の「表示オプション」をクリックし、「スラッグ」にチェックが入っていることを確認します。
予約フォーム用の固定ページを作成します。
タイトルの部分は訪問者が予約フォームに入力するときに上に表示されるタイトルになります。ここでは「予約フォーム」としています。
次に、「スラッグ」の欄にbooking-formと入力してから「公開」をクリックして保存します。(本文は空のままでOKです)
次に予約完了時に表示される用の固定ページを作成します。再び「固定ページ」から「新規追加」を選択します。
ここのタイトルも自由に編集できます。今回は「予約完了」としています。
本文の部分は訪問者が予約フォームから申し込みを完了した時に表示される内容になります。文章や画像などを用意します。
「スラッグ」の欄にはbooking-thanksと入力します。編集が完了したら「公開」をクリックして保存します。
予約カレンダーの公開と使用方法
作成した予約カレンダーをサイト上に表示します。
新規記事や固定ページを作成し、ショートコード[monthly_calendar id="●●"]を入力します。(●●の部分は予約品目を作成した時にアドレスバーに表示されたIDです)
記事内にカレンダーが追加されました。
また、MTS Simple Booking Cはウィジェットを使用することによってサイドバーなどに予約カレンダーを表示させることもできます。
編集も簡単で見やすい位置に自由に配置できるため便利な方法です。
「外観」から「ウィジェット」を選択します。
「MTSSB予約カレンダー」を右のサイドバーにドラッグ＆ドロップします。
表示させたい順番の位置にドラッグで上下移動させ、「保存」ボタンをクリックします。今回は一番上に配置しています。
サイドバーにカレンダーが表示されました。
記事や固定ページに配置した時と同じようにここから予約の作業を行うことができます。
予約カレンダー内の予約が可能な日付に設定されている記号(ここでは「◯」の部分)をクリックすると予約フォームの入力画面へ移動します。
フォーム送信後、用意していた完了用の固定ページが表示されます。
入力された内容はWordPress管理画面内の「予約システム」→「予約リスト」からすべて確認することができます。
予約画面、予約完了画面が表示されれば設定ができました。
自分でシステムを作ろうとすると大変ですが、プラグインを使えば簡単に行うことができます。
ぜひ、WordPressの使い方を覚えましょう！
本格的な予約サイトが作れるんですね！
そうだね。フリーのプラグインでこれだけのものが作れれば十分だね。
はい♪
[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。
