Connecting a Webflow site

Webflow sites connect through the Webflow CMS API. Posts are written into one CMS collection, so you connect the site, point it at the blog collection and map that collection's fields. This guide walks through each step.

Before you start

• You are an Owner or Admin of the company in Accounts, or of its agency.

• The Webflow site has a CMS collection for blog posts, with at least a name field, a rich text field for the body and a slug.

• You can open the site's settings in Webflow to create an API token.

Step 1: Generate a site API token

1. In Webflow, open the site's settings and go to Apps & integrations.

2. Under API access, generate a new API token and give it a clear name, for example "UP-TO-DATE".

3. Give it read and write access to the CMS. Read access to the site lets the platform read the site's name.

4. Copy the token. Webflow shows it only once.

Step 2: Find the Site ID and Collection ID

• Site ID: shown in the site's settings in Webflow.

• Collection ID: open the Designer, go to the CMS panel and open the blog collection's settings.

Step 3: Open Connect a Site

1. In Accounts, go to Companies > open the company > Websites tab.

2. Click Connect a Site. If the company already has sites, click Connect New Site.

3. Under Select your CMS, choose Webflow.

Step 4: Fill in the fields

Step 5: Test the connection

1. Click Test Connection. It becomes clickable when all five fields are filled in.

2. The test reads the items in the collection with your token.

3. When it passes, you see "Test connection successful! Credentials are valid."

Step 6: Map the collection fields

After a passed test, the Field Mapping section appears.

1. Click Fetch Webflow Collection Fields. The form shows the collection it connected to and its slug, and tries to match the fields automatically.

2. Check Collection URL Path. It builds post links as your domain, then this path, then the post slug. It is filled in from the collection's slug.

3. For each target field, choose the matching Source Field from your collection:

   • Title Field (default name)

   • Content Field (default post-body)

   • Image Field (default main-image)

   • Description Field (default post-summary)

   • Categories Field (default category)

   • Featured Flag (default featured)

   • Publish Date Field (default created-on)

4. Remove a mapping you don't need with the trash icon, or add one with Add Custom Field Mapping.

Step 7: Connect

Click Connect. The window closes and the site appears in the company's Websites list.

How posts arrive in Webflow

• Posts are created as live collection items, so they appear on the published site.

• The slug comes from the post's permalink, or from its title.

• The image field gets the first image in the post, or the post's featured image. If neither exists, a placeholder image is used, so give every post an image.

• Only mapped fields that exist in the collection are filled.

Changing the connection later

In Accounts, go to Websites > open the site > Edit connection. For Webflow you can change Site Name and Collection URL Path. The field mapping, token and IDs can't be edited there. Contact the UP-TO-DATE support team before disconnecting a site with existing posts, because disconnecting removes its posts and schedules from the platform.

Common errors

Related articles

• Connecting a website: the connection handler step by step

• Required technical access (before you start)

• Testing whether the connection works correctly

• Troubleshooting: website connections and crawls