コワーキングスペースの予約システムをプラグインで実現する-その1

Image

昨日久しぶりにミタカフェさんのイベントに参加しました。そこで「この夏コワーキングスペースを始める」という方とお話ししました。とても良いスペースになりそうで今から楽しみです。そのときに「WEBから予約とかできたらいいんですがね~」とおっしゃっててWordPressならプラグインで出来るんじゃない?と気軽にお話ししてたのですが、ちょっとどんなものあるか気になってきて調べて試してみました。

こんな予約が出来たらいいなぁ

コワーキングスペースで使うと仮定すると大概の場合はドロップインであっても会員登録無料みたいな感じで会員登録をしていることが多いので、登録済みの会員が席を予約するということにしてみたいです。

・登録済みの会員が予約出来る(登録済みなので何度も名前や連絡先を入力しなくてもOK)
・1日を午前、午後、夕方に分けてその時間帯毎に予約が出来るようにする
・1つの席は1人用として、全部で10席

という想定をしてみました。

WordPressの予約プラグインは何がいいのか?ググってみました

WordPress 予約 で検索すると、MTS Simple Booking C というものが無料で使えるし良さそうです。開発元のページを見てみると、日本語だし、ビジネスでもっと本格的に使いたい場合は有償版もあるようです。

これを紹介しているサイトもいくつか見つけたので、それらを参考にして私なりに試してみました

参照:http://www.nishi2002.com/3341.html
参照:http://sedoriplan.com/mts-simple-booking-c/

プラグインのダウンロードから有効化まで

ダウンロードしてきたものを設置するタイプのプラグインですので、まずはダウンロードをします。

MT Systems MTS Simple Bookin C ダウンロード

ダッシュボード>プラグイン>新規追加 で

Image

アップロード をクリックします

Image

ファイルの選択 ボタンをクリックし、ダウンロードしたzipを選択します。

Image

今すぐインストール をクリック

Image

インストールが終わったら、プラグインを有効化 をクリックします。

コワーキングスペースの情報を各種設定で登録する

コワーキングスペースの情報を各種設定で登録します。

Image

左ブロックに追加された、予約システム>各種設定 をクリックします

Image

最初に表示されている 予約パラメータ タブで、予約の受付にチェックを付けて、

Image

変更を保存 をクリックします。

施設情報タブをクリックし、

Image

出てきたフォームに適当な内容を入力して、変更を保存 をクリックします。

予約メールタブをクリックします。

申込の際にフォームに表示される項目を 不要/必須/任意 から選択します。

Image

メールの内容も追加や修正があればここで指定します。

Image

指定が終わったら変更を保存 をクリックします。

席と時間帯を予約品目として作成する

席と時間帯は 予約品目 というもので作成します。集中作業席という1人用の席予約ができるように設定してみます。

Image

新規作成画面で

Image

タイトルを入力、本文などは空欄のまま

Image

予約時間割と予約条件設定でこのように入力しました。

Image

公開ボタンをクリックして保存します。

予約スケジュールを作る

集中作業席1の予約できるスケジュールを決めたいと思います。仮定で考えている うさぎコワーキングスペース は日曜定休、ということで予約出来る日を月曜日~土曜日とします。

Image

予約システム>スケジュールをクリックします。

Image

このようにカレンダーとチェックボックスが出てくるので、

Image

曜日の横にあるチェックボックスをチェックするとその縦のチェックボックス(同じ曜日)すべてにチェックが入りますので、月曜日から土曜日までのチェックボックスをチェックします。

スケジュール保存 をクリックします。

予約フォームを作る

予約フォーム

固定ページの新規作成をクリックします。

Image

タイトルを適当に入力し、

Image

予約フォームはスラッグbooking-form と入力して保存することで予約フォームという認識がされるようです。

Image

ディスカッション部分も必要ないのでチェックを外します

Image

公開 をクリックします。

予約完了画面

先ほどの予約フォームと同じようにスラッグに booking-thanks を指定する事で完了画面と認識されます。

ディスカッション欄はフォームと同様にチェックを外します。

Image

タイトルと、完了画面に表示される文言をコンテンツ欄に入力して公開します。

予約をするためのカレンダー表示ページを作る

予約をするためのカレンダー表示ページ固定ページで作ります。

まず、先ほど作った 集中作業席1 の編集画面を開きます。

Image

予約品目ページで、集中作業席1編集をクリック

Image

URLを見ます

xxxxxxxxxxxx/post.php?post=2051&action=edit

の post=2051 の数字をメモします。

固定ページ新規に作成して、タイトルを適当に(ex.集中作業席1の予約)入力し、本文を

[monthly_calendar id="2051"]

のようにさきほどメモした数字をidにしたショートコードを入れて 公開 をクリックします。

予約がどのようにできるのかを確認する

これで集中作業席1の予約を受け付ける準備が整いました(^^)/

ではどのように予約が出来るのかを見てみます。

Image

とりあえず、自分だけで確認したいので固定ページ一覧の 集中作業席1の予約 行から、表示をクリックします。

Image

このようにカレンダーが表示されます。

Image

5月31日をクリックします。

Image

3つの時間帯が表示されているので

Image

13:00をクリックします。

Image

ログイン済みのユーザーの場合は名前とメールアドレスがデフォルトセットされていますので、入力は不要です。メッセージだけを入力して 予約確認 ボタンをクリックします。

Image

予約確認画面が表示されるので、 予約する ボタンをクリックします。

Image

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

予約完了後、予約者・管理者の確認

予約が完了すると予約者にはメールが送られます。

Image

Image
* メールのカスタマイズで名前と予約番号がなかったようなので追加しましたがデフォルトで表示されているようですね(^_^;

管理者にもメールが送られています。

Image

Image

管理者はダッシュボードの

Image

予約システム>予約リスト からも予約を確認できます。

今日のまとめ

ふ~お疲れさまっした…ちょっと長くなってしまいました。今日は「インストールしてどんな風に動くのか?」が分かるところまで、ということにします。

次回は「実際にうさぎコワーキングスペースで集中作業席1~10を予約出来るように表画面の表示まで」を行おうと思ってます。

手順は多いですが、やることが予約ですので仕方ないですね。画面などはわかりやすいので一度導入してしまえば楽に運用できるのではないかと思います(^^)/

兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/
無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。
[スポンサードリンク]
HP Directplus オンラインストア

「コワーキングスペースの予約システムをプラグインで実現する-その1」への11件のフィードバック

  1. いつもありがとうございます。フォームにスラッグを入れたところまではすんなりいったのですが、予約をするためのカレンダー表示をつくるのところで、編集画面(予約品目編集)のURLを見ると http://www.○○○.co.jp/wp_public/?mtssb_article=%e3%83%a2%e3%83%8e%e3%82%af%e3%83%ad%e3%82%b3%e3%83%94%e3%83%bc%e6%a9%9f のように出てしまい、PHPや数字らしきものが見当たりません。何か間違っているのでしょうか。

  2. メッセージありがとうございます(^^)/

    説明がちょっとわかりにくかった(数日経った私もよく分からなかった(^_^;)、のでちょっとコンテンツを編集して詳しくしてみました。いかがでしょうか?

  3. ああ、そうだったんですね~、私がみていたのは、URLじゃなく、パーマリンクでした。おっちょこちょい(反省)。とてもわかりやすくなりました。続きをやってみます。ありがとうございました。

  4. よかったです~。質問していただいたおかげでわかりにくいところを直せました。ありがとうございます(^^)/

  5. 整骨院を開業しているものですが自作で予約フォームをと思いこちらにたどり着きなんとかできました。ありがとうございます。しかし3つだけうまくいかないことがあるのですがそれは
    1 予約時間の必要のない0:00が消すことができない(削除を押すとaN:aNとなるが更新を押しても0:00は消えない)

    2 予約を試しにしてみるとちゃんとできているのですが【メールの送信を失敗しました。電話で予約の確認をお願いします】とコメントがでてしまう。

    3平日と土曜日予約ができる時間が違うのですがそれは1つの固定ページにまとめることはできませんか?

    以上お忙しいとは思いますがご回答よろしくお願いします。
    ウェブサイトはwww.unahone.net/diaryです。

    1. こんにちは、神楽坂ウナギ整骨院さま。コメントありがとうございます。

      質問をいただいてから1年ぶりぐらいにこのプラグインを動かしたのですが、色々うまくいかなくてお役に立つ情報が出せそうにありません。

      >1 予約時間の必要のない0:00が消すことができない(削除を押すとaN:aNとなるが更新を押しても0:00は消えない)

      私の場合、1年前にインストールしてからプラグインのアップデートだけは行っていたのですが、今試そうと新しい時間帯を追加すると追加した時はその時間(例えば0:00)で追加されたように見えますが、そのとき全ての時間帯がグリニッジ標準時(日本時間-9時間)になってしまいます。そのまま更新すると、追加した時刻+9時間の時間が追加されます。

      ただこの状態で結果的に0:00に予約時間になるように追加した時間帯を削除してみたところ、上手く削除できました。

      >2 予約を試しにしてみるとちゃんとできているのですが【メールの送信を失敗しました。電話で予約の確認をお願いします】とコメントがでてしまう。

      調べてみたところメール送信エラーの時のメッセージのようです。ダッシュボード 予約システムの施設情報タブで指定してあるメールアドレスは正しいでしょうか?メールが届かなければ実際にエラーが起こっていると思いますがメールは届いていますか?

      >3平日と土曜日予約ができる時間が違うのですがそれは1つの固定ページにまとめることはできませんか?

      予約ページは 予約品目と予約日の組み合わせで表示しているので1つの固定ページで表示する(のがどのページなのか判然としませんが)のはプログラム的に無理かと思われます。

      と、お役に立てず申し訳ありません。作者さんのページに問いあわせもあるようなので、そちらから問いあわせてみてはいかがでしょうか?

    1. あ、もしかしてこの方法でできるようになったのかもしれませんね(^^)/。ありがとうございます。

  6. 私のところでも突然「メールの送信を失敗しました」が出るようになってしまいました。Wordpress4.7.2にアップデートしてからなのですが、それが原因でしょうか?メールアドレスは間違っておりませんでしたし、そのアドレスにメールソフトから送ると届きます。

  7. 長さん、おはようございます。多忙につきレスが遅れてしまってすみません。前回のコメントにもあるようにだいぶ長いこと動かしていないのでメールが届かない理由については今のところわかりそうにありません。作者の方の問い合わせから問い合わせてみられたらもっとよい情報が得られるかもしれません。URLは http://mtssb.mt-systems.jp/inquiry/ のようです。よろしくお願いします。

    1. ご返事ありがとうございます。
      この問題については、sendmailに問題が起きていることが原因のようです。
      あれから色々調べていますが、スキルが足らず問題点を追求できておりません。
      プラグインの問題ではなさそうです。
      取り急ぎ、ご返事まで。

コメントを残す