# Quotes and B2B

> Turn the cart into a quote request that reaches Shopify as a draft order, and show business customers their company, their quantity rules and their prices.

Status: Ready (Smootify 2.0)  
Plan: Server plan  
Add-on: Draft Orders  
1.x page: https://docs.smootify.io/docs/cart/draft-orders  
URL: https://www.smootify.io/docs/features/quotes  
Updated: 2026-10-11

With quotes, the cart does not go to checkout: it sends a request. You receive a draft order in Shopify, with the lines, variants and quantities the customer chose. You set your price, send the invoice, and the customer pays it in Shopify’s checkout. This page builds the quote cart and covers what Smootify shows to business (B2B) customers.

> [!NOTE]
> Quotes need the **Server** plan and **Draft Orders** turned on in the Smootify dashboard. They run on the site's licensed domain. On your `.webflow.io` address they run once the site is paid, not during a trial.

## How it fits together

A quote is a cart. You build it as in [Build the cart](https://www.smootify.io/docs/build/cart), then choose one of two ways:

| Way | Built with | Use it when |
|---|---|---|
| A quote cart | `data-draft="true"` on `smootify-cart`: every submit of its form sends a quote | the store sells only on quote, or on a quote page of its own |
| A quote button in a normal cart | a Custom element with the tag `button`, `type="submit"` and `name="draft-order"`, next to the checkout button, which keeps working | some customers buy and others ask |

What Smootify needs:

- a `smootify-cart` with its Form Block, as for any cart;
- a Text field whose **Name** setting is `email`, so the draft order has an address to send the invoice to.

What is up to you: the layout, the other fields you ask for, and the texts. Write them as a request, not as an order.

## 1. Build a quote cart

```html
<smootify-cart data-draft="true">
  <div cart-condition="no-items-in-quote">Your quote is empty</div>
  <div class="w-form">
    <form>
      <cart-item>
        <div cart-item="title">Product</div>
        <div cart-item="variant-title">Red / M</div>
        <quantity-input><button data-action="minus">-</button><input name="quantity"><button data-action="plus">+</button></quantity-input>
        <button data-action="remove">Remove</button>
      </cart-item>
      <input name="email">
      <input type="submit" value="Send request" data-wait="Sending…">
    </form>
    <div class="w-form-done"><div>Thank you. We will send you a quote by email.</div></div>
    <div class="w-form-fail"><div>Something went wrong</div></div>
  </div>
</smootify-cart>
```

In a quote cart, the parts of the Form Block change meaning: the Success message is not the empty cart here. Two conditions work inside `smootify-cart`, `cart-condition="items-in-quote"` and `cart-condition="no-items-in-quote"`. The cart’s four states:

| State | What shows |
|---|---|
| The quote has lines | the **Form**: the lines, the email field and the Form Button that sends the request; `cart-condition="items-in-quote"` shows |
| The request is sent | the **Success message**: write it as "request received", so the customer does not think they have bought; Smootify empties the cart, and `cart-condition="no-items-in-quote"` stays hidden. To open a thank-you page instead, set the Form's **Redirect URL** |
| The quote is empty | `cart-condition="no-items-in-quote"`, outside the Form; the Form and the Success message are hidden, and `smootify-cart` has the class `has-empty-quote` |
| Shopify refuses the request | the **Error message**, with Shopify's errors, as in any cart |

## 2. Or add a quote button to a normal cart

In a cart without `data-draft`, add a Custom element with the tag `button`, the custom attribute `type="submit"` and the custom attribute `name="draft-order"`, inside the Form next to the checkout button. The email field goes in the same Form.

```html
<input type="submit" value="Check out" data-wait="Please wait…">
<button type="submit" name="draft-order">Ask for a quote</button>
```

A Webflow Button cannot do this: it publishes a link, and a link does not submit the form.

## 3. What the draft order holds

Each field of the form has its place in the draft order:

A quote request and the draft order it creates, under **Orders > Drafts** in the Shopify admin:

| In the quote cart's Form | In the draft order |
|---|---|
| the lines, each with its variant, quantity and properties (such as an engraving) | **Products**: the same lines, variants, quantities and properties |
| a Text field with the Name `email` | **Customer**: the Shopify customer with that email, created when there is none |
| a Text area with the Name `note` | **Notes**: the note of the draft order |
| any other field, such as `Company` or `Phone` | **Additional details**, with the field's Name as the label |
| the currency the customer saw | the currency of the draft order |

- **The lines** keep their properties, such as an engraving or an uploaded file. A Magic Box arrives as the products inside it. A Shopify bundle arrives as its components, with a “Bundle” detail listing them.
- **The customer** is the Shopify customer with the email in the form. If there is none, Shopify creates one with that email. Without an email field, a logged-in customer’s account is used.

Subscription lines are left out: a draft order does not carry the selling plan. See [Subscriptions](https://www.smootify.io/docs/features/subscriptions).

## 4. Send the quote from Shopify

In your Shopify admin, the request is under **Orders > Drafts**, with the discount codes the customer had applied to the cart. Change the prices or add a discount, then send the invoice. The customer gets an email with a link to Shopify’s checkout, at the price you set. Discount codes can still be used there.

To get an email for each new request, import the ready-made [Quote request notification](https://www.smootify.io/flows/draft-order-notification) workflow in the free **Shopify Flow** app. It reacts when a draft order is created: after importing it, replace the default email with the address that should receive the requests.

## 5. Business customers (B2B)

Shopify’s B2B features, with companies, catalogs and quantity rules, are on every paid Shopify plan. Outside Shopify Plus, a store can have at most 3 active B2B catalogs, and it needs Shopify’s new Markets: see [Shopify’s B2B plans](https://help.shopify.com/en/manual/b2b/getting-started/plan-features). When a customer who belongs to a company logs in with [customer accounts](https://www.smootify.io/docs/build/account), Smootify asks Shopify for products and the cart as that company’s buyer, using the company’s first location. The prices and quantity rules Shopify sets for that company then apply on the site.

**Show the company.** `company="name"` shows the name of the customer’s company, anywhere on the page. `company-metafield="…"` shows a metafield of the company, such as a customer code or the name of their sales contact, and `if-company-metafield` shows an element only when that metafield has a value. For a customer without a company, these elements are removed, and so are the `if-company-metafield` elements for a visitor who is not logged in. `unless-company-metafield` does the opposite: it shows its element when the company has no value for that metafield, and to guests, who have no company. Use it for the guest’s Add to cart next to the company’s Add to quote list. See [customer attributes](https://www.smootify.io/docs/reference/attributes/customer).

**Show the quantity rules.** Inside `smootify-product`:

- `variant="quantity-min"`: the smallest quantity that can be ordered;
- `variant="quantity-max"`: the largest, hidden when there is no maximum;
- `variant="quantity-increment"`: the pack size the quantity must be a multiple of.

**Buy for some, quote for others.** Put the quote button inside an element with `customer-tagged="wholesale"` (use your own tag). Only logged-in customers with that tag see it. Everyone else keeps the checkout button.

```html
<input type="submit" value="Check out" data-wait="Please wait…">
<div customer-tagged="wholesale"><button type="submit" name="draft-order">Ask for a quote</button></div>
```

To order the same list again later, customers can use **Buy again** on a past order: see [Orders and buy again](https://www.smootify.io/docs/build/orders). A minimum order value needs a developer: see [Filters](https://www.smootify.io/docs/developers/filters).

## Coming from 1.x

`window._filterDraftOrderData` still works but is deprecated. The [`draft_order_data` filter](https://www.smootify.io/docs/reference/api/filters/draft-order-data) replaces it and applies to every draft order, not only quotes: see [Filters](https://www.smootify.io/docs/developers/filters).

## Before you publish

On your `.webflow.io` address, press Alt+Shift+D (Option+Shift+D on a Mac) to turn on Smootify’s [debugger](https://www.smootify.io/docs/start/debugger), then send a test request and open it in Shopify.

> [!STUCK]
> - **The draft order has no email.** The field's Name setting is not exactly `email`. Webflow renames fields when you copy a form, such as `Email` or `Email 2`. Set the Name back to `email`.
> - **The quote cart goes to checkout.** Draft Orders is not available on this page: check the Server plan, that Draft Orders is turned on in the dashboard, and that the page is on the licensed domain. Without it, Smootify turns a quote cart back into a normal cart, and a quote button does nothing.
> - **Customers think they have ordered.** The Success message still reads like an order confirmation. Rewrite it as a request received.
> - **"Your quote is empty" never shows.** The element with `cart-condition="no-items-in-quote"` is inside the Form, which is hidden while the cart is empty. Move it outside the Form, inside `smootify-cart`.
> - **The quote button opens a page or does nothing.** It is a Webflow Button, which is a link. Use a Custom element with the tag `button` and `type="submit"`.
> - **A subscription is missing from the draft order.** Smootify leaves subscription lines out of a quote.