2.0 Beta

Smootify 2.0 is in public beta. Your 1.x store keeps working. Move when you want.

What changed
B2B

Custom quote to draft order

A made-to-measure request sent from your site, with sizes, material and drawings, becomes a draft order with a custom line for the customer: you set the price and send the invoice from Shopify.

How it runs.

A Webflow form writes a metaobject; Shopify Flow takes it from there.

  1. TriggerMetaobject entry created
  2. Action 1

    Create a draft order for the customer with one custom line, the title of the request at 0.00, the tag custom-quote and a note with the sizes, the material, the budget, the notes and the drawing links (“Send Admin API request”: draftOrderCreate)

  3. Action 2

    Tell the team on Slack, with the sizes, the material and a link to the draft order (“Send Slack message”, Slack app)

  4. Action 3

    Email the customer that the request arrived, with a link to the page of their request (the file sends it with a “Send HTTP request” to Resend)

  5. Action 4

    Mark the request as received

What you need, and how to install it.

What you need
  • Shopify Flow, free in Shopify
  • Plan: Server
  • Add-on: Metaobject creator
  • Element: metaobject-creator with data-type="custom_quote" and customer-field="customer", for logged-in customers: title, sizes with their unit, material, budget, notes and a file-input for the drawings
  • Element: Optional: a page with smootify-metaobject and data-type="custom_quote" data-handle-param="q", which the email link opens to show the request and its status
  • Metaobject definition custom_quote, private
  • Storefront access on the definition only if you build the request page: without it, keep the definition private
  • The Slack app in Shopify, connected to your workspace, for the “Send Slack message” step

Settings › Custom data › Metaobjects › Custom quote

Custom quoteMetaobject definition
Typecustom_quote
TitletitleSingle line text
WidthwidthDimension
HeightheightDimension
DepthdepthDimension
MaterialmaterialSingle line text
BudgetbudgetMoneyoptional
DrawingsdrawingsList of files
NotesnotesMulti-line text
StatusstatusSingle line textwritten by the workflow, then by you
CustomercustomerCustomer referenceset by Smootify with customer-field
Active-draft status not needed
Storefronts access not needed: the site never shows them

Each field's key is the Name of a field in the Webflow form, written exactly the same.

How to install
  1. Install Shopify Flow from the Shopify App Store. It is free in Shopify, but it is a separate app.
  2. In Shopify, create the metaobject definition custom_quote with the fields below.
  3. Switch on the Metaobject creator add-on in the Smootify dashboard.
  4. Place the Smootify element in Webflow: metaobject-creator with data-type="custom_quote" and customer-field="customer", for logged-in customers: title, sizes with their unit, material, budget, notes and a file-input for the drawings.
  5. Download the .flow file and import it in Shopify Flow.
  6. Create the definition without a display name field, so every request gets a random handle: the email link carries it.
  7. In the Slack step, pick your channel in place of #quotes.
  8. In the email step, replace RESEND_API_KEY with your Resend API key, set a sender on a domain you verified in Resend instead of quotes@example.com, and point the button to your request page instead of www.example.com/quote. Without a request page, remove the button.
  9. When you price a draft, set the custom line’s price, then send the invoice from the draft order: the customer pays it at checkout like any order.
  10. Test it once with a real submission or order, then turn the flow on.

Where people get stuck.

  1. 01

    Nothing reaches the customer until someone prices the draft and sends the invoice: say on the page who answers and how soon.

  2. 02

    The status after received is yours to change in the admin (in progress, quote sent): the request page shows what the entry says.

  3. 03

    With the request page, anyone with the link reads the entry: keep in it only the project, never an email, phone or address. Leave the definition without a display name field: Shopify then gives every request a random handle. With the title as display name, the handle repeats the title and another customer’s link is easy to guess.

  4. 04

    Files are limited to 20 MB each by Shopify: for heavy CAD files, ask for a link instead.

  5. 05

    Store credit cannot be spent on a draft order invoice.

Get the .flow file.

In Shopify Flow, choose Import and pick the file. The workflow opens turned off: check that it reads your metaobject definition and its field keys, then turn it on.

Shopify plan. This file sends its email with Flow’s “Send HTTP request”, which runs only on the Grow, Advanced and Plus plans. On Basic, replace that step with the action of an app that sends transactional emails from Shopify Flow, such as Workflow Email: the rest of the workflow stays as it is.

Related.

Webflow writes.
Shopify reacts.

Forms that write to Shopify are on the Server plan, and Shopify Flow is free in Shopify. One Shopify app, billed on the store’s Shopify invoice.

  • One app on the Shopify bill, not ten
  • Free to build, pay only when you go live
  • Works on Basic, Grow and Advanced
  • Your 1.x store keeps working
  • Every element stays yours to change
  • Docs indexed in llms.txt