Checkout cancelled Hook Tutorial
Last updated by matthewkiata 4 years ago In the previou article, we talked about how to generate dynamic checkout links(Manychat tutorials ) and also how to set up an abandoned cart follow up sequence .
In this article, we will talk about how to “save your customer” when they cancel their checkout on the Stripe hosted checkout page.
Let’s get started.
Checklist
Like our other tutorials, we need to make sure all the moving parts are connected before we move on.
In order to to so, we need:
Create flows and assign keys of that flow to the Chatbot platform
Connect a Stripe account with Panda checkout.
Important notice:
Please read checkout created tutorials before you continue
Set up cancel url in external request
We have talked about how to create dynamic checkouts previously , you should read that before you continue.
In this section, we will add one more extra parameter that can let us redirect to a specific url when the user clicks cancel during the checkout process .
cancel_url:
This will take the customer to the cancel url if they click cancel the payment in the Stripe checkout page. This is optional.
Now, let us modify our external request as below, add this parameter as below:
{
"payment_gateway": "stripe",
"product_price": 434,
"product_qty": 1,
"product_name": "Manychat DEMO Product",
"product_brief": "This is short description",
"contact_email": "test123@gmail.com",
"allow_shipping_countries": "AU",
"product_image": "https://images.immediate.co.uk/production/volatile/sites/23/2018/09/kangaroo_DirkFreder_iStock_623-18af7bd.jpg?webp=true&quality=90&resize=620%2C413",
"success_url": "https://www.google.com",
"cancel_url": "https://www.pandacheckout.com"
}
As per the screenshot below:
So after you set it up, now you can send test request to generate the checkout link,
Test cancel URL in the Stripe checkout page
First let’s generate the checkout link after we set up the cancel URL.
If you go to the Stripe hosted checkout page, and if you click the top left back button , you should be able to redirect to the URL you just set up.
Now we have set up the cancel for your checkout, and you can redirect the url to your own page, and maybe a page with content to handle the potential customer FAQ questions.
Set up checkout cancelled hook trigger
Just like the way we set up the “checkout created” hook, we will do the same to set up the “checkout cancelled” hook.
Not only can you redirect the user back to the specific cancel url, you can follow up with the messenger user with an automation right inside of the chatbot , and also provide the checkout link again.
If that’s something you want to do, keep reading.
If that’s something you want to do, keep reading.
First, let’s create the “checkout cancelled” hook, and also
This demo is built for Manychat platform.
Create the “Checkout cancelled” hook as below:
Set up custom field
And now, let’s set the custom field of “Checkout URL” in your chatbot. You need to swap to your own custom field name.
Now, you can pull the “checkout URL” from the order information section, and pull the “Chatbot set custom field” from the Integration section, and then connect these two fields, when this hook triggers, the value will set up for that specific user.
Important Notice:
Make sure the custom field name is EXACTLY the same with the name in the custom field
Add new Tag
Now we want to add the tag to the user, here is how to do it:
Drag the “Chatbot Add Tag” action into the canvas, and add any number of tags you want.
Send the user to a flow
Suppose you already have a flow specifically for the cancellation. And it looks like this in Manychat.
Now, Let’s copy the flow ID from Manychat and set it up in Panda checkout as below:
The Manychat Flow ID looks like this “content20210410132107_483171”, you can easily find this in the Flow website URL.
Now, Let’s set up the send flow action in panda checkout as below:
Checklist before testing
Make sure you go through the checklist below when you are testing the “Checkout Cancelled” hook.
Before we do any test, here is a final check list:
Connect a Stripe account with Panda checkout.
Create flows and assign keys of that flow to the Chatbot platform
Created dynamic checkout links in your chatbot(Chatrace tutorials here ), make sure you include platform, platform_customer_id, flow in the body of the request.
Set up Chatbot actions(set custom field, add tag, send flow, send content) in the exact flow ID when you create a dynamic checkout link.
If you have ticked all the above points, you should be able to receive a success message right inside of your chatbot when the customer cancels the checkout process.
If you set up the cancel url properly, when you are in the Stripe hosted checkout page, when you click the cancel link at the top left corner, you should be able to redirect to the cancel url and also receive the “checkout cancelled hook” messages.
