The Webflow API allows web developers to build meaningful integrations that connect important services to Webflow.
It also helps create innovative and first-class experiences for web development without using code. We'll take you through the Webflow API basics and how to add an API key to Webflow.
Let's get started.
An API, which stands for Application Programming Interface, serves as a set of standardized code protocols enabling secure data exchange between applications, software, and hardware. Typically, APIs incorporate security measures such as access tokens to safeguard data.
Web developers can use the REST API to return the JSON data about Webflow sites, membership, CMS collections, and eCommerce products.
Webflow's API offers the capability to create integrations, manage user memberships, and seamlessly integrate e-commerce functionality into your website. The Authorized User API ensures the protection of user data, while the Authorized Info API contains information pertaining to the authorization process being employed. For further information on the Webflow API, please explore additional resources.
The Webflow APIs are categorized into:
Webflow serves as a content management system (CMS) that empowers you to create websites and modify dynamic content without the need for any coding.
Webflow CMS caters to a diverse audience, including developers, editors, designers, and content strategists. The Webflow developer API interfaces directly with the JSON structure that underlies the CMS.
The developers can create custom webhooks, integrate with mobile apps, connect to existing CMS, export content JSON, etc.
Professional web developers, as well as non-developers, can use Webflow. The no-code CMS lets you store and maintain dynamic content.
You can add content to Webflow using a CSV, Webflow external API, or by hand.
To generate a Webflow API, you need a Webflow website. Here's how to create a site on Webflow.
Instead of using a password to access your API, you can create an API key or access token for authentication.
When working with the API, you need access to your site id. A site id tells Webflow the website you want to access. So, how do you generate an API key?
Go to your Webflow dashboard. Click on settings for the project you want to create your API key. From the top menu, click on integrations.
Scroll through the page and select Generate API token. After the token access is generated, copy it and save it for later.
Webflow displays the token once, so you must copy it and publish it in a different folder. Since it generates one API per site, you can consider authenticating each integration with separate access tokens if you want multiple integrations.
The access tokens are created through the apps. It gives you a clear visibility of the services accessing your site.
If you lost your API key or suspect it got compromised, you can regenerate a new access token. You can no longer use the older API key after generating a new one.
A webhook allows you to share real-time updates with any service that can receive an HTTP request about an action made on Webflow.
For instance, if you're using forms in your Webflow website, you can create a webhook that sends data to the form integration whenever a user submits a form.
An example of a Webflow service that receives HTTP requests is Airtable forms. For a webhook to send updates, you should first configure it to listen to an event from your Webflow site.
To create a webhook, you need:
To create a webhook, go to project settings, then integrations. The two trigger types are site publish and form submission.
The Webflow CMS API lets you bring in data from external sources and connect the Webflow CMS with a mobile app or an existing CMS.
To access the Webflow API, you need an API key or an OAuth. The OAuth protocol integrates third-party applications with Webflow.
Simply put, the protocol is for Webflow users who want to allow third-party services to access data without sharing passwords and API keys.
Otherwise, if you're creating a private integration with your account, you will need a site API token.
Webflow has a CMS API that lets you add, update, and delete items from a collection. Webflow developers can build integrations without coding.
Webflow API returns JSON data about eCommerce products, memberships, sites, and CMS collections. You can connect your Webflow site to external sources using the API.
The Node SDK for Webflow API is available on Webflow-api npm. For non-developers, you can use Zapier to connect to third-party services. Hence, you do not have to use the Webflow API or worry about coding.
It connects Webflow to more than 5,000 apps. Zapier moves information automatically between web apps.
With the Webflow API, you can:
The Webflow API documentation gives you a detailed guide on everything you need to know about Webflow apps, APIs, developer tools, etc.
You can also join the Webflow forum to collaborate with other developers, solve issues and share ideas. The Webflow documentation links you to Webflow university, which has the resources to learn more about the CMS.
Webflow APIs are categorized for site, membership, CMS, and eCommerce.
To use the Webflow API, you must have a Webflow site. Generating the API from your site settings is a straightforward process.
Start by clicking on "Integrations," and then scroll to the bottom of the page. Within the "API Access" section, there's a "Generate API Token" button. It's essential to make sure you copy the API key since it's displayed only once. Failure to do so will necessitate regenerating it. Each Webflow site is provided with a single API key.
Moreover, Webflow users have the option to utilize OAuth 2.0 for integrating Webflow with third-party applications. This allows you to grant third-party services access to your data without the need to share your API key or password.
For comprehensive information, support, API documentation, details about the Webflow eCommerce API, and more, you can refer to the Webflow API documentation.