How to show CMS content with repeaters in Wix Studio Two

4 days ago

4 min read

Updated: 6 hours ago

In the Studio Two editor, add a repeater and connect it to a CMS collection to list items. Then add an item page from Site Structure so each item gets its own URL, and link each repeater item to that page with Connect to Data.

Screenshot of a repeater in the Studio Two Editor after clicking Manage Source. — Image: Wix Help Center, “Studio Two Editor: Adding and Setting Up Repeaters”

Before you start

A site with the CMS added and at least one collection. The Collection page option does not show otherwise.
Fields in the collection for the content you want to show, such as title, image and price.
Add the item page before you try to link list items to it. A repeater cannot create an item page.

Step by step

Add a repeater to the page. Hover over the Add Elements icon at the top left, select Elements, open Layout Tools and go to the Repeaters tab. Drag a repeater onto the page.
Connect it to a collection. Click Choose a Collection on the repeater's banner. Either start from the sample content, which creates a new collection, or pick an existing one, then click Connect Collection. To design first, use Skip for now and connect later.
Check the connected elements. The editor connects the elements inside the repeater to fields for you. It may pick a different field than you want or skip an element. Pink labels mark connected elements, blue labels mark static ones.
Connect elements you add later. Select the element, open the Inspector and go to the Settings tab. Click Connect to data next to the property, choose the field and click Apply. For text and images you can also use Connect to Data in the action bar dropdown.
Filter, sort and set the item count. Select the repeater and click Manage followed by the source name on the action bar. Use Filter to limit items, Sort to set the order (up to 3 sorts) and Items per load to control how many load at a time. None of this changes the collection itself.
Add an item page. Open Site Structure, go to the Pages tab and click Add Page. Select Collection page, choose the collection, click Continue, open the Item page tab, pick a template and click Add. The template's elements arrive connected to the collection fields.
Preview and connect the item page. Use the preview toolbar at the top of the canvas to step through items and check long titles or missing images. To add more elements, use Connect to Data and pick the item page as the source, for example Books (Item Page). No repeater is needed on this page.
Link each repeater item to its page. Select a button or other element inside a repeater item and open the Settings tab in the Inspector. Click Connect to data next to Links to, make sure Get Dynamic Link is selected under Field, then choose the item page under Page Link Parameter. Click Done, then Apply.
Review the URLs and page settings. Each URL is a collection prefix plus the item's slug. Change the prefix under the item page's Settings in Site Structure, and edit a slug through Edit item on the preview toolbar. The same Settings menu controls access and SEO for all item pages.

Screenshot of choosing the collection that will connect to the repeater. — Image: Wix Help Center, “Studio Two Editor: Adding and Setting Up Repeaters”

Screenshot of connecting a repeater to a Wix app source. — Image: Wix Help Center, “Studio Two Editor: Adding and Setting Up Repeaters”

Good to know

Item pages replace the dynamic pages of the Studio Editor and Wix Editor. There is no separate dynamic list page type. To list items, use a page with a repeater or add a repeater to any page.
A repeater connects to one source only. To show content from two sources, use two repeaters.
Changing a URL prefix or an item slug creates a new URL, so shared links stop working. Connect a custom domain first if you want automatic redirects. Slugs must be unique and can have up to 100 characters.
You can't drag items into a custom order. Add a number field such as Display order to the collection and sort by it.
A source is grayed out in Connect to Data when it has no field that fits the element, for example an image with no image field.
Repeaters in Studio Two are always connected to data. Without a connection every item shows the same content. Items can hold any element, including videos, multi-state boxes and nested repeaters.

parnii note

Add the item page before you build the repeater's links, and preview it with your longest title and an item without an image. Check every auto-connected element in the repeater after you connect or change its source.

FAQ

Do I need a dataset to connect elements in Studio Two?

No. You connect elements directly to a data source, such as the item page or a CMS collection. Use the action bar or the Settings tab in the Inspector.

Can I create an item page from a repeater?

No. Add the item page for the collection from the Site Structure panel first. After that, you can link repeater items to it with Connect to data next to Links to.