埋め込み・外部連携
予約ページをWebサイトに埋め込んだり、LINE・Zoomなどと連携する方法
予約ページの埋め込み方法
<iframe src="..." width="100%" height="700" />RizbellLFO.open({project: "abc"})iframeコードの取得方法
プロジェクト詳細の「埋め込み」タブを開く
「iframeコードをコピー」ボタンをクリック
<iframe
src="https://lfo.rizbell.com/booking/your-org?project=xxx"
width="100%"
height="700"
frameborder="0"
></iframe>自社サイトのHTMLに貼り付ける
追従ウィジェット(フローティングボタン)
サイト上に常時表示される追従型の予約ボタンを設置できます。ページをスクロールしても画面の隅に表示され続けるため、どのタイミングでも予約フォームを開けます。
設定場所: 管理画面 → プロジェクト設定 →「ウィジェット」タブ
初期表示はカード、ボタンで予約フォームが開く
ピルボタン1つ。クリックでモーダルが開く
ピルボタンのみ表示。最小限のフットプリント
× ボタンの動作(3段階クローズ)
モーダルを閉じても完全に消えるのではなく、一度コンパクト表示に戻ります。再度 × を押すと完全に非表示になります。
通常の埋め込みコード(script タグ)は GTM では動作しません。GTM 用の設定コードを別途使用してください。
<script>
window.RizbellConfig = {
org: "your-org-slug",
projectSlug: "your-project",
widgetMode: "popup",
btnColor: "#3B82F6"
};
</script>
<script src="https://lfo.rizbell.com/embed.js"></script>GTM用のコードはプロジェクト設定 → ウィジェットタブの「GTM経由」タブからコピーできます。
ウィジェットコードの取得手順
LINE連携
Growthプラン以上LINE公式アカウントと連携することで、予約確認・リマインダー・MAメッセージをLINEで送信できます。QRコードを読み込むとLINE内で予約フォームが直接開くLIFF連携にも対応しています。
設定場所: 管理画面 →「LINE連携」タブ
事前に必要な作業
LIFF連携について
LIFF(LINE Front-end Framework)を設定すると、QRコードを読み込むだけでLINEアプリ内に予約フォームが開きます。LINEユーザー情報と自動連携されるため、顧客の入力負担が軽減されます。
Zoom連携
Zoom連携を設定すると、予約確定時に自動でZoomミーティングが作成され、顧客と担当者の両方にミーティングURLが通知されます。組織共通のZoomアカウント(有料プラン)を1つ連携して複数担当者で共有できます。
Zoomを使用するには連携が必要です。
同一Zoomアカウントの重複防止
組織で1つのZoomアカウントを共有する場合、複数の予約が同じ時間帯に重ならないよう自動チェックします。ミーティングが重複する場合は Google Meet にフォールバックします。
詳細な設定手順
Zoomアプリの作成手順・スコープ設定など詳細は「カレンダー連携・担当者設定」ヘルプページを参照してください。
💡 ヒント: まずはURL直接共有から始めるのが最も簡単です。慣れてきたらiframe埋め込みに移行すると、顧客がサイトを離れずに予約でき、コンバージョン率が向上します。