Browse all guides
Documentation
CMS and languages

Connect collections to list and detail pages

Reuse one design across many items and connect related content through reference fields.

Separate information from its design

A CMS collection holds content. A list page shows several items, such as an article index or a product grid. A collection detail page uses one shared design to show each item at its own address. This saves you from building and maintaining a separate page design for every item.

For example, an Articles collection can power a list at /articles and detail pages using /articles/[slug]. An item with the slug getting-started then appears at /articles/getting-started once the relevant page, collection, and item are published.

Connect the collection to pages

  1. Open the collection in CMS and inspect Connected pages.
  2. If items need individual URLs and there is no detail page, choose Create collection detail page. Review the proposed page before generating it.
  3. For a list or a custom arrangement, ask AI to use the existing collection. State the fields to show, order, filters, and where each card should link.
  4. Open the connected page in the page editor. Select different items to check that the shared design works with short, long, and incomplete content.

A useful request is: “Use the Articles collection to create an index with cover image, title, and summary. Link each card to its article detail page and show the newest articles first.” Review the resulting behavior; adding a field to the collection does not automatically place it in every page design.

Connect related content with references

A References field links items in another collection. For example, connect an article to a Person item for its author, or to Category items for its topics. Edit the connected item once when its reusable information changes.

  1. In the collection's Fields editor, add a References field and choose the related collection.
  2. Use a one-way relationship when you only need the link from the current collection. Enable a two-way relation when you also need to see the relationship from the linked collection.
  3. Open an item and select the related items in its reference field.
  4. Ask AI to display the related fields on the relevant page, such as an author name and photograph.

Check dependencies before publishing

Changing a reference field's target collection resets that field's existing relationships after confirmation. Review that impact before proceeding. A reference also does not automatically make an unpublished target item public.

Publish the relevant collection structure and page designs, then publish the content items and reference changes you want visitors to see. When information is missing publicly, check both sides of the connection: page publication, collection structure, item status, scheduled date, and language. Use preview to diagnose the draft, then verify the same relationship on the live page.

Related guides