# Connect the Webflow project

> Prepare the Webflow site, connect it to a project in the Smootify dashboard, and add the domains the Smootify licence covers.

Status: Ready (Smootify 2.0)  
1.x page: https://docs.smootify.io/docs/getting-started/quick-start/connect-webflow-project  
URL: https://www.smootify.io/docs/start/webflow-project  
Updated: 2026-10-01

A Smootify project links one Webflow site to one Shopify store. This page prepares the Webflow site, connects it in the Smootify dashboard, and explains which addresses the licence covers: your `.webflow.io` address and your custom domains.

> [!NOTE]
> Set up the Shopify store and install the Smootify app first: see [Set up the Shopify store](https://www.smootify.io/docs/start/shopify-store).

## 1. Prepare the Webflow site

- **A new site.** Create a blank site in Webflow. Do not start from a Webflow Ecommerce template. You do not need Webflow Ecommerce at all: Shopify sells, Webflow shows. For a ready-made starting point, see [Starter and templates](https://www.smootify.io/docs/start/templates).
- **An existing site.** It works as it is. You add the CMS collections and the script to it.

The site needs the Webflow CMS for the product pages. Products, collections and vendors are all CMS items, and your Webflow site plan limits how many items the site can have. To publish on a custom domain, the site also needs a Webflow site plan.

## 2. Connect the site to a project

1. Open the Smootify dashboard from the Smootify app in your Shopify admin.
2. Connect a Webflow site: Webflow asks you to authorize Smootify, and you pick the site.

You can also start from the other side: install the Smootify app from the Webflow Marketplace, open the dashboard from it, then install the Smootify app on your Shopify store.

The project now knows the store and the site. Smootify finds the project from the Webflow site itself, so the script you install holds no store details. The same access lets the CMS sync write your products into the site’s CMS.

## 3. Add your domain

In the project’s settings in the Smootify dashboard, add the custom domain the site is published on, such as `www.example.com`.

- **Your `.webflow.io` address always works.** You do not need to add it.
- **`www` or not.** For the site, `example.com` and `www.example.com` count as the same domain. The server add-ons compare the exact address, so write the domain the way the site is published, `www` included when it has one.
- **Weglot.** Language sub-domains, such as `fr.example.com`, are covered by the main domain.

Where the domain points, and how the checkout gets its own sub-domain: see [Domains and checkout](https://www.smootify.io/docs/start/domains).

## 4. What each plan covers

| Plan | Where Smootify runs | Also includes |
|---|---|---|
| Free | your `.webflow.io` address, with a "Made with Smootify" badge | the CMS sync with Smootify Studio, the desktop app |
| Lite | also your custom domain | every client add-on |
| Server | also your custom domain | the CMS sync on Smootify's server, the server add-ons |

- On `.webflow.io`, every client add-on works for testing. Magic Box is the exception: on every plan and every address, it must be turned on in the dashboard first.
- The server add-ons, such as file uploads or the product configurator, need the Server plan and must be activated for the project. On the live site they run only on the domain in the project settings. The list is in [server add-ons](https://www.smootify.io/docs/reference/elements/server-extensions).

When the site is not connected, or a custom domain is not covered, the page shows a banner at the bottom left and Smootify does not load the store:

- **"Project not Connected"**: this Webflow site is not connected to a project, or it is a copy of the connected site. Smootify does not load the store. Connect this site in the dashboard.
- **"To connect your custom domain "www.example.com" you need an active Smootify Plan"**: on a custom domain, the project has no paid plan, or the domain in the banner is missing from the project settings, or written differently. Smootify does not load the store. Pick a paid plan, and write the domain in the project settings exactly as the site is published.

## 5. Install the script

Paste the loader in the site’s head code and publish: see [Install Smootify 2.0](https://www.smootify.io/docs/start/install).

## Keep the connection working

- **Webflow access expires.** Webflow can revoke Smootify’s access, for example when the site moves to another workspace. The CMS sync then stops. Authorize the site again from the dashboard, and pick the same site in Webflow.
- **A copy of the site.** A duplicated Webflow site is a new site for Smootify. It shows “Project not Connected” until you connect it to a project.
- **Someone else’s project.** The dashboard can share a project with another account, or transfer it: see [Hand a project to a client](https://www.smootify.io/docs/start/hand-off).

## Where people get stuck

> [!STUCK]
> - **The banner "Project not Connected".** This Webflow site is not connected to a project, or it is a copy of the connected site. Connect this site in the dashboard.
> - **The banner "To connect your custom domain … you need an active Smootify Plan".** The project has no paid plan, or the domain in the banner is missing from the project settings.
> - **A server add-on works on `.webflow.io` but not on the live site.** The domain in the project settings differs from the site's address, often by `www`. Write it exactly as the site is published.
> - **The CMS sync says Smootify lost access to Webflow.** The authorization expired or was revoked. Authorize the same site again.
> - **A change in the project settings does not show.** Publish the site again, then reload the page twice. The browser keeps the previous project settings for one visit.