Importing Collection Items

new course
CSS grid landing page tutorial (36min)

Lesson info

Lesson info

When you create CMS Collections in Webflow, you can enter your Collection Items manually, or, import them directly into a CMS Collection via a CSV. This allows you to import hundreds or even thousands of items from an external source.

In this video, we'll show you how to:

  1. ‍Upload a CSV to Webflow CMS
  2. ‍Configure fields and preview Collection Items
  3. ‍Import data

Explore this project

Want to dig into the project featured in this video and see how everything is put together? We've included the full project we used when making this lesson, and we've shared the link right under this very paragraph.

View and clone this projectDownload lesson assets
Clone this projectDownload project assets


A lot of times, we'll have access to huge amounts of data: items that we want to feed right into a collection without having to create them manually. Wouldn't it be great if would could simply configure and import a CSV right into a collection? In this video lesson, we're going to configure and import a CSV right into a collection.

Whether you've exported your CSV, or you're typing out your CSV manually, an optional first step is to configure the CSV for import. Here in Google Sheets, we have a pretty straightforward spreadsheet.

We've included a header row (which lets us specify the type of content contained in each column). In other words, each of these columns represents a field type. Each row? Represents an item.

Let's download this as a CSV — or if we're using Excel we can Save as... and choose from our File Format dropdown: CSV. Or if we're in Numbers, we can go to Export...CSV.

That's configuring a CSV. Most of the time, the Webflow CMS is going to be able to parse and import your content without manual configuration. But let's go in and drag the CSV right inside. We instantly get a good preview of what's happening with the content. First, we're making sure that the top row is a header. It doesn't need to be, maybe it's an item.

And once we continue, we can get even more specific regarding the following: not importing this content, creating a new field (if we want to create a field using this header...and choosing the field type from the dropdown), or mapping this content to an existing field (if we've already configured this field in our collection).

Over to the right, we have our item preview, and we can switch through the different items that we're importing. We can even click the dropdown and get super specific.

And when we're done? Just import...and that's it! We've imported these items right into our collection.