Cancel Flows Implementation (API)
Implementing Cancel Flows is a straightforward process with minimal setup effort. Feel free to direct any questions to support@churnbuster.io.
Design - The Churn Buster team takes care of the initial design, matching your existing process and implementing best practices. The Editor makes it easy to update and improve your Cancel Flows over time.
The rest of this article outlines how to connect Cancel Flows to your subscription portal.
1 - Add the Cancel Flow snippet to the <body> of the portal page where subscribers can click to cancel
The snippet below directs customers to the Cancel Flow page to start a cancel session when they click "Cancel Subscription" in their portal.
- The portal page where customers click to cancel should dynamically populate customerId, subscriptionId, and customerEmail so Churn Buster can identify which customer's cancel session to load.
If 1 cancel link on the page
<script type="text/javascript">
(function () {
ChurnBuster = window.ChurnBuster || {};
ChurnBuster.cancelAttributes = {
accountId: "CHURN_BUSTER_ACCOUNT_ID",
source: "REPLACE_ME",
customerId: "REPLACE_ME",
subscriptionId: "REPLACE_ME",
customerEmail: "REPLACE_ME",
cancelButtonText: "Cancel Subscription"
};
var script = document.createElement("script");
script.type = "text/javascript";
script.async = true;
script.src = "https://proxy-assets.churnbuster.io/v4/scripts.js?v=1678742553659";
var insert = document.getElementsByTagName("script")[0];
insert.parentNode.insertBefore(script, insert);
})();
</script>
^ You can find CHURN_BUSTER_ACCOUNT_ID in your Churn Buster account here.
If 2+ cancel links on the page (or using a front-end technology for page navigation like Vue.js, Angular, Ember, React, etc.)
Install the following snippet, and add [data-subscription-id] to each cancel link.
<script type="text/javascript">
(function () {
ChurnBuster = window.ChurnBuster || {};
ChurnBuster.cancelAttributes = {
accountId: "CHURN_BUSTER_ACCOUNT_ID",
source: "REPLACE_ME",
customerId: "REPLACE_ME",
customerEmail: "REPLACE_ME",
cancelButtonSelector: "REPLACE_ME"
};
var script = document.createElement("script");
script.type = "text/javascript";
script.async = true;
script.src = "https://proxy-assets.churnbuster.io/v4/scripts.js?v=1678742553659";
var insert = document.getElementsByTagName("script")[0];
insert.parentNode.insertBefore(script, insert);
})();
</script>
^ You can find CHURN_BUSTER_ACCOUNT_ID in your Churn Buster account here.
2 - Hooking up offer acceptance
When customers click to claim an offer, you can receive the Cancel Session Won webhook as a trigger to apply the offer to the subscription (configured in your system).
- As a simpler alternative, you can use the Cancel Session Won zap trigger in the Zapier integration to get notified of the offer acceptance and apply the offer.
3 - Hooking up cancellation actions
When customers cancel their subscription, you can receive the Cancel Session Lost webhook as a trigger to cancel the subscription (configured in your system).
- As a simpler alternative, you can use the Cancel Session Lost zap trigger in the Zapier integration to get notified of the cancellation and apply it.
4 - Test on an actual subscriber portal page
Go to a subscription page for a customer, then add querystring parameter churn_buster=test (&churn_buster=test) to the URL and reload the page (click Enter).
Clicking "Cancel Subscription" (or whatever cancel link/button you've designated) should start a test cancel session.
- While in test mode, the session does not trigger actions/webhooks.
- To fully test actions, remove churn_buster=test and start a live session with a test customer.
If a cancel session does not begin, check the dev inspector or contact support@churnbuster.io.