Designing with dynamic content

The Webflow CMS gives your team the flexibility to separate structure, design, and content management — making it easier to collaborate and scale your site efficiently.

• Designers can set up CMS structures and design reusable layouts using Collection Lists and Collection Pages.‍
• Content editors and marketers can update content directly using Edit Mode, without needing design access.

This means content can be updated in context — with less back-and-forth and no risk of breaking layouts.

Collection Lists vs Collection Pages

Both Collection Lists and Collection Pages let you design with CMS content, but they serve different purposes:

• Collection Lists display multiple CMS items, like blog posts, projects, or team members,  in a single list or grid. They can be added to any page on your site and update automatically as new items are added to the CMS.‍
• Collection Pages are automatically generated template pages for each CMS item. When you add a new item to a Collection, a corresponding page is created using your design layout.

Collection Lists

A Collection List displays multiple CMS items, like blog posts, projects, or testimonials, anywhere on your site. As new items are added to the CMS, they automatically appear in the list based on your chosen filters, sort order, and display settings. Collection Lists are ideal for showcasing structured content in repeatable layouts like grids, sliders, or cards.

Tip: Use filters and sort order to control what’s shown in your Collection List — for example, show only featured posts, or list items by most recent date.

Common use cases:

• Blog indexes and news feeds showing post previews
• Portfolio or gallery pages displaying projects or case studies
• Team, testimonial, or product listings with consistent formatting
• Featured content modules (e.g., “Latest articles” or “Most popular stories”)

Advanced features:

• Conditional visibility – Show or hide elements within a Collection Item based on CMS field values (e.g., only show a “Featured” label if a post is marked as featured)
• Curated Collection Lists – Manually select specific CMS items and control their order for things like static resource sections, top-nav menus, or custom highlights
• Nested Collection Lists – Display related content within a Collection Item (e.g., show tags or authors inside each blog post preview)

These features give you control over not just what you display — but how, when, and where you display it.

Collection Pages

A Collection Page is a CMS-generated template that creates an individual page for each item in a Collection. Each page’s URL is automatically generated from the item’s slug — a required field in every Collection that ensures each item has a unique web address. 

You design the layout once, and then Webflow dynamically populates each page based on the content from its corresponding Collection item. Because all pages follow the same template, they maintain a consistent structure and visual design — making it easier to manage content at scale.

Tip: Just getting started? You can generate sample items when you create a Collection. This gives you real-looking content to design with — and you can replace it with actual content anytime.

Common use cases:

• Blog post pages with titles, authors, featured images, and body content
• Product detail pages with specs, pricing, and descriptions
• Team member bios with profile images, job titles, and bios
• Customer story or case study pages with rich, structured storytelling

By using Collection Lists and Pages strategically, your team can build a scalable design system that empowers non-designers to manage content independently.

Next up: Additional resources

In the next lesson, we’ll share additional resources and tools to help you continue learning and start building dynamic content with confidence.

Click Complete & continue to mark this lesson complete and move on to the final lesson in this course.