Built on WIX Headless

ドキュメント ウィジェット Repeater ウィジェット

Repeater ウィジェット

CMS for Harmony の Repeater で、Wix Harmony 上に CMS 連携のカード・リスト・グリッドを構築します。

Repeater ウィジェットは、コレクションフィールドを繰り返しレイアウト — カード、リスト、グリッド — にマッピングします。CMS for Harmony では、「カード」は別ウィジェットではなく Repeater のレイアウトを意味します。

できること

  • Data source — Wix CMS コレクション、または External Database(Google Sheets、Pro);External databases を参照
  • AI setup — 欲しい内容を平易な言葉で説明し、Manual で調整;AI setup を参照
  • 任意のコレクションフィールドを表示(並べ替えとスタイル付け)、Address(テキスト、OpenStreetMap、または両方)、Color(スウォッチ、hex、または両方)、Video(モーダル/クリック再生/ミュート自動再生)、Reference / Multi-reference を読みやすいラベルとして含む
  • グリッド、リスト、行レイアウト(カード幅、配置、背景、パディング、シャドウ付き)
  • Card background — 全カード共通の Solid color、または Image from field(画像または動画)。Fit、Focus、画像がないときの Fallback color
  • カスタムカードレイアウト: 各カード内のグリッド上にフィールドを配置
  • Date & time フィールドの Show timezone(訪問者のローカル略称)
  • 検索とフィルター(固定の Choose value フィルター、Dependent filters、Add as URL query params、Reference フィールド、Color スウォッチ、Filters display の上/サイドを含む)
  • Data refresh — Show refresh button および/または Auto-refresh で、訪問者が最新のコレクションデータを再読み込みできます
  • Scroll to top on page change — 訪問者がページネーションのページを変更すると、ウィジェット上部が見える位置までスクロールします
  • Quick view — 追加のアイテムフィールドをポップアップで開く(カードクリック、ボタン、および/またはフィールドトリガー;サイズ、レイアウト、前後ナビ)
  • Payments(Pro)— コレクションでカタログ決済が有効なとき、各カードで Add to cart/Buy now
  • カード全体またはボタンを Dynamic Page にリンク(Wix CMS のみ)
  • スナップとコントロール付きのモバイル行スクロール
  • タイトル、本文、ボタン、検索 UI にサイトフォントを使用

セットアップ

  1. Add → Elements → Installed Apps → CMS for Harmony から Repeater を追加します(同じウィジェットを複数回追加できます)。
  2. コレクションを接続 — または Data source を External Database に設定し、Google Sheets 接続(Pro)を選びます。または AI setup を開き、レイアウトを平易な言葉で説明します。
  3. レイアウト(グリッド/リスト/行)とスタイルを選びます。
  4. 必要に応じてアイテムページへリンク(Wix CMS)、検索/フィルター、Data refresh、Scroll to top on page change、Quick view、決済アクションを有効にします。

AI setup

パネルで AI setup に切り替え、短い説明から Repeater を設定します(フィールド、レイアウト、フィルター、デザイン、Quick view、決済など)。Undo/Continue を使うか、Manual に切り替えて細かく調整します。詳細: AI setup。

Data refresh

Data refresh で Show refresh button および/または Auto-refresh をオンにし、訪問者が最新のコレクションデータを再読み込みできるようにします。Auto-refresh はタブが非表示のとき一時停止します。同じページの Form で Update displays on this page が有効で、同じコレクションを使っている場合、送信後にこのウィジェットも再読み込みできます。

Scroll to top on page change

ページネーションがオンのとき、Scroll to top on page change を有効にすると、Prev/Next でページがスクロールし、ウィジェット上部が見える位置になります。

Quick view

Quick view パネルセクション(Wix CMS)でポップアップを有効にし、表示するフィールドを選びます。開き方(カードクリック、専用ボタン、および/またはフィールドクリック)、サイズとレイアウト、訪問者がアイテム間を前後移動できるかを設定します。Dynamic Page リンクが設定されている場合は、ポップアップ内の View full page を使います。

Address フィールド

CMS の Address フィールドでは、Formatting でフィールドを開き、Display as を設定します。

  • Text — 整形された住所行
  • Map — インタラクティブな OpenStreetMap のピン(値に座標が必要)
  • Text and map — 両方

マップの高さも設定できます。マップモードを選んでも座標がない場合、可能なときはテキストにフォールバックします。

Video フィールド

Video フィールド(およびギャラリー内の動画)では、Video playback をモーダルで開く、クリックでインライン再生、またはミュート自動再生に設定します。

Color フィールド

CMS の Color フィールドでは、Display as を Swatch、Hex、または Swatch and hex に設定し、必要に応じてスウォッチサイズを調整します。

Reference フィールド

Reference / Multi-reference フィールドでは、カード上(およびフィルター内)に表示するラベル用に、関連コレクションから Display field を選びます。

チームディレクトリ、商品カード、ポートフォリオに適しています。