Skip to content
Blackbird docs

Webflow

View on Github

Webflow is a cloud-based web design and development platform that enables users to create, customize, and manage responsive websites visually. It provides a wide range of features and tools for designers, developers, and businesses to build and maintain professional websites without needing to write code. Webflow allows users to publish websites directly, collaborate in real-time, and utilize a robust CMS to manage content. This makes it a versatile solution for individuals, entrepreneurs, and enterprises looking to establish and grow their online presence.

Before connecting

This app supports three types of connections: OAuth2, OAuth2 (multiple sites) and Site Token. You can choose whichever option works best for you. Note that a Site Token limits requests to the site where the token was generated, while OAuth2 allows you to work with multiple sites simultaneously.

  1. Ensure you have an active Webflow account. If not, create one here: here.
  2. Confirm that at least one site exists in your Webflow account.

OAuth2

  1. Open Apps & Integrations in Webflow and create a new application.

create app

  1. Provide the application details (name, description and URL can be customized). In Building blocks, enable Designer extension and Data client (REST API). Configure the OAuth redirect URL with: ‘https://bridge.blackbird.io/api/AuthorizationCode’. Then select the required scopes.

info input

config input

  1. Click Create app. After creation, Webflow will generate a Client ID and Client Secret. Retain these credentials—they are required to connect Webflow to Blackbird.
  2. Go to the settings of the site you want to use.

site settings

  1. Scroll down to Overview section and copy the Site ID from there.

OAuth2 (multiple sites)

  1. Open Apps & Integrations in Webflow and create a new application.

create app

  1. Provide the application details (name, description and URL can be customized). In Building blocks, enable Designer extension and Data client (REST API). Configure the OAuth redirect URL with: ‘https://bridge.blackbird.io/api/AuthorizationCode’. Then select the required scopes.

info input

config input

  1. Click Create app. After creation, Webflow will generate a Client ID and Client Secret. Retain these credentials—they are required to connect Webflow to Blackbird.

Site token

  1. Go to your site settings from the All sites page.

site settings

  1. Go to Apps & Integrations, scroll down and click Generate API token.
  2. Enter a Token name, then select the required scopes.
  3. Click Generate token, then copy it and paste it into Blackbird.

Connecting

Navigate to Apps, and identify the Webflow app. You can use search to find it. Click Add Connection.

OAuth2

  1. Name your connection for future reference e.g. ‘My organization’.
  2. Choose OAuth2 connection type. Input the Client ID, Client Secret, and Site ID obtained from Webflow.
  3. Click Authorize connection.
  4. Follow the instructions that Webflow gives you.
  5. When you return to Blackbird, confirm that the connection has appeared and the status is Connected.

Note: Make sure you give access to the site from which you copied the ID. You can grant access to all sites in your workspace. The Site ID input can be overridden for each action.

site settings

OAuth2 (multiple sites)

  1. Name your connection for future reference e.g. ‘My organization’.
  2. Choose OAuth2 connection type. Input the Client ID and Client Secret obtained from Webflow.
  3. Click Authorize connection.
  4. Follow the instructions that Webflow gives you.
  5. When you return to Blackbird, confirm that the connection has appeared and the status is Connected.

Site token

  1. Name your connection for future reference e.g. ‘My organization’.
  2. Choose Site token connection type. Input the API token obtained from Webflow.
  3. Click Authorize connection.
  4. Follow the instructions that Webflow gives you.
  5. When you return to Blackbird, confirm that the connection has appeared and the status is Connected.

Actions

Collections

  • Get collection gets details of a specific collection.
  • Search collections searches all collections for a specific site.
  • Create collection creates a new collection.
  • Delete collection deletes a specific collection.

Collection items

  • Search collection items searches all collection items for a specific collection.
  • Download collection item downloads the collection item content.
  • Publish collection item publishes a specific collection item. This actions can only publish an item of the default locale, because of the Webflow API limitation.
  • Upload collection item updates collection item content from a file.

Pages

  • Search pages searches pages using filters.
  • Download page downloads the page content.
  • Upload page updates page content from a file.

Components

  • Search components searches all components for a site.
  • Download component downloads the component content.
  • Upload component updates component content from a file.

Sites

  • Search sites searches sites based on search criteria.
  • Get site gets details of a site.
  • Publish site publishes a site to one or more more domains.

Content

  • Search content searches for any type of content. If the ‘Content type’ value is not specified, all supported content types will be fetched.
  • Download content downloads content to a file.
  • Upload content updates content from a file.

Events

  • On collection item updated is triggered when a specific collection item is changed.
  • On collection item created is triggered when a specific collection item is created.
  • On collection item deleted is triggered when a specific collection item is deleted.
  • On collection item unpublished is triggered when a specific collection item is unpublished.
  • On page created is triggered when a specific page is created.
  • On page updated is triggered when page update was made.
  • On page deleted is triggered when a specific page is deleted.
  • On page metadata updated is triggered when specific page metadata is updated.
  • On site published is triggered when a specific site is published.

Example

image

Missing features

Webflow is a huge app with a lot of features. If any of these features are particularly interesting to you, let us know!

Feedback

Do you want to use this app or do you have feedback on our implementation? Reach out to us using the established channels or create an issue.