Wix ブッキング:サービスリストを設定する
読了時間:9分
サービスリストには、提供しているすべてのクラス、コース、プライベート予約が表示されます。1つのページにすべてのサービスを表示させることも、異なるページにカテゴリー別にサービスを表示させることもできます。また、サービスリストのデザインは、ブランドに合わせてカスタマイズすることも可能です。
ステップ 1 | サービスリストを作成する
サービスリストを追加し、そのページに関連するサービスのみを表示させます。サービスリストは、ビジネスの成長や提供するサービスの数に応じて更新することができます。
サービスリストを作成する方法:
- サービスリストを表示させたいページに移動します。
- エディタで「追加」パネルにアクセスします:
- Wix エディタ:エディタ左側で「追加」 をクリックします。
- Editor X:Editor X の上部で「要素を追加」 をクリックします。
- 「サービス予約」をクリックします。
- 「サービスリスト」をクリックします。
- テンプレートを選択し、サービスリストパーツをページにドラッグします。
- 「サービスリスト」ウィジェットをクリックします。
- 「設定」をクリックします。
- 「サービス」をクリックします。
- 「サービスの表示方法を選択」下で、該当するオプション(「カテゴリーで選択」、「サービスの提供場所で選択」、または「サービスをひとつずつ選択」)の横にあるチェックボックスを選択します。
- 表示したいカテゴリー、場所、またはサービスの横にあるチェックボックスをクリックして選択します。表示されるオプションは、上記の手順 9 で選択したものによって異なります。
ステップ 2 | サービスリストのレイアウトをカスタマイズする
サービスリストのレイアウトをカスタマイズして、サービスを紹介し、より多くの予約を獲得しましょう。提供するサービスの数が増えても、レイアウトで見やすさを調整することができます。
サービスリストのレイアウトをカスタマイズする方法:
- エディタでサービスリストをクリックします。
- 「設定」をクリックします。
- 「レイアウト」タブをクリックします。
- オプションを使用して、サービスリストのレイアウトをカスタマイズします:
- レイアウトを選択:サービスリストのレイアウトを選択します。
- グリッドレイアウトを選択した場合は、「行ごとの最大カード数」を設定します。
- カードの間隔:リスト内のサービスの間隔を設定します。
- サービス詳細の余白:サービス詳細の端からの余白と上下の余白を設定します。
- 画像のレイアウト:サービスリストの画像の形とクロップの位置を選択します。
- テキストのレイアウト:リストタイトルとサービステキストの配置を設定します。
- レイアウトを選択:サービスリストのレイアウトを選択します。
ヒント:
モバイルで、エディタ上部の「モバイル版を編集」をクリックして、レイアウトを調整することもできます。
「レイアウト」タブで、サービス画像の 2つのレイアウトスタイルと 3つのシェイプから選択します。ストリップレイアウトも完全にレスポンシブになり、モバイルでのエクスペリエンスが向上しました。
ステップ 3 | サービスリストの表示設定をカスタマイズする
次に、サービスページの表示設定を調整して、サービスの詳細を追加します。これは、サービスを分類するのに最適な方法です。料金、日付、およびサービスをオンラインで提供するかどうかも含め、表示を設定することができます。
サービスリストの表示設定をカスタマイズする方法:
- エディタでサービスリストをクリックします。
- 「設定」をクリックします。
- 「表示設定」タブをクリックします。
- オプションを使用して、サービスリストの表示をカスタマイズします:
サービスリストに表示させる内容を選択する
表示させるサービスの詳細を選択する
サービスを予約するボタンを追加する
「プランを見る」リンク
サービス名または画像をクリックした際に表示されるページを選択する
ステップ 4 | サービスリストのテキストを編集する
表示設定を終えたら、ユーザーを案内するサービスリストのテキストを編集します。タイトルとタブの名前をカスタマイズして、ユーザーに詳細を提示し、セッションを予約してもらいましょう。
サービスリストのテキストを編集する方法:
- エディタでサービスリストをクリックします。
- 「設定」をクリックします。
- 「テキスト」タブをクリックします。
- 以下のオプションを使用して、サービスリストのテキストをカスタマイズします:
- リストタイトル:サービスリストに目を引くタイトルを付けて、より多くの関心を集めるようにします。
- すべてのサービスのタブ:すべてのサービスを一覧表示するメインタブの名前を変更します(表示設定でトグルを有効にした場合)。その他のタブには、異なるサービスカテゴリーの名前が表示されます。
- 「詳細はこちら」リンク:このボタンをクリックすると、ユーザーは閲覧専用サービスに関する詳細情報が記載されたページに移動します。
- ビデオ会議バッジ:このテキストを編集して、オンラインサービスにより多くの関心を集めるようにします。
- 残り予約枠:このテキストは、コースの残りの予約枠を表します。
- 満員テキスト:このテキストは、コースが満員になった場合に表示されます。
- オンライン予約ボタン:これは、ユーザーにサービスを予約してもらうためのメインの CTA(行動喚起)ボタンです。ユーザーがすぐにサービスを予約できるよう、適切なテキストを選択します。
- 詳細ボタン:このボタンで、サービスの詳細ページに移動することができます。
- 「予約リクエスト」ボタン:予約の完了に承認が必要なサービスのボタンに、テキストを追加します。
- コースを表示ボタン:このボタンは、コースが終了または満員になった場合に表示され、顧客をコースの詳細が記載された他のサービスに誘導します。
ステップ 5 | サービスリストをデザインする
サービスリストのテキストを編集したら、サイトとブランドに合わせてサービスページのデザインをカスタマイズします。背景、区切り線、テキストスタイル、ボタンなどのデザインをカスタマイズすることができます。
サービスリストをデザインする方法:
- エディタでサービスリストをクリックします。
- 「設定」をクリックします。
- 「デザイン」タブをクリックします。
- サービスリストの次の領域をデザインします:
背景・区切り線
テキスト
ボタン
タブのデザイン