iframeを利用し、HPに予約システムを組み込んでいただけます。
埋め込み機能でできることは、以下となります。
・予約カレンダーの埋め込み
・予約カレンダーの大きさの指定
・予約カレンダーの初期表示条件の指定
ご利用いただく場合はブラウザの設定で「Cookie(クッキー)を常に(全て)受け入れる」設定にしていただく必要があります。
また、iOS11をご利用の方は、「サイト越えトラッキングを防ぐ」と「すべてのCookieをブロック」をoffに設定いただく必要があります。
※デフォルトではonになってます。
設定いただくタグは下記です。
<iframe width=”960″ height=”720″ src=”予約サイトURL/api/calendar?パラメータ” style=”border:none;”></iframe>
注意事項
■2つ以上の設定
絞り込み条件(パラメータ)はcookieに保存されるため、2つ以上のiframeを組み込んだ場合は、前回の絞り込み条件が保持されます。
異なる条件で絞り込んだ場合、両方の条件に合致する枠で絞り込まれます。
同じパラメータは上書きされます。
日付で絞り込んでいない場合でも、前回の日付を保持したまま表示されます。
予約枠や日付は「id=」「date=」で解除可能です。
※複数を同時に操作・閲覧時など対応できない場合もございます。
対応不可例)2つのiframe(A、B)を同時操作
Aのタイムテーブルから予約画面へ遷移し、Bのタイムテーブルを開いた後、
Aの予約画面で「予約状況に戻る」ボタンを押すと、Bの条件でタイムテーブルが表示される。
両方の条件に合致する予約枠がない場合、「該当する予約枠は見つかりません」のエラー文言が表示されます。
例)
A:label_id=1&date=2017-03-01&disp_type=1(ラベルID:1、日付:2017/3/1、表示タイプ:時間表示)
B:label_id=2&date=(ラベルID:2、日付:解除)
Aの後にBを開くと「label_id」は上書き、「date」 は解除され
『ラベルID:2、表示タイプ:時間表示』で表示されます。
■予約サイトと組み込んでいるページを複数タブで開いた場合
セッションを共有しているため、ログイン状態や検索条件が連動されます。
予約サイトイメージ
https://www4.revn.jp/demo11/のタイムテーブルを表示する
ラベル「 Aタイプ」、表示サイズ指定(label_id=1、width=720&height=720)
<iframe width=”100%” height=”720″ src=”https://www4.revn.jp/demo11/api/calendar?label_id=1&width=720&height=720” style=”border:none;”></iframe>