Custom Shopify Wholesale Checkout with Jotform
Challenge
The client wanted to offer trade pricing to select (vetted and approved) customers, but did not want to allow credit card checkout due to unpredictable global shipping rules and rates.
Solution
We developed a JotForm-based checkout which captured all cart items from the Shopify cart.items API endpoint with current discounted pricing and quantities and a system to build native shopify orders from this payload.
Services provided
Project Description
There were once three JotForm forms living within an ecommerce store.
The first was a big, detailed form where trade customers could apply for a wholesale account and associated discounted purchase rate.
That form sent data into ClickUp for a team member to review their data and click through to the second form, to approve or deny the application and assign (if approved) an appropriate discount.
Now whenever that trade customer logs into their Shopify account, they see the third form (the JotForm-based Shopify wholesale checkout )... Bbut they wouldn't know it, as itlooks and feels like a Shopify Cart page ... because that's how we made it look.
How do they get to the wholesale checkout form?
Since all wholesale customers are tagged with `Wholesale` (plus another tag that denotes the level of discount they will receive), we can conditionally redirect the 'CHECKOUT' button to go to our bespoke wholesale checkout page (with styled, embedded JotForm) whilst all regular consumers would carry on to the normal checkout page (credit cards).
The JotForm form on the Shopify wholesale checkout page uses custom javascript to iteratively capture all items within the cart and pass them into some hidden form fields. The form allows them to add their own PO number, new shipping address (their billing info was captured at the application stage) and any relevant comments.
We can also conditionally show / change the shipping notification they see according to the country of delivery.
The automated Shopify wholesale order workflow
When they submit their wholesale order, we kick off a little script to empty their cart and redirect them to another 'success' page. So to their mind, the order has been submitted and is being processed.
Meanwhile JotForm has sent the full order payload, with all line items, quantities and prices to Zapier. Within Zapier a custom code block neatly unpacks the order payload and does a few things:
- Add the order to an internal CRM system for a team member to finalise shipping and confirm lead times to the client
- Recreate (after finalisation) the order within the customers Shopify account
- Create an invoice with the customers billing information and full order details.
System walkthrough
Grab the tool for your business
Ready to eliminate busyness from your business?
Let's explore the potential savings and growth goals automation could achieve for your company.