Skip to main content

Webflow Data API Destination

Nexla's bi-directional connectors allow data to flow both to and from any location, making it simple to create a FlexFlow data flow that sends data to a Webflow Data API location.
webflow_api.png

Webflow Data API

Create a Webflow Data API Destination​

  1. Click the + icon on the Nexset that will be sent to the Webflow Data API destination, and select the Send to Destination option from the menu.

  2. Select the Webflow Data API connector from the list of available destination connectors. Then, select the credential that will be used to connect to the Webflow Data API organization, and click Next; or, create a new Webflow Data API credential for use in this flow.

  3. In Nexla, Webflow Data API destinations can be created using pre-built endpoint templates, which expedite destination setup for common Webflow Data API endpoints. Each template is designed specifically for the corresponding Webflow Data API endpoint, making destination configuration easy and efficient.
    • To configure this destination using a template, follow the instructions in Configure Using a Template.

    Webflow Data API destinations can also be configured manually, allowing you to send data to Webflow Data API endpoints not included in the pre-built templates or apply further customizations to exactly suit your needs.
    • To configure this destination manually, follow the instructions in Configure Manually.

Configure Using a Template​

Nexla provides pre-built templates that can be used to rapidly configure destinations to send data to common Webflow Data API endpoints. Each template is designed specifically for the corresponding Webflow Data API endpoint, making destination setup easy and efficient.

  • To configure this destination using a template, select the endpoint to which data will be sent from the Endpoint pulldown menu. Then, click on the template in the list below to expand it, and follow the instructions to configure additional endpoint settings.

    Update Page Metadata

    Updates the metadata of an existing Webflow page, such as its title, slug, SEO description, or open graph settings, optionally for a specific locale. Use this endpoint to push page metadata updates from an external content management system or translation workflow into Webflow.

    • Enter the unique identifier of the page to update in the Page ID field. This is required. Page IDs can be obtained from the List Pages data source endpoint.
    • Optionally, enter a locale identifier in the Locale ID field to update metadata for a specific locale variant of the page. Leave blank to update the default locale.

    • Ensure the Nexset being sent contains the page metadata fields you want to update. The Webflow Data API accepts the following fields as a JSON body (include only the fields you wish to change):

      • title — The page's display title
      • slug — The URL slug for the page
      • description — The SEO meta description
      • openGraphTitle — The Open Graph title for social sharing
      • openGraphDescription — The Open Graph description

    This endpoint uses an HTTP PATCH method, so only the fields included in the request body will be updated. Fields not included will retain their current values in Webflow.

    Update Page Content

    Updates the DOM (Document Object Model) node content of a Webflow page for a specific locale. Use this endpoint to programmatically push localized content updates—such as translated text—into Webflow pages from an external localization or content workflow.

    • Enter the unique identifier of the page in the Page ID field. This is required.
    • Optionally, enter a locale identifier in the Locale ID field to update content for a specific locale. Leave blank to update the default locale.
    • Ensure the Nexset contains a valid DOM node update payload. The request body should include a nodes array, where each node object specifies the node ID and the updated text or property values to apply.

    Page content updates require knowledge of the page's DOM node IDs. Use the Get Page Content data source endpoint to retrieve the current node tree and extract the node IDs before writing updates.

    Update Component Content

    Updates the DOM content of a reusable component within a Webflow site, optionally targeting a specific locale and branch. Use this endpoint to push component content updates—such as translated text or updated rich-text nodes—from an external system into Webflow.

    • Enter the unique identifier of the site in the Site ID field. This is required.
    • Enter the unique identifier of the component to update in the Component ID field. This is required. Component IDs can be obtained from the List Components data source endpoint.
    • Optionally, enter a locale identifier in the Locale ID field to update the component's content for a specific locale.
    • Optionally, enter a branch identifier in the Branch ID field to apply the update to a specific Webflow branch rather than the default branch.

    Like page content updates, component content updates require node IDs from the component's DOM tree. Retrieve the current component DOM structure before constructing update payloads.

    Update Component Properties

    Updates the design properties of a reusable component within a Webflow site, optionally targeting a specific locale and branch. Use this endpoint to push property changes—such as updated styling tokens or default property values—from an external design system into Webflow components.

    • Enter the unique identifier of the site in the Site ID field. This is required.
    • Enter the unique identifier of the component in the Component ID field. This is required.
    • Optionally, enter a locale identifier in the Locale ID field to scope the property update to a specific locale.
    • Optionally, enter a branch identifier in the Branch ID field to apply changes to a specific Webflow branch.

    Create Collection

    Creates a new CMS collection in a Webflow site. Use this endpoint to programmatically provision new content schemas—for example, when bootstrapping a new Webflow site from an external content model or automating the creation of multi-tenant content structures.

    • Enter the unique identifier of the site in the Site ID field. This is required.

    • Ensure the Nexset contains the required fields for creating a collection. At minimum, the request body must include:

      • displayName — The human-readable name for the collection (for example, Blog Posts)
      • singularName — The singular form of the collection name (for example, Blog Post)
      • slug — A URL-safe identifier for the collection (for example, blog-posts)

    Collection creation requires the cms:write OAuth scope. Verify that this scope is included in the Webflow credential used for this flow.

    Create Collection Item(s)

    Creates one or more new items in a CMS collection. Use this endpoint to publish content to Webflow from an external source—for example, syncing blog posts from a headless CMS, importing product data from a PIM system, or pushing records from a database into a Webflow CMS collection.

    • Enter the unique identifier of the collection in the Collection ID field. This is required. Collection IDs can be obtained from the List Collections data source endpoint.
    • Ensure the Nexset contains the CMS item fields that match the collection's schema. Required fields vary by collection but always include at minimum the collection's required fields as defined in the Webflow CMS editor. Each item should include a fieldData object containing the field values.

    Newly created items are saved in draft (staged) status by default. They will not appear on the live Webflow site until the site is published. To publish items after creation, use the Webflow Data API's publish endpoint separately.

    Update Collection Item

    Updates a single existing item in a CMS collection. Use this endpoint to push changes to Webflow CMS records from an external system—for example, updating a product description, changing a blog post's status, or syncing field values from an external database.

    • Enter the unique identifier of the collection in the Collection ID field. This is required.
    • Enter the unique identifier of the item to update in the Item ID field. This is required. Item IDs can be obtained from the List Collection Items data source endpoint.
    • Ensure the Nexset contains a fieldData object with the fields to update. Only include the fields that should be changed—fields not included in the request will retain their current values.

    This endpoint uses HTTP PATCH semantics. Updated items are saved in staged status and must be published to appear on the live site.

    Create Product & SKU

    Creates a new product along with its initial SKU in the Webflow site's e-commerce catalog. Use this endpoint to import product data from an external product information management (PIM) system, ERP, or database into Webflow's e-commerce store.

    • Enter the unique identifier of the site in the Site ID field. This is required. The site must have Webflow e-commerce enabled.

    • Ensure the Nexset contains the required product and SKU fields. A minimal product creation payload includes:

      • product object with fieldData containing at least the product name and slug
      • sku object with fieldData containing at least the SKU name and price

    Creating products requires the ecommerce:write OAuth scope. Newly created products are staged and must be published to appear in your Webflow store.

    Update Product

    Updates the details of an existing product in the Webflow e-commerce catalog. Use this endpoint to sync product data changes—such as updated descriptions, pricing adjustments, or availability changes—from an external system into Webflow.

    • Enter the unique identifier of the site in the Site ID field. This is required.
    • Enter the unique identifier of the product to update in the Product ID field. This is required. Product IDs can be obtained from the List Products & SKUs data source endpoint.
    • Ensure the Nexset contains a fieldData object with the product fields to update. Only include fields that should change.

    Fulfill Order

    Marks an existing Webflow e-commerce order as fulfilled and triggers Webflow's fulfillment workflow, including sending a fulfillment confirmation email to the customer if configured. Use this endpoint to automate order fulfillment from an external fulfillment or warehouse management system.

    • Enter the unique identifier of the site in the Site ID field. This is required.
    • Enter the unique identifier of the order to fulfill in the Order ID field. This is required. Order IDs can be obtained from the List Orders data source endpoint.
    • Optionally, include a sendOrderFulfilledEmail boolean in the request body to control whether Webflow sends a fulfillment email to the customer. Set to true to trigger the email; omit or set to false to suppress it.

    Once an order is marked as fulfilled, this action cannot be undone through the API. Ensure that the order is ready for fulfillment before executing this endpoint.

    Refund Order

    Processes a refund for an existing Webflow e-commerce order. Use this endpoint to automate refund processing from an external customer service or returns management platform, ensuring Webflow order records stay in sync with your broader operations.

    • Enter the unique identifier of the site in the Site ID field. This is required.
    • Enter the unique identifier of the order to refund in the Order ID field. This is required.

    Refunding an order in Webflow updates the order's status to Refunded and triggers any configured Webflow refund notifications. Actual payment reversal is handled by the connected payment processor (for example, Stripe) and is not initiated solely by this API call.

Configure Manually​

Webflow Data API destinations can be manually configured to send data to any valid Webflow Data API endpoint.

Using manual configuration, you can also configure Nexla to automatically send the response received from the Webflow Data API after each call to a new Nexla webhook data source.

API Method​

  1. To manually configure this destination, select the Advanced tab at the top of the configuration screen.

  2. Select the API method that will be used for calls to the Webflow Data API from the Method pulldown menu. Common methods for Webflow destination flows are:

    • POST: For creating new resources (collections, items, products, fulfillments, refunds)
    • PATCH: For partially updating existing resources (page metadata, collection items, products)

Data Format​

  1. Select the format in which the Nexset data will be sent to the Webflow Data API from the Content Format pulldown menu. The Webflow Data API accepts JSON format for all write operations. Nexla will automatically convert the data to the selected format for each API call.

API Endpoint URL​

  1. Enter the URL of the Webflow Data API endpoint to which you want to send the Nexset data in the URL field. All Webflow Data API v2 write endpoints begin with https://api.webflow.com/v2. For update operations, include the resource ID at the end of the URL (for example, https://api.webflow.com/v2/collections/{collection_id}/items/{item_id}).

Request Headers​

Optional

  • If Nexla should include any additional request headers in API calls to this destination, enter the headers & corresponding values as comma-separated pairs in the Request Headers field (for example, header1:value1,header2:value2).

    You do not need to include the Authorization header—Nexla automatically injects the OAuth Bearer token from your credential. The Content-Type: application/json header is also added automatically when JSON format is selected.

Exclude Attributes from the Call​

Optional

  • If any record attributes in the Nexset should be omitted when sending data to this Webflow Data API destination, select the attributes from the Exclude Attributes pulldown menu.

  • Any number of attributes can be selected for exclusion, and all excluded attributes will be shown in the field. To remove an attribute from the list, click the X icon next to the attribute name.

Record Batching​

Optional

  1. If records should be sent to this destination in batched API calls, check the box next to Would you like to batch your records together? to enable record batching.

  2. Enter the maximum number of records that should be batched together in a single API call in the Batch Size field. By default, this value is set to 100.

    The Webflow CMS bulk create/update endpoints support up to 100 items per request. Set the batch size to 100 or fewer to stay within Webflow API limits.

  3. Select the algorithm that will be used to group records into batches from the Grouping Algorithm pulldown menu. The sample request shown in the panel on the right will be updated to reflect the current batching settings.

Response Webhook​

Optional

Nexla can automatically send the response received from the Webflow Data API after each call to a new Nexla webhook data source. This option allows you to keep track of the status of each API call and any additional information returned after each call, such as newly created item IDs or error details.

  • To enable this option, check the box next to Would you like to process the API response as a Nexla Webhook source?.

Sample Request Payload​

Sample request payloads containing a portion of the Nexset data that will be sent to the Webflow Data API endpoint based on the current settings are shown in the Sample Payload panel on the right. These samples can be referenced to ensure that the destination and request settings are correctly configured.

  • Click on a sample request payload to expand it and view the complete payload content.
  • Sample payloads are automatically updated with each setting change, making it easy to verify that changes achieve the desired effect.

Endpoint Testing (Manual Configuration)​

After all endpoint settings have been configured, Nexla can send a test payload to the Webflow Data API to ensure that the destination is configured correctly.

  1. To send a test payload, select the Test button at the top of the Sample Payload panel, and click on a listed sample payload to expand it.

  2. If any modifications to the sample payload are needed, make the necessary changes directly within the sample window.

  3. Click the Send Test Data button at the top of a sample payload to send the test payload to the Webflow Data API using the current settings.

Save & Activate the Destination​

  • Once all endpoint settings have been configured, click the Done button in the upper right corner of the screen to save and create the destination. To begin sending data to the configured Webflow Data API endpoint, open the destination resource menu, and select Activate.

    The Nexset data will not be sent to the Webflow Data API until the destination is activated. Destinations can be activated immediately or at a later time, providing full control over data movement.