Documentation

Documentation

Connecting CMS to Pages

How to connect a CMS collection to a Framer page to create dynamic routes like /blog/[slug]

How to connect a CMS collection to a Framer page to create dynamic routes like /blog/[slug]

AURA Team

Connecting a CMS collection to a page creates a dynamic route — one page layout that renders unique content for each collection item. This is how /blog/[slug], /careers/[slug], and /doc/[slug] work in AURA.

When you need to do this

Any time you want individual URLs per CMS item, you need a collection page. If you add a new collection — say, Case Studies — you'll need to create a /case-study page and connect it to that collection before individual case study URLs will work.

How to connect a collection to a page

Create a new page in the Pages panel. Right-click the page name and open Page Settings. In the Collection field, select the CMS collection you want to connect. The page URL automatically updates to /[page-name]/[slug]. A CMS item dropdown appears at the top of the canvas — this lets you preview how different items render in the layout.

Binding text elements to CMS fields

Click any text element on the collection page. In the right panel under Text, click the Content field. A variable picker appears. Select the CMS field to bind — Title, Body, Category, and so on. The element now displays the correct value for whichever item is selected in the canvas dropdown. Switch items in the dropdown to verify every field is binding correctly.

Rich text fields

The Body and Content fields in AURA's collections are rich text. These must be bound to a Framer Rich Text element — not a standard text element. Insert a Rich Text element from the CMS section of the Insert panel. Binding a rich text field to a standard text element will display raw HTML rather than rendered content.

Testing dynamic routes

After connecting and binding, use the Preview button to test. Navigate to /blog/your-slug in the preview — you should see the correct content for that specific item. If you see the wrong content or empty fields, check that every text element on the page is bound to the correct CMS field.

Create a free website with Framer, the website builder loved by startups, designers and agencies.