> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hightouch.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Webflow

> Bring in the power of personalization and dynamic content to your web projects on Webflow using rich customer data from your data warehouse

## Supported syncing

| Sync Type | Description | Supported Sync Modes | API documentation |
| - | - | - | - |
| **Collections** | Sync data from any source to Webflow CMS collection items | Upsert, Update | [Create Collection Item](https://developers.webflow.com/reference/create-item) |

For more information about sync modes, refer to the [sync modes](https://docs.hightouch.com/syncs/types-and-modes.md#sync-modes) docs.

## Connect to Webflow

Go to the [**Destinations** overview page](https://app.hightouch.com/destinations?from=docs) and click the **Add destination** button. Select **Webflow** and click **Continue**. You can then authenticate Hightouch to Webflow by entering your **API Token** from your Webflow project.

To generate an API token in Webflow:

1. Go to **Apps & Integrations** and scroll down to the **API Access** section.
2. Click **Generate API Token**.
3. Copy the generated token to your clipboard.

> For the most accurate instructions, see [Webflow’s API Token Documentation](https://developers.webflow.com/data/v2.0.0/reference/authentication).

## Sync configuration

Once you've set up your Webflow destination and have a [model](https://docs.hightouch.com/getting-started/concepts.md#models) to pull data from, you can set up your sync configuration to begin syncing data. Go to the [**Syncs** overview page](https://app.hightouch.com/syncs?from=docs) and click the **Add sync** button to begin. Then, select the relevant model and the Webflow destination you want to sync to.

### Syncing collections

#### Record matching

To match source rows to Webflow collection items, you need to select a source column and corresponding Webflow field. You can match on any Webflow field that is set to [plain text](https://webflow.com/glossary/plain-text-field) type. Using the `Slug` field is recommended.

![Webflow record matching](https://mintcdn.com/hightouch-3c037897/L_vQfA0JQEpeGUUo/images/destinations/destination-webflow-id-mapping.png?fit=max\&auto=format\&n=L_vQfA0JQEpeGUUo\&q=85\&s=be9ee8401b0ea1ce1a913cd495288117)

#### Field mapping

You can sync columns from your source to Webflow's collection properties.

![Webflow field mapping](https://mintcdn.com/hightouch-3c037897/L_vQfA0JQEpeGUUo/images/destinations/destination-webflow-mapping.png?fit=max\&auto=format\&n=L_vQfA0JQEpeGUUo\&q=85\&s=b446aedf16e4da53acfcb90167c646a8)

#### Delete behavior

The [delete behavior](https://docs.hightouch.com/syncs/overview.md#delete-behavior) you select dictates what to do when a row no longer appears in your model's query results. You have the following options:

| Behavior | Description |
| - | - |
| **Do nothing** | Keep the record in Webflow |
| **Clear fields** | Keep the record, but clear the mapped fields |
| **Delete record** | Delete the record in Webflow |

**Clear fields** is only available in Update mode, whereas **Delete record** is only available in Upsert mode.

## Tips and troubleshooting

To see the exact API requests and responses from each sync run, use the [live debugger](https://docs.hightouch.com/syncs/debugger.md). To get notified by Slack, PagerDuty, SMS, or email when a sync fails, set up [sync alerts](https://docs.hightouch.com/syncs/alerting.md). If you run into an issue this page doesn't cover, [contact support](#pylon-chat).