Wix ブッキング:カレンダーページをカスタマイズする
読了時間:8分
顧客がクラスやプライベート予約セッションを予約する際、カレンダーページで日時を選択します。テキスト、レイアウト、表示内容を調整して、ブランドに合わせてカレンダーページをカスタマイズしましょう。
![ライブサイトのブッキングカレンダーを示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/f0656688-8ed1-488a-888d-62373b7c3a3c/2021/05/25/05c18887-bc3e-48e1-b993-17d13ad11600/b47b484f-8a9c-4e06-89e7-49c8aaeae15a.jpg)
この記事では、以下の項目について説明します:
注意:
ブッキングカレンダーページはクラスとプライベート予約のみ表示され、コースでは利用できません。
カレンダーページのレイアウトを選択する
顧客が必要な情報をできるだけ簡単に見つけられるよう、カレンダーに分かりやすいレイアウトを選択します。日表示または週表示のレイアウトから選択して、各要素の配置や間隔を調整することができます。
カレンダーページのレイアウトを選択する方法:
- エディタでブッキングカレンダーページに移動します:
Wix エディタ | こちらをクリックして手順を確認しましょう
Editor X | こちらをクリックして手順を確認しましょう
2.「ブッキングカレンダー」パーツをクリックします。
3.「設定」をクリックします。
4.「レイアウト」タブをクリックします。
5. 以下のオプションをカスタマイズします:
- レイアウトを選択:ブッキングカレンダーの形式を、日表示または週表示から選択します。
- テキスト配置:クリックして、テキストの配置を左、中央、右のいずれかに設定します。
- 上下の余白:スライダーを使用して、ブッキングカレンダーの上下の余白を調整します。
- 左右の余白:スライダーを使用して、ブッキングカレンダーの左右の余白を調整します。
- ヘッダーと本文の間隔:スライダーを使用して、ヘッダーと本文の間隔を調整します。
![ブッキングカレンダーのレイアウトを選択しているスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/07/26/17830b62-e4d0-49d1-aa02-465a0afef6ee/855d4ad0-1ea8-4339-bbd8-e4fae8e75233.png)
ヒント:
エディタ上部の「モバイルエディタに切り替え」をクリックして、モバイルのレイアウトを調整することもできます。「月表示」または「週表示」の 2つのレイアウトスタイルから選択できます。
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/10/28/b73f1e1c-7a7b-4b5d-9af6-e482cfd20909/52c181f8-0468-465e-ab80-8d79a0800c5e.png)
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/10/28/b73f1e1c-7a7b-4b5d-9af6-e482cfd20909/52c181f8-0468-465e-ab80-8d79a0800c5e.png)
カレンダーページに表示するものを選択する
カレンダーページには、サービスのサブタイトルや日時など、サービスについての詳細情報を表示する複数の要素が含まれています。必要に応じて、特定の要素を表示または非表示にすることができます。
カレンダーに表示するものを選択する方法:
- エディタでブッキングカレンダーページに移動します:
Wix エディタ | こちらをクリックして手順を確認しましょう
Editor X | こちらをクリックして手順を確認しましょう
2. エディタでブッキングカレンダーをクリックします。
3.「設定」をクリックします。
4.「表示設定」タブをクリックします。
5. 表示するものを選択します:
- ヘッダー
- 適切なチェックボックスを選択して、サービスタイトルの下にあるサブタイトルまたはフィルターを表示または非表示にします。
- サービスタイトルの下に表示するテキストを選択します。
- カスタムテキスト:「テキスト」タブの「ヘッダー・フィルター」セクションで設定します。
- サービスサブタイトル:このオプションのテキストを設定するには、「サービスを管理」に移動し、サービスをクリックします。
- 日時:
- 該当するチェックボックスを選択して、「現在の日付」または「次の予約可能日」のいずれかを表示させます。
- 該当するチェックボックスを選択して、「満員・予約終了を含むすべての時間帯」または「利用可能な時間帯のみ」のいずれかを表示させます。
- (オプション)「時間帯の表示を制限」トグルを有効にして、表示させる時間帯の数を少なくします。スライダーを使用して、1日に表示される時間帯の数を設定します。
- 予約内容:オンラインサービス用の「ビデオ会議バッジを表示」トグルを有効にします。
![予約内容を有効にする方法を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/07/28/c2371962-c06e-4583-9b9a-efc10729659f/10009f93-c7ea-4601-b8ab-2944916f289f.png)
カレンダーページをデザインする
サイト全体のデザインに合わせて、ブッキングカレンダーに独自のデザインを適用することができます。ブッキングカレンダーは動的ページであるため、一度デザインしておくと、すべてのサービスに指定したデザインが適用されるようになります。
カレンダーページをデザインする方法:
- エディタでブッキングカレンダーページに移動します:
Wix エディタ | こちらをクリックして手順を確認しましょう
Editor X | こちらをクリックして手順を確認しましょう
2.「ブッキングカレンダー」パーツをクリックします。
3.「設定」をクリックします。
4.「デザイン」タブをクリックします。
5. カスタマイズするデザインを選択します:
- スタイル:ウィジェット、ヘッダー、枠線、区切り線の背景色を変更します。
- テキスト:ページ全体のさまざまなテキスト要素のフォントと色を選択します。
- セレクション:顧客がページ上でクリックできるボタンやその他の要素(例:カレンダーの日付など)をデザインします。
![ブッキングカレンダーのデザインをカスタマイズする方法を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/07/28/ed8a8a8d-2e57-401b-95f5-efa7b7cee623/68b96f57-52f3-42bd-bc9b-edb8ab987f3a.png)
カレンダーページのテキストを編集する
カレンダー上のすべてのテキスト要素は、ビジネスや顧客に合わせて編集することができます。スタッフや顧客にとって分かりやすいテキストで説明するようにしてください。
カレンダーページのテキストを編集する方法:
- エディタでブッキングカレンダーページに移動します:
Wix エディタ | こちらをクリックして手順を確認しましょう
Editor X | こちらをクリックして手順を確認しましょう
2.「ブッキングカレンダー」パーツをクリックします。
3.「設定」をクリックします。
4.「テキスト」タブをクリックします。
5. カスタマイズするテキスト要素を選択します:
- ヘッダー・フィルター:場所ラベル、スタッフラベル、期間ラベルなどのテキストを変更します。
- 日時:顧客がキャンセル待ちの場合に表示されるテキストをカスタマイズします。
キャンセル待ちのテキストについて
- 予約内容:顧客がチェックアウトに進む前に表示されるテキストを編集します。
- 予約ボタン:オンライン予約ボタン、予約リクエストボタン、キャンセル待ちボタン、予約変更ボタンなど、カレンダーに表示されるさまざまなボタンを編集します。
![ブッキングカレンダーに表示されるテキストを編集する方法を示したスクリーンショット。](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/6c3762e1-9c1a-4295-a5a9-bf8de5216635/2022/07/28/257a86bc-8af8-4afb-bde2-94c53f6004df/00fb290e-d985-4086-b3ea-9cd87e9014fd.png)
ヒント:
- 地域設定で選択したビジネス所在地によって、週の最初の曜日として使用される日が決まります。地域設定を変更する方法はこちら
- キャンセルポリシーをカレンダーに追加できます。
お役に立ちましたか?
|