Wix ヘルプセンター
    ホーム
  1. サイトの作成
  2. 高度な機能
  3. CMS
  4. その他 Wix 製品と CMS の連携
    5. CMS：ストアの商品ページまたはブッキングページにコレクションのコンテンツを表示する

CMS：ストアの商品ページまたはブッキングページにコレクションのコンテンツを表示する

読了時間：15分
CMS（コンテンツ管理システム）を使用すると、コレクションのコンテンツをストアの商品ページまたはブッキングページに直接表示できるようになります。これにより、追加情報で商品やサービスのリストをパーソナライズやしたり強化したりすることができ、顧客により充実した体験を提供することができます。

まず、Wix アプリコレクションを参照するコレクションを作成します。ここには、ストアページまたはブッキングページに統合したい追加情報を保存します。Wix ブッキングを使用している場合は、Velo のコードを使用してカスタムブッキングページを構築する必要があります。次に、ページ上のデータセットを設定し、Wix ストアまたは Wix ブッキングアプリのコレクションと「Details（詳細）」CMS コレクションに接続します。最後に、リッチコンテンツなどのサポートされているパーツを「詳細」コレクションに接続して、追加情報を表示します。

これはあなたのオンラインビジネスにとって画期的なことです。たとえば、ブティックオーナーが顧客に商品をより深く知ってもらいたいと考えていると想像してみてください。このプロセスを使用すると、商品ページで直接商品の裏話や具体的なお手入れの方法などの情報を簡単に追加することができます。
重要
ブッキングページに CMS コレクションのコンテンツを表示する機能は、現在一部の Wix アカウントでのみご利用いただけます。この機能は段階的に公開中です。
始める前に：

ステップ 1 | Wix アプリコレクションを参照するコレクションを作成する

  1. ストア / ブッキングページに統合したい追加情報を保持するための、複数アイテム（デフォルト）コレクションを作成します。
  2. 「＋アイテムを追加」をクリックして、追加の詳細を保存したい各商品またはサービスのアイテムを追加します。
  3. 「＋フィールドを追加」をクリックして、保存したいコンテンツのタイプごとにフィールドを追加します（例：リッチコンテンツなど）。
  4. 該当するセルをクリックして、各アイテムにコンテンツを追加します。
  5. 「参照」フィールドタイプを追加し、該当する Wix ストアまたはブッキングアプリのコレクションに接続します：
    1. 「フィールドを管理」をクリックし、「＋フィールドを追加」をクリックします。
    2. 「参照」を選択し、「フィールドタイプを選択」をクリックします。
      ヒント：アイテムのコンテンツを複数の商品またはサービスに使用する場合は、「複数の参照先」フィールドを選択します。
    3. 「フィールド名」を入力します。
    4. （Velo のみ）必要に応じて、サイトのコードで使用されている「フィールド ID」を更新します。この ID は後で更新することはできません。
    5. 「参照先コレクション」ドロップダウンをクリックし、該当する Wix アプリコレクションを選択します。たとえば、「ストア」下の「商品」を選択したり、「ブッキング」下の「サービス」を選択したりすることができます。
    6. （オプション）ヘルプテキストを入力して、フィールド名の横にマウスオーバーで表示されるツールチップテキストを追加します。
    7. 「保存」をクリックします。
  1. 各アイテムについて、参照フィールドをクリックし、該当する商品またはサービスを選択します。前のステップで複数の参照先フィールドを追加した場合、複数の商品またはサービスを選択できます。

ステップ 2 |（ブッキングのみ）カスタム予約ページを作成する

CMS コレクションの詳細をブッキングサービスページまたはカレンダーページに追加したい場合は、カスタムページに変換する必要があります。このステップではコードを追加し、 Velo API を使用します。変換する必要があるのは、CMS コレクションから詳細を追加したいブッキングページのみです。

以下の該当するリンクをクリックし、手順に従ってカスタム予約ページを作成します：

ステップ 3 | ページにデータセットを設定する

ページには 2つのデータセットが必要です。1つはストアまたはブッキング Wix アプリコレクションに接続され、もう 1つは「詳細」CMS コレクションに接続されます。

  • Wix アプリコレクションデータセット： Wix ストアまたは Wix ブッキングアプリ内で保存および管理されている商品やサービスなどのコンテンツを読み取ります。このデータセットに URL スラッグフィルターを追加します。サポートされている要素をデータセットに接続して、Wix ストアや Wix ブッキングのコンテンツを表示することができます。
  • 詳細データセット：独自の CMS コレクションから、商品やサービスについて保存した追加のコンテンツを読み取ります。参照フィールドまたは複数参照フィールドを絞り込むためのフィルターをデータセットに追加します。リッチコンテンツなどの要素をこのデータセットに接続して、CMS の「詳細」コレクションに追加したコンテンツを表示します。

ストア | 商品ページにデータセットを設定する

Wix エディタ
Wix Studio エディタ
  1. エディタにアクセスします。
  2. 商品ページにアクセスします：
    1. エディタ左側で「」。ページ・メニュー」 をクリックします。
    2. 「ショップページ」をクリックし、「商品ページ」を選択します。
  3. 「詳細」CMS コレクションに接続するデータセットを追加します：
    1. 左側の「CMS」  をクリックします。
    2. 「コンテンツパーツを追加」をクリックします。
    3. 「データセット」をクリックします。
    4. 「コレクションを接続」ドロップダウンをクリックし、「詳細」コレクションを選択します。
    5. 必要に応じて「データセット名」を編集し、「作成」をクリックします。
  4. Wix ストアアプリコレクションに接続するデータセットを追加します：
    1. 右側のパネルの下部にある「データセットを追加」をクリックします。
    2. 「コレクションを選択」ドロップダウンをクリックし、Wix アプリコレクションの「Stores」下で「Products」を選択します。
    3. 必要に応じて「データセット名」を編集し、「作成」をクリックします。
  1. Stores/Products データセットに URL スラッグフィルターを追加します：
    1. Stores/Products データセット横の「その他のアクション「アイコン  をクリックし、「データセット設定「を選択します。
    2. 「フィルター」下の「＋フィルターを追加」をクリックします。
    3. 「フィールド」ドロップダウンをクリックし、「Slug（テキスト）」を選択します。
    4. 「条件」の値は「である」のままにします。
    5. 「値の参照元」で「URL Slug」を選択します。
    6. 「フィルターを追加」をクリックします。
  1. 「詳細」データセットに参照フィルターを追加します：
    1. 右側の「データセット設定」パネルの上部にある「すべてのページのデータセット」をクリックします。
    2. 「詳細」データセット横の「その他のアクション「アイコン  をクリックし、「データセット設定「を選択します。
    3. 「フィルター」下の「＋フィルターを追加」をクリックします。
    4. 「フィールド」ドロップダウンをクリックし、「参照（Products）」または「複数の参照先（Products）」を選択して、「フィルターを追加」をクリックします。
  1. CMSの「詳細」コレクションから詳細を表示したい、サポートされている要素を追加します。たとえば、リッチコンテンツ要素またはプロギャラリーなどを追加することができます。
  2. 「詳細」データセットの該当するフィールドに要素を接続します。
  1. 「プレビュー」ツールバーを使用して、該当する商品の接続をテストします。
  2. 変更内容を公開する準備ができたら、サイトを公開します。

ブッキング | サービスページまたはカレンダーページにデータセットを設定する

Wix エディタ
Wix Studio エディタ
  1. エディタにアクセスします。
  2. CMS コレクションの詳細を表示したいカスタムブッキングページに移動します：
    1. エディタ左側で「」。ページ・メニュー」 をクリックします。
    2. 「ブッキングページ」をクリックして、該当するページを選択します：
      • カスタムサービスページ：このページには、個々のサービスに関する詳細が表示されます。各サービスには独自の URL バージョンのページがあります。
      • カスタムブッキングカレンダー：顧客は予約したいサービスを選択した後、このページで予約したい日時を選択します。
  1. 「詳細」CMS コレクションに接続するデータセットを追加します：
    1. 左側の「CMS」  をクリックします。
    2. 「コンテンツパーツを追加」をクリックします。
    3. 「データセット」をクリックします。
    4. 「コレクションを接続」ドロップダウンをクリックし、「詳細」コレクションを選択します。
    5. 必要に応じて「データセット名」を編集し、「作成」をクリックします。
  2. （まだ追加していない場合）Wix ブッキングアプリのコレクションに接続するデータセットを追加します：
    1. 右側のパネルの下部にある「データセットを追加」をクリックします。
    2. 「コレクションを選択」ドロップダウンをクリックし、Wix アプリコレクションの「Bookings」下で「Services」を選択します。
      ヒント：「BookingsV2」下ではなく、「Bookings」下の「Services」を選択してください。
    3. 必要に応じて「データセット名」を編集し、「作成」をクリックします。
  1. Services データセットに URL スラッグフィルターを追加します：
    1. Services データセット横の「その他のアクション「アイコン  をクリックし、「データセット設定「を選択します。
    2. 「フィルター」下の「＋フィルターを追加」をクリックします。
    3. 「フィールド」ドロップダウンをクリックし、「Slug（テキスト）」を選択します。
    4. 「条件」の値は「である」のままにします。
    5. 「値の参照元」で「URL Slug」を選択します。
    6. 「フィルターを追加」をクリックします。
  1. 「詳細」データセットに参照フィルターを追加します：
    1. 右側の「データセット設定」パネルの上部にある「すべてのページのデータセット」をクリックします。
    2. 「詳細」データセット横の「その他のアクション「アイコン  をクリックし、「データセット設定「を選択します。
    3. 「フィルター」下の「＋フィルターを追加」をクリックします。
    4. 「フィールド」ドロップダウンをクリックし、「参照（Services）」のフィールドを選択して、「フィルターを追加」をクリックします。
  1. CMSの「詳細」コレクションから詳細を表示したい、サポートされている要素を追加します。たとえば、リッチコンテンツ要素またはプロギャラリーなどを追加することができます。
  2. 「詳細」データセットの該当するフィールドに要素を接続します。
  1. （まだ接続していない場合）サービスデータセットに要素を追加・接続して、Wix ブッキングアプリのコレクションから詳細を表示します。
  2. 右上の「プレビュー」をクリックし、プレビューツールバーを使用して、該当するサービスの接続をテストします。
  3. 変更内容を公開する準備ができたら、サイトを公開します。

お役に立ちましたか？

|

この記事では下記を説明します。

  • ステップ 1 | Wix アプリコレクションを参照するコレクションを作成する
  • ステップ 2 |（ブッキングのみ）カスタム予約ページを作成する
  • ステップ 3 | ページにデータセットを設定する
  • ストア | 商品ページにデータセットを設定する
  • ブッキング | サービスページまたはカレンダーページにデータセットを設定する