Static vs. dynamic content

Learn about the differences between static and dynamic content.

Static and dynamic content are the two types of content you can use to build your site. Static content refers to content that must be manually updated on an individual element, while dynamic content refers to content that is connected to a data source — such as the CMS, the current page, or the current locale — and updates automatically based on context.

Static content

Static content describes content that must be manually updated. You can style multiple elements that contain static content at once using classes, but you have to manage the static content manually and individually. Static content is useful on standalone pages with no repeating content structure, like the 404 error page, site home page, and password page.

Static content isn't practical for creating a site displaying similar types of content that is expected to change — like a blog, design portfolio, or news site. For instance, blogs often use the same formatting for each blog post — and it would be inefficient to create and design each individual blog post on your site. Using static content in this case would require manual duplication and modification of large amounts of content. Enter: dynamic content.

Dynamic content

Dynamic content describes content that is connected to a data source and updates automatically based on context. To connect an element to dynamic data, click the "Connect" icon (purple dot) next to the element setting or component prop you want to make dynamic — such as a text value, image source, or link URL. From the connect menu, you can choose a data source to bind to that setting.

Connect to CMS data

The most common data source is the Webflow CMS — when you reference CMS content on your site, your design is linked to dynamic data so you can update multiple instances of content all at once.

This is extremely efficient for sites that have similar and repeating content (e.g., blogs, news sites, team members, etc.). For example, you could create a Collection called “Blog posts” and design the Blog post Collection page, which serves as a template for all the blog posts in the Collection — meaning the same design will be used for all of the blog posts, and any time you make a change to the Collection page, it will automatically update the design for all of the blog posts in your Collection. Any time you add a new blog post to your Collection, it’ll share the same style as the rest of the blog posts.

Learn more about designing Collection pages.

Connect to current page and locale data

You can also connect elements to data from the current page or the current locale. For example, you can bind elements to the current page’s title, meta description, or Open Graph data — so a social share card component can automatically pull its image and text from the page’s Open Graph settings. Similarly, if your site has multiple locales, you can bind elements to locale data so content updates based on the visitor’s locale.