ワードプレス歴およそ15年のフロントエンドエンジニアです。
関数作成からサイト構築まで、何でもご相談ください。
Categories MW Form, web制作メモおよび独り言

予約カレンダー試作

by

情報を追記している場合はありますが、古い情報を訂正はしていませんので、公開年月日を参照してください。
プラグイン・タグ、いずれもワードプレス・PHPのバージョン等によって動作しない場合もあります。
2022.11.16公開

グーグルのカレンダーAPIとACFを組み合わせて、予約カレンダーが作れるのではないかと前から考えていたのだが、やっと、テストしてみた。

カレンダー側：
投稿は1月1投稿でタイトルかカスタムフィールド値から年月を取得。
曜日ごと、祝日などの設定が可能なので、今回は土日祝日が定休とした。

カスタムフィールド(ACF)：
1月分1～31をグループフィールドで作成し、サブフィールドは臨時休業のチェックボックスと予約可能時間のテキストフィールド。テキストフィールドはデフォルト値を設定(今回は｢予約受付中｣)。ラベルは10、11、のように。
テーマ側でカレンダーの表示部分は土日祝日は何も出力しないようになっているので、サブフィールドの臨時休業にチェックがなく、各時間のテキストフィールドの値が｢予約受付中｣であれば、予約フォームへのリンクを表示。臨時休業日がなければ投稿を作成するのみでここまではOK。

フォームと関数：
フォーム(MW Form)へのリンクは投稿IDと予約日時、投稿のアップデート用の日・時間をパラメータで持たせ、それぞれフィールドの値にセット。
送信時に日・時間からどのグループフィールド・サブフィールドをアップデートするか判定してテキストフィールドの値をアップデート。値が｢予約受付中｣でなくなればカレンダーに表示されなくなる。
今回は予約の氏名とトラッキングナンバーを入れることにした。*保存したデータで確認する想定。

追記　予約に定員を設ける場合：
日付のグループフィールド下のサブフィールドを数値フィールドにして定員数を入力。
フォーム側も人数の選択欄を設けて上限をパラメータでセット。
送信時に定員数から申し込み人数を減らしていって、ゼロになったら予約のリンクを非表示とする。

追記　所要時間の異なるコースの選択を付ける場合：
Aコース1時間、Bコース2時間の想定で、コースの選択はフォームのみに。
Bコースが選択された場合は時間枠の次の枠(送信された時間に1を足す)もアップデートする。

その他のAdvanced Custom Fields に関する記事一覧

Related posts:

  1. 予約カレンダー・予約管理サンプル(ACFとMW Form)
  2. イベントカレンダーサンプル(ACFとMW Form)

情報を追記している場合はありますが、古い情報を訂正はしていませんので、公開年月日を参照してください。
プラグイン・タグ、いずれもワードプレス・PHPのバージョン等によって動作しない場合もあります。
2022.11.16公開

nekotaiyo