Automated Quotes using Webflow

Community resources General
1

Hi,
I have a client who wants users to pick a default product on their website. (Say through use of a form).
They then customise their order by adding accessories: W,X,Y,Z
They then enter in their contact details and hit GET MY QUOTE.
Rather than having an ecommerce element/order, they simply want to produce an automated email with their price. Ideally we would use an integrated CRM system to record the lead generation for follow-up marketing. HubSpot say this is not possible on their platform. Can anyone advise on a solution and how we could make this work on a Webflow website?

Thanks in advance.

1 Like
2

There isn’t anything overly complex you’re trying to do here, but you’ll probably need custom script to handle the product-specific-accessories feature, depending on how that data is arranged. You’ll also want to integrate it with your CRM and email handler through automation.

I’d recommend;

Webflow + custom script
Probably the CMS for the product + accessory data
Your own CRM
Make.com or possibly Logic automation, connecting the systems
Mailjet for the email notification

If you need more complex form behaviors, have a look at extending Webflow with Wized.

Message me if you need someone to help you build this.

3

Thanks for your response. I’m not sure where to start with such a custom script. Has anyone done this before? Could I use something like Zapier to automate the order over to HubSpot and to email?

4

HubSpot is fine, and Zapier will work ok here too. Make.com would be a better choice since you’d have the option to do the calculation server-side and return the response.

Your code falls into 3 parts;

FORM UX
Depends entirely on how you design the form and how you want the form to work for adding N accessories and verifying legit combinations. It will basically manage that client-side UX, and validate the form, prepare the form data for transmission.

CALCULATION
Somewhere, you’ll need to calculate the quote. Could be client-side before its sent, or could be server-side if you want to build it into the automation directly. Or, skip that, and let the team manually quote and send those emails by hand.

RESPONSE ( optional )
If you’re displaying the quote calculation as well as emailing it, you can receive the Webhook response and display the quoted amount on a successful quote.

If you’re not comfortable with custom coding and don’t want to hire a dev to build that piece for you, you can find some monthly services that might work for what you’re trying to do. Check out Wized, and also Formly Logic, and see if you can accomplish what you’re wanting to do here.

I typically build these features custom because it cuts the monthly fees and gives maximum flexibility when you write your own custom code.

1 Like
5

You’ve got some challenges. But it’s totally doable :smile:

I’m not sure if you’re using Webflow ecommerce or not, but if so, I’m not too familiar with how you could bypass all of that.

If you’re not using an ecommerce solution, you’ll have an easier time at it.

Here’s one approach…

Here’s how to get native Webflow forms into a glue service that starts all of your automations for this:

You’ll need somewhere to store a “lookup table”.

The user selected a product, you need to lookup that products price. Then the user selected some accessories, you’ll need to lookup those accessory prices and add them to the product price.

Here’s a walk through of what lookup tables are and how to set them up:

That tutorial uses the Make (Integromat) datastore, but for your specific needs I’d go with Airtable instead. You could also use Google Sheets. Here’s an example of using both (but the examples are different, so it’s more showing you an overview versus solving your specific problem):

You can do these calculations within Make (Integromat) or Airtable.

This is the easy part :smile:

The last step in your automation is simply adding that user submitted email to a CRM or email service that get’s them into your email sequences.

I like and use ConvertKit for this, but I’ve also been a long time user of Campaign Monitor.

Here’s a tutorial to set that up:

You can do all of this with Webflow, native Webflow forms, a glue service, Airtable and Campaign Monitor / ConvertKit.

Once they are ready to pay, you can send them a Stripe Payment link. You’ll want to create a Webhook on Stripe’s end to send a successful payment message either into Airtable, Google Sheets, or the Webflow CMS to track the conversion.

To setup those Webhooks you can run through this tutorial:

Make it happen! :smile:

1 Like
6

Hey folks, thought this would be helpful and sounds similar to what you you guys were trying to do.
Essentially all you need is CMS and no ecommerce. I’ve created a cart that uses a javascript package that I created, and allows you to add the product info to a cart, and then submit to the owner of the site via email.
Clonable site here: add-to-quote-navbar - Webflow

7

Hi @Bammedia.
Josh with Foxy here. What you’re after is possible with our seamless Webflow integration: https://foxy.io/webflow

  • Manage products with Webflow CMS
  • Allow for customizable options and add-ons (managed with Webflow CMS)
  • Customers add products to cart and Foxy handles order totals
  • Customer can complete quote/order without having to pay
  • Customer and merchant receives email confirmation
  • Customer/quote info is automatically sent to Hubspot via Make, Zapier, Pipedream, etc.

We have years of experience with Webflow and offer an unlimited free trial. Please don’t hesitate to reach out if you have any questions or need help getting started: hello@foxy.io

Thanks,
Josh