# Webflow

Send your Webflow form submissions to Rasket as contacts, turn your Webflow store's orders into store events, and show your Rasket sign-up forms on your Webflow site.

> Coming soon: connecting Webflow is not switched on yet. This page describes it as it will ship. Until then, add the rasket.js snippet to your site by hand from Audience → Forms.

## What it does

- **Forms become contacts.** Each Webflow form you turn on adds the people who submit it to your contacts. People who agreed join the topic you choose.
- **Orders become store events.** With Store orders on, every new order fires `store:order.placed`, so post-purchase flows can start.
- **Your sign-up forms show on the site.** Rasket adds its script, rasket.js, to every page, so your live pop-ups and flyouts show there and embedded forms fill in.

## Before you start

- You need to be an admin of the Rasket project.
- In Webflow, you need to be able to install apps on the site's workspace. Store orders need a site with Webflow e-commerce.

## Connect Webflow

### From Rasket

1. Open Settings → Integrations → Webflow and press Connect Webflow.
2. Rasket says what it will read and change. Press Continue to Webflow.
3. In Webflow, choose the sites Rasket may use and approve.
4. You are back on the Webflow page in Rasket, with your sites and their forms listed.

### From the Webflow Marketplace

Installing Rasket from Webflow brings you to Rasket. Sign in, choose the Rasket project, and approve Rasket in Webflow once more.

Each site connects to one Rasket project. A site already connected to another project is skipped; disconnect it there first.

## Turn a form on

1. On the Webflow page, open the form, or press Set up beside it.
2. Choose which form field is the email address, and which is the first name.
3. Choose how people show consent: an opt-in checkbox in the form, everyone who submits (you confirm they all agreed), or none.
4. Choose the topic people who agreed join, and press Save. The form is now on.

A form stays off until you set it up, so nobody is added by surprise. The switch beside each form turns it off and on again.

## Consent

- **Opt-in field.** People who tick it arrive subscribed, with the form and the time stored as the evidence. People who don't arrive as contacts you cannot send campaigns to.
- **Everyone who submits agreed.** Everyone arrives subscribed. Rasket stores the statement, who confirmed it and when. Choose this only when the form itself asks for that agreement.
- **None.** Everyone arrives as a contact you cannot send campaigns to. You can still send them transactional email.

A form submission never resubscribes someone who unsubscribed, and never reaches an address on your suppression list. Store flows only email subscribed buyers.

## Store orders

Turn on Store orders for a site with Webflow e-commerce. Each new order fires `store:order.placed` with the order number, the total and the items, and the buyer is added as a contact you cannot send campaigns to, unless they already subscribed. Choose the event as a trigger in [an automation](https://www.rasket.com/docs/events).

Webflow sends new orders only. It sends nothing about carts or checkouts, so flows that need them, like an abandoned cart reminder, don't run for a Webflow site.

## Sign-up forms on your site

Connecting adds rasket.js to every page of each site, through Webflow's own custom code settings. It goes live when you next publish the site in Webflow. Your published pop-ups and flyouts then show there.

For an embedded form, in the Webflow Designer:

1. Open the form in Audience → Forms and copy its Webflow embed line.
2. Add an Embed element where the form should go, paste the line, and save.
3. Publish the site.

Webflow embed:

```text
<div data-rasket-form="<form id>" style="min-height: 260px"></div>
```

rasket.js sets no cookie and sends no tracking event until the visitor agrees. Disconnect removes it from the site; publish again to take it off the live pages.

## What Rasket asks Webflow for

| Permission | Why |
| --- | --- |
| `authorized_user:read` | Who approved the connection, shown on the Webflow page. |
| `sites:read` | Your sites' names and domains. |
| `sites:write` | Creating the webhooks that send form submissions and orders. |
| `forms:read` | Your forms and their field names, and their submissions. |
| `ecommerce:read` | New orders, only when you turn Store orders on. |
| `custom_code:read` | Seeing whether rasket.js is already on the site. |
| `custom_code:write` | Adding rasket.js to your site, and removing it when you disconnect. |

Rasket keeps the access Webflow gives it encrypted on its servers, and deletes it when you disconnect or remove the app in Webflow.

## Disconnect

Settings → Integrations → Webflow → Disconnect removes Rasket's webhooks and rasket.js from your sites and ends Rasket's access. Contacts that came from Webflow stay in your project. Removing the app in Webflow has the same effect: Rasket notices within a day, and the Webflow page asks you to reconnect.

## Troubleshooting

- **“A submission had no email address in the email field.”** The field you chose as the email was empty or not an address. Check the form's fields.
- **“Your plan's contact limit was reached.”** Some people weren't added. Raise your plan's contact limit in Billing.
- **“Webflow no longer accepts Rasket's access.”** The app was removed in Webflow. Press Reconnect.
- **A new form isn't listed.** Publish the site, then press Refresh from Webflow.