Build a Dynamic Blog in Webflow: From CMS Collection to Paginated List

Start with a CMS Collection

Create a CMS collection named Blog Posts and add the following fields:

• Title (Plain Text)
• Slug (Plain Text – URL‑friendly, unique)
• Body (Rich Text)
• Publish Date (Date)
• Featured Image (Image)

Each new post is stored as an item in this collection. The Slug field determines the URL of the individual post page (e.g., /blog/my-first-post/). Ensure the slug is unique; Webflow will flag duplicates during publish.

Add a Dynamic List to a Page

On the page where you want the blog index (e.g., /blog/), drag a Dynamic List element into the layout. In the settings panel, select the Blog Posts collection and choose All items as the query. This tells Webflow to retrieve every collection item.

Bind Collection Fields

Inside the dynamic list, bind each field to a visual element:

• Drag the Title field onto a heading element.
• Drag the Body field onto a text block (you may truncate with Show more if desired).
• Drag the Featured Image field onto an image element.
• Wrap the entire list item in a Link Block and set the link to Collection Page. This links each list entry to its dedicated post page.

Configure the Collection Page Template

The Blog Posts collection automatically generates a template page (e.g., /blog/[slug]/). Open this template and bind the same fields to the page elements as you did in the list. Because the template inherits the field bindings, any change in the list automatically reflects on the individual post pages.

Add Pagination

Return to the page with the dynamic list. Inside the list settings, add a Pagination element. Set Items per page to the desired number (e.g., 2). Webflow will create URLs like /blog/page-2/ for subsequent pages. Publish the site and navigate to /blog/page-2/ to verify that the second set of posts appears.

Common Pitfalls & Limits

• Duplicate Slugs – Webflow will block publish and show a validation error. Fix the slug and republish.
• Hide Unpublished Items – The Hide collection items that are not published option is on by default. Uncheck it if you want to preview drafts or future‑dated posts.
• Large Collections – Collections with more than ~2000 items can slow the editor and increase page load times. Use filters or pagination to keep the list manageable.
• Unbound Fields – Forgetting to bind a field means it won’t render on the list or template. Double‑check bindings after moving elements.

After each change, always Publish the site to see the live effect. Check the live URLs to confirm that pagination and individual post pages work as expected.