更新ができるシンプルな予約システムカレンダー「Booking Package」

Webサイトで予約カレンダーを採用しているページが多くなっています。今回は、更新できる予約カレンダーの無料プラグインを紹介いたします。

定休日、営業時間、定員数などを設定して、予約カレンダーをWebサイト上に載せることができます。日曜日始まりのカレンダーや、予約状況などを反映できるプラグインです。レスポンシブデザインに対応しているので、スマホでの操作も簡単にできます。

では、カレンダーの設定を説明いたします。今回は、あらかじめCSSなどのデザインや、メール設定、予約完了画面の設定などが設定された状態であることを前提に説明いたします。管理者の方が、どのようにカレンダーを設定していくかということに絞って説明いたします。

まずは、全てのカレンダーに関わる設定です。予約カレンダーを複数設定する場合は全てに反映されます。

設定

ダッシュボード「Booking Package」「一般設定」をクリックします。

「一般設定」をクリック

「設定」は、全体の設定です。通常、カレンダー更新時は変更しません。この「設定」は全てのカレンダーに共通していますが、カレンダー作成後に修正しても、個々には反映されません。

項目	説明
受取人メールアドレス	受信メールアドレス
差出人メールアドレス	送信メールアドレス
差出人名	送信メール差出人名

定休日

上のタブの「定休日」をクリックします。カレンダーが表示されるので、定休日をクリックします。赤色に変化すれば設定完了です。定休日設定を解除する場合は、赤くなっている場所をクリックすると、元の設定に戻ります。カレンダー、右上の数字をクリックすると、次の月のカレンダーが表示されるので、同じように設定します。

祝祭日

同じく「一般設定」の上のタブの「祝祭日」をクリックします。カレンダーは、日本の祭日の設定がされていません。「定休日」と同じように休日設定します。ただ、祝祭日の名前は入力できません。定休日とは別のカレンダーで、祝祭日が設定できる機能です。

カレンダーアカウント

予約カレンダーごとに、時間などの細かい設定をしていきます。ダッシュボード「Booking Package」「カレンダーアカウント」をクリックします。

カレンダー更新の場合は、新規でカレンダーを作成することはありません。作成してあるものの修正になりますが、新規で作成する場合の手順を紹介します。

まず、右上の「予約カレンダーを追加」をクリックします。今回は予約時間も選択できるカレンダーを設定したいので、「時間枠の予約」をクリックします。色々設定項目が出てきますが、一番上の「名前」のみ変更します。名前は、管理画面、Webサイトに反映されるので、わかりやすい名前にします。

スケジュール設定

「スケジュール設定」タブをクリックします。ここではまず、曜日ごとの予約時間設定をしていきます。「週間スケジュールテンプレート」をクリックします。

まず、左側の月曜日をクリックします。ダイアログボックスが出てくるので、全て設定していきます。

「時間」は予約開始時間と予約終了時間を設定します。終了時間は営業終了時間ではなく、予約できる最終の時間になります。

「間隔」は予約できる時間の間隔で、30分、60分など設定した間隔ごとの予約時間が設定されます。

「締切」は予約を締め切る時間を予約時間何分前まで出来るか設定します。

「定員」は設定した時間にどれだけの予約件数を入れられるか設定します。

例として、17:00から21:00まで予約可能で、1時間ごと、定員はテーブル数4で設定します。

項目	説明
時刻	予約開始時間
間隔	予約開始時間の間隔
締め切り	予約の締め切り
定員	時間ごとに予約できる数

定休日

これは、「一般設定」でも有ましたが、「カレンダーアカウント」での設定が優先されます。使用方法は、「一般設定」と同じです。カレンダーが複数ある場合は、紛らわしいので、「一般設定」のみ使用し、「カレンダーアカウント」の定休日は使用しない方が良いでしょう。

入力フォーム

「入力フォーム」に関しては、コードやメールアカウントに関係するので、Webサイト作成時に制作側で設定することになります。送信メールとの兼ね合いもあるので、カレンダーを更新する時は変更しません。変更する場合は、後ほど説明する「通知」で送信メールなどの変更も行います。

入力タイプは、テキストの他に、セレクトボックスボックス、ラジオボタンなどが選択出来ます。

サービス

サービス内容を作成します。年度や季節によって、サービス内容が変更する場合に使用します。設定すると、日付と同じく、予約するときに必須条件となります。「新規追加項目」をクリックします。

一番上の「名前」に追加したいサービスを入力します。必要であればその下に説明文を入力します。その下の「状態」の「有効」チェックボックスをクリックします。あとは、「所要時間」にサービス終了までかかる時間を入力して、左下の「保存」ボタンをクリックします。サービス一覧に追加されました。

削除する場合は、そのサービスの「編集」をクリックし、右上の「サービス機能」の「ON」のトグルをクリックし、「OFF」にして「保存」します。

項目	説明
名前	サービス項目
説明	名前下に表示するキャプション
状態	表示する場合チェック有
有効期限	期間限定で表示

ゲスト

1つの予約に対しての人数を反映させる機能です。今回のデモでは使用していませんが、定員に対して、予約人数を反映する場合に使用する機能です。

通知

予約を受けた後や認証した後に送られるメールの内容を設定できます。「入力フォーム」で設定した内容を元にメール内容を作成します。差出人メールアドレスや、担当者を変更すると、メールの内容も変更になります。

「新規」をクリック

項目	説明
新規	予約受付後送受信メール
承認済み	承認後送受信メール

項目	説明
顧客向け	送信用メール
管理者向け	受信用メール

設定

カレンダー更新時は変更しませんが、カレンダーを新規作成した時の、名前以外の設定を行います。メールアドレスなど、「一般設定」と被るところもありますが、変更すれば、こちらが優先されます。

項目	説明
差出人メールアドレス	予約確認メール送信アドレス
受取人メールアドレス	予約受付メール受信アドレス
差出人名	予約確認メール送信者名
カレンダー	予約カレンダーの公開非公開
予約スケジュールの公開日数	何日前から予約できるか
今日から予約できない日数	何日前に予約を締め切るか
週の始まり	カレンダーの左端の曜日
サービス機能	サービスの表示非表示/最初の選択
ゲスト機能	ゲストの表示非表示
カレンダーの各日に残りの枠を数字または記号で表示	予約状況を数字や記号で表示
予約完了ページを表示せずに他のページにリダイレクト	予約完了ページを指定して表示

予約方法

まず、大まかな予約の流れを説明します。利用者が、Webサイト上の予約カレンダーの日にち、サービス、時間を選択します。必須項目を入力の上、フォームから送信します。利用者、管理者にそれぞれメールが送信されます。利用者、管理者に、予約受付のメールが送信されます。

管理者より、承認されると、利用者、管理者に承認済みメールが送信されます。これで、予約完了です。

承認

管理者は、メール内容を確認し、内容がOKなら、管理画面のカレンダーより予約申し込みのあった日付をクリックし、予約内容を確認して、承認します。

まず、予約メールが来たら、WordPress管理画面で内容を確認し、承認しましょう。「Booking Package」の「予約済みの顧客」をクリックします。予約があり未承認のものは、赤字になっています。緑が承認済、黄色がキャンセル済です。予約メールのあった、日付をクリックします。

予約者名前をクリックすると、予約内容が表示されます。

確認してOKならば、上から2番目の「承認待ち」をクリックします。ダイアログでボタンが出てくるので、緑色の「承認する」をクリックします。確認画面で「顧客と管理者にメールを送信しますか？」と表示されるので、「送信する」をクリックします。これで、予約承認完了です。利用者、管理者に予約承認完了のメールがそれぞれ送信されます。

予約承認後、キャンセルがあれば、その日付クリックし、「承認済み」ボタンをクリックし、黄色の「キャンセル済み」ボタンをクリックします。「キャンセル済み」にすると、取り消せないので注意しましょう。

以上で、ブッキングプラグイン「Booking Package」での予約は終了です。電話でも予約を受け付ける場合もあると思いますが、この管理画面で、予約内容の編集や、予約の手動追加もできるので、全ての予約の管理も可能です。

予約システムは、外部のシステムを使用するサイトが多いですが、プラグインでも実装可能ですので、ご検討ください。Webサイト作成のご依頼は、メールフォームよりお問い合わせください。