予約システムが簡単に!MTS Simple Booking Cの使い方ーWordPressプラグイン【初心者向け】

完全日本語対応の予約システム運用プラグイン「MTS Simple Booking C」の使い方を解説しています。設定の部分から表示するところまで一連の流れを画像などを用いながら説明しています。店舗で予約システムなどが必要な場合はぜひご覧ください。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,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が追加されていることを確認し「有効化」をクリックします。

mtsb_p_1

次にMTS Simple Booking Cの設定を行います。左メニュー「予約システム」から「各種設定」を選択します。

mtsb_p_2

設定画面の「予約パラメータ」タブです。

「予約の受付」にチェックが入っていることを確認します。カレンダー内に表示される予約可能日を表す記号などもここで設定することができます。

mtsb_p_3

「施設情報」タブでは使用される会場や企業などの情報を入力します。

また、ここで連絡用のメールアドレスも設定します。予約を受け付けると、このアドレスに通知が送信されます。

mtsb_p_4

「予約メール」タブでは訪問者が予約フォームに入力する際の必須項目と、完了時に相手側に自動送信されるメールの内容を設定することができます。

mtsb_p_5

 

予約品目の作成

予約を受け付けるイベントや営業日などを設定します。

まず「予約品目」から「新規予約品目」を選択します。

mtsb_p_6

予約を受け付ける内容が分かるものをタイトルに入力します。ここでは仮で「イベント予約」としています。本文は空のままでかまいません。

mtsb_p_7

予約条件設定タブでは定員数や人数の上限を入力します。(ここが全てデフォルトの「0」になっている場合カレンダー上では「予約不可」として表示されるため必ず入力します)

mtsb_p_8

「公開」をクリックすると予約品目が保存されます。

この時アドレスバーに表示されている以下の部分は、ショートコードで記事内にカレンダーを貼り付ける時に使用するIDなのであらかじめ控えておきます。

mtsb_p_9

 

[PR] WordPressで挫折しない学習方法を動画で公開中

カレンダーの設定

次に、予約受付日を設定します。
「予約システム」から「スケジュール」を選択します。

mtsb_p_10

各日付にチェックを入れると、その箇所が予約が可能な日としてサイト上に表示されます。

mtsb_p_11

また、上の曜日の欄をチェックすると表示されているカレンダー内で同じ曜日がすべて選択されます。

予約可能にしたい箇所にすべてチェックを入れたら「スケジュール保存」をクリックします。

mtsb_p_12

 

投稿フォーム・予約完了画面用の固定ページの作成

次に、二つの固定ページを用意します。
左メニューの「固定ページ」から「新規追加」を選択します。

mtsb_p_13

固定ページ作成画面の右上の「表示オプション」をクリックし、「スラッグ」にチェックが入っていることを確認します。

mtsb_p_14

予約フォーム用の固定ページを作成します。
タイトルの部分は訪問者が予約フォームに入力するときに上に表示されるタイトルになります。ここでは「予約フォーム」としています。
次に、「スラッグ」の欄にbooking-formと入力してから「公開」をクリックして保存します。(本文は空のままでOKです)

mtsb_p_15

次に予約完了時に表示される用の固定ページを作成します。再び「固定ページ」から「新規追加」を選択します。

ここのタイトルも自由に編集できます。今回は「予約完了」としています。

本文の部分は訪問者が予約フォームから申し込みを完了した時に表示される内容になります。文章や画像などを用意します。

「スラッグ」の欄にはbooking-thanksと入力します。編集が完了したら「公開」をクリックして保存します。

mtsb_p_16

 

予約カレンダーの公開と使用方法

作成した予約カレンダーをサイト上に表示します。

新規記事や固定ページを作成し、ショートコード[monthly_calendar id="●●"]入力します。(●●の部分は予約品目を作成した時にアドレスバーに表示されたIDです)

mtsb_p_17

記事内にカレンダーが追加されました。

mtsb_p_18

また、MTS Simple Booking Cはウィジェットを使用することによってサイドバーなどに予約カレンダーを表示させることもできます。

編集も簡単で見やすい位置に自由に配置できるため便利な方法です。

「外観」から「ウィジェット」を選択します。

mtsb_p_19

「MTSSB予約カレンダー」を右のサイドバーにドラッグ&ドロップします。

mtsb_p_20

表示させたい順番の位置にドラッグで上下移動させ、「保存」ボタンをクリックします。今回は一番上に配置しています。

mtsb_p_21

サイドバーにカレンダーが表示されました。

記事や固定ページに配置した時と同じようにここから予約の作業を行うことができます。

mtsb_p_22

予約カレンダー内の予約が可能な日付に設定されている記号(ここでは「◯」の部分)をクリックすると予約フォームの入力画面へ移動します。

mtsb_p_23

フォーム送信後、用意していた完了用の固定ページが表示されます。

入力された内容はWordPress管理画面内の「予約システム」「予約リスト」からすべて確認することができます。

mtsb_p_24

予約画面、予約完了画面が表示されれば設定ができました。

自分でシステムを作ろうとすると大変ですが、プラグインを使えば簡単に行うことができます。

ぜひ、WordPressの使い方を覚えましょう!

 

大石ゆかり

本格的な予約サイトが作れるんですね!

田島悠介

そうだね。フリーのプラグインでこれだけのものが作れれば十分だね。

大石ゆかり

はい♪

 

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。