From f807e3a7d45abe63f61f3a29083bf6fc7897d6e3 Mon Sep 17 00:00:00 2001 From: Tim McMackin Date: Mon, 23 Feb 2026 09:23:39 -0500 Subject: [PATCH 1/4] WIP --- README.md | 23 +++++++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index a4b5e15e..2015ea73 100644 --- a/README.md +++ b/README.md @@ -28,14 +28,29 @@ Using yarn $ yarn add webflow-api ``` +## Authentication + +You can use a workspace token to access all of the sites in your Webflow Workspace or a site token to access a single site. + +- To get a workspace token, open the [Webflow Dashboard](https://webflow.com/dashboard?utm_source=dashboard), click **Apps & Integrations > Manage**, and under **Workspace API access**, click **Generate API token**. + +- To get a site token, find the site in the [Webflow Dashboard](https://webflow.com/dashboard?utm_source=dashboard), open its settings, and under **API access**, click **Generate API token**. + +For more information about tokens, see [Authentication](https://developers.webflow.com/data/reference/authentication) in the Webflow documentation. + +For more complex authentication with OAuth, see [OAuth](#oauth) below. + ## Usage -Simply import `webflow-api` and start making calls to our API. +To use the SDK, import the `webflow-api` package, provide your access token, and make calls to the Webflow API, as in this example: ```javascript import { WebflowClient } from "webflow-api"; -const webflow = new WebflowClient({ accessToken }); +// Workspace or site token +const webflow = new WebflowClient({ + accessToken: process.env.WEBFLOW_API_TOKEN, +}); // Env. variables // in format of string, e.g.: "639656400769508adc12fe42" @@ -93,7 +108,7 @@ Use the `getAccessToken` function and pass in your `client_id`, import { WebflowClient } from "webflow-api"; const accessToken = WebflowClient.getAccessToken({ - clientId: "your_client_id", + clientId: "your_client_id", clientSecret: "your_client_secret", code: "your_authorization_code" }); @@ -150,7 +165,7 @@ const sites = await webflow.sites.get(..., { ``` ### Retries -The SDK will automatically retry failures with exponential backoff. +The SDK will automatically retry failures with exponential backoff. You can configure the retries by setting maxRetries. ```javascript From 80023b8f1c49e16671d07621dfc58f49ba3379ed Mon Sep 17 00:00:00 2001 From: Tim McMackin Date: Mon, 23 Feb 2026 10:53:35 -0500 Subject: [PATCH 2/4] Clarifications in the intro --- README.md | 27 +++++++++++++-------------- 1 file changed, 13 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index 2015ea73..399df9a5 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Webflow JS SDK +# Webflow JavaScript/TypeScript SDK [![npm shield](https://img.shields.io/npm/v/webflow-api)](https://www.npmjs.com/package/webflow-api) [![fern shield](https://img.shields.io/badge/%F0%9F%8C%BF-SDK%20generated%20by%20Fern-brightgreen)](https://github.com/fern-api/fern) @@ -19,13 +19,13 @@ Add this dependency to your project's package.json file: Using npm: ```shell -$ npm install webflow-api +npm install webflow-api ``` -Using yarn +Using yarn: ```shell -$ yarn add webflow-api +yarn add webflow-api ``` ## Authentication @@ -52,25 +52,23 @@ const webflow = new WebflowClient({ accessToken: process.env.WEBFLOW_API_TOKEN, }); -// Env. variables -// in format of string, e.g.: "639656400769508adc12fe42" +// Environment variables +// in string format, such as "639656400769508adc12fe42" const site_id = process.env.SITE_ID; const custom_domain_id_1 = process.env.CUSTOM_DOMAIN_ID_1; const custom_domain_id_2 = process.env.CUSTOM_DOMAIN_ID_2; -// Sites - -// List Sites +// List sites const sites = await webflow.sites.list(); -// Get Site +// Get site const site = await webflow.sites.get(site_id); -// Get Custom Domains +// Get custom domains const customDomains = await webflow.sites.getCustomDomain(site_id); -// Publish Site -const site = await webflow.sites.publish(site_id, { +// Publish site +const publishRequest = await webflow.sites.publish(site_id, { customDomains: [custom_domain_id_1, custom_domain_id_2], publishToWebflowSubdomain: true, }); @@ -78,7 +76,8 @@ const site = await webflow.sites.publish(site_id, { ## OAuth -To implement OAuth, you'll need to [register a Webflow App in your Workspace](https://developers.webflow.com/reference/authorization) +To implement OAuth, you must register a Webflow App in your Workspace. +See https://developers.webflow.com/reference/authorization. ### Step 1: Authorize URL From 1eccde25ea6f40bbda4a07702fd79ed6364840e2 Mon Sep 17 00:00:00 2001 From: Tim McMackin Date: Mon, 23 Feb 2026 10:56:23 -0500 Subject: [PATCH 3/4] Fix broken link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 399df9a5..2011d474 100644 --- a/README.md +++ b/README.md @@ -77,7 +77,7 @@ const publishRequest = await webflow.sites.publish(site_id, { ## OAuth To implement OAuth, you must register a Webflow App in your Workspace. -See https://developers.webflow.com/reference/authorization. +See https://developers.webflow.com/apps/data/docs/register-an-app. ### Step 1: Authorize URL From 6de899c29e225624d689fb18014e0d6209e37711 Mon Sep 17 00:00:00 2001 From: Tim McMackin Date: Mon, 23 Feb 2026 11:30:45 -0500 Subject: [PATCH 4/4] OAuth instructions --- README.md | 33 +++++++++++++++++++++++---------- 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 2011d474..45c6b85c 100644 --- a/README.md +++ b/README.md @@ -76,14 +76,19 @@ const publishRequest = await webflow.sites.publish(site_id, { ## OAuth -To implement OAuth, you must register a Webflow App in your Workspace. +To implement OAuth, you must register a Webflow App in your Workspace with the "Data CLient" building block and get its client ID and secret. See https://developers.webflow.com/apps/data/docs/register-an-app. -### Step 1: Authorize URL +To get the client ID, edit the App in your workspace, go to the Building Blocks tab, and copy the ID from the **Client ID** field. -The first step in OAuth is to generate an Authorization URL. Use this URL -to fetch your Authorization Code. See the [docs](https://docs.developers.webflow.com/v1.0.0/docs/oauth#user-authorization) -for more details. +For full instructions, see https://developers.webflow.com/data/reference/oauth-app. + +### Step 1: Generate an authorization URL + +The first step in OAuth is to generate an authorization URL. +You direct your users to go to this URL, which prompts them to approve the App's access to specific sites or Workspaces. + +This example code generates the authorization URL: ```javascript import { WebflowClient } from "webflow-api"; @@ -98,10 +103,12 @@ const authorizeUrl = WebflowClient.authorizeURL({ console.log(authorizeUrl); ``` -### Step 2: Retrieve your access token +### Step 2: Retrieve an access token + +The callback from the authorization URL includes the state that you set in the request and an authorization code. +You can use this authorization code to generate an access token for the App. -Use the `getAccessToken` function and pass in your `client_id`, -`client_secret`, and `authorization_code`. +This example passes the App's client ID and secret and the authorization code to the `getAccessToken` function: ```javascript import { WebflowClient } from "webflow-api"; @@ -115,14 +122,20 @@ const accessToken = WebflowClient.getAccessToken({ ### Step 3: Instantiate the client -Instantiate the client using your `access_token`. +Instantiate the client using the access token: ```javascript import { WebflowClient } from "webflow-api"; -const webflow = WebflowClient({ accessToken }); +const webflow = new WebflowClient({ accessToken }); + +const {sites} = await webflow.sites.list(); + +console.log(sites); ``` +Now the App has access to the sites or Workspaces that the user allowed access to. + ## Webflow Types All of the types are nested within the `Webflow` namespace. Let IntelliSense