CMS: Displaying Collection Content in a Repeater

25 min read
Connect repeaters to the CMS (Content Management System) to display dynamic content from your collections. 

After connecting a repeater to a dataset that binds to your collection, choose which fields connect to each repeater element. Once connected, each item in your repeater displays content from a different collection item. This allows you to use a consistent layout that automatically populates content for all the items you want to show on your page.
始める前に
Make sure to add the CMS to your site if you haven't already. 

Step 1 | Create a CMS collection

Create a multiple item collection for storing the content you want to use in your repeater. Add collection fields that will connect to the elements in your repeater. Then add the items that will appear in your repeater and fill in the fields for each item. Set your collection permissions to determine the type of content you want to store and who has access to manage it. 
Wixエディター
スタジオエディター
Dashboard
  1. 編集者のところに行ってください。
  2. クリック CMS  エディターの左側にある
  3. Click Create Collection.
  4. Enter a name for your collection. 
  5. Leave Multiple items (Default) selected and click Create
  6. Add fields to your collection manually or by importing a CSV file:
  7. Add items to your collection:
    1. Click + Add Item.
    2. Add content about the item to each relevant field. 
    3. Repeat this step to create as many items as you need. 
A screenshot of adding an item in a CMS collection.
  1. Set permissions for the collection: 
    1. Click More Actions and select Permissions & privacy
    2. Choose which permissions to use for the collection:
      Note: Site owners and collaborators are always treated as admins when logged in to the live site. This means they can always view, add, update, and delete collection content from the live site. This rule applies no matter which collection permission you select. 

Step 2 | Add and customize your repeater

Add a repeater then drag elements such as text, images, or buttons onto its items/containers. You can adjust the size of the repeater or remove elements to make sure everything you need in the repeater can fit. When you add an element to a repeater, the element is automatically added to each repeater item. 

Later, you will connect the elements to collection fields to replace the content. Each repeater item will show a different item from your collection.
Wixエディター
スタジオエディター
  1. 編集者のところに行ってください。
  2. Go to the page or section where you want to add your repeater.
  3. クリック エレメントの追加  エディターの左側にある
  4. Click List.
  5. Click and drag the repeater you want to use onto the page. 
  1. Add or remove elements from your repeater. You can resize the repeater so it can fit all the necessary elements inside it. Later, you will connect the elements to collection fields to replace the content. Each repeater item will show a different item from your collection.
重要だ:
Make sure your repeater contains a button or image element, so you can link to the dynamic item page. This lets visitors click the image or button to navigate to the relevant item in the dynamic item page. 

Step 3 | Connect the repeater items to your collection

Datasets are the tool you use to connect your repeater elements to your collection fields. Once you connect an element to a dataset, you can choose which collection fields to use with each part of the element. Connect each element that you want to display collection content in. Then resize, move, or adjust the elements to your liking. 
Wixエディター
スタジオエディター
  1. In your editor, click the repeater you added.
  2. をクリックする。 CMSへの接続 アイコン .
  3. Click the Choose a dataset drop-down and select an existing dataset that connects to your collection. Alternatively, click Add a Dataset, then choose the collection you want to connect, give it a name and click Create.
A screenshot of selecting the relevant collection when connecting a dataset.
  1. Under Connections, click the element you want to connect first. 
  2. (Optional) If you want to connect the element to a different dataset, click the Choose a dataset drop-down and select another dataset. Otherwise, leave it connected to the same dataset. 
  3. Under Connections, click the relevant drop-downs to connect each part of the element to the relevant collection field. The options vary depending on the element type.
ヒント
  • To link the button element to the collection's dynamic item page, click the Click action connects to field and select the dynamic item page that ends with (Item).
  • To link an image element to the collection's dynamic item page, click the Link connects to drop-down and select the dynamic item page that ends with (Item).
A screenshot of connecting a button to the dynamic item page.
  1. 右側のパネルの上部にあるリピータ接続をクリックします。 
  2. Repeat steps 4-7 above to connect each element you want to display collection content in.  
A screenshot showing all the elements you can connect in a repeater's dataset.
  1. (Optional) Click to resize, move, or adjust any of the elements in your repeater. You can add, remove, connect or disconnect elements at any time. 

Step 4 | Manage the dataset settings

Adjust the dataset settings to control the dataset mode, the total items that can load at a time, the items that display, and the order in which they appear.  
Wixエディター
スタジオエディター
  1. リピーターの接続データセット設定にアクセスする:
    1. リピーターをクリックします。 
    2. をクリックする。 CMSへの接続 アイコン .
    3. Click Dataset Settings in the Connect Repeater panel on the right.
  2. をクリックする。 データセット・モード ドロップダウンからオプションを選択する: 
    • 読む: データセットがリピータにコレクション内容を表示することを許可する。
    • 読み取りと書き込み: データセットがリピータにコレクションコンテンツを表示し、訪問者が入力要素を使用してコレクションコンテンツを追加または編集できるようにします。 
  3. Edit the Maximum items displayed field to adjust the maximum items that can initially load in the repeater. This is also the maximum items that can load when visitors click 'Load More' buttons, 'Next/Previous page' buttons, or pagination bars.  See the next section for steps. 
A screenshot of the 'Maximum items displayed' dataset setting.
  1. (オプション) リピータ内の特定の項目のみを表示するには、+フィルタの追加を クリックします。 
  2. (Optional) Click + Add new sort to choose the order in which collection items appear in the repeater.

ステップ5|(オプション)「Load More」またはナビゲーションボタンを作成する

You can display up to 1000 items at a time in your repeater. However, if you want to display a lot of items, consider adding a 'Load More' button to improve loading performance. Adjust the 'Maximum items displayed' field to control the number of items that can load at a time in the dataset's connected repeater. 

The 'Maximum items displayed' field also determines the number of items displayed per 'page' in your repeater if you connect 'Next/Previous page' buttons or a pagination bar (Wix Editor only). 
Wixエディター
スタジオエディター
やりたいことを選択する: 

よくある質問

Click below for answers to the most frequently asked questions about connecting repeaters to the CMS. 

これは役に立ったか?

|