You'll need a little bit of experience editing code to get this working. If you don't have access to the code in your product, or don't feel comfortable editing it, we suggest having a developer on your team take care of it.
It should only take a couple of minutes to do these steps.
Embedding
You'll want to copy the embed code shown on the setup page.
The
access_token_id
will automatically be filled in with your token.The
customer_oid
part is what you'll need to dynamically pass in. This is the customer OID as given by your specific provider. (e.g. Stripe, Recover, Braintree, etc.) Usually, you would have this stored on your server, in a database.
NOTE: We don't sync with provider test environments. Use live OIDs only. This means you'll need to use actual live customer OIDs whenever you expect cancellation events to show up in the Cancellation Insights dashboard. This code should be included before the closing </body>
tag on the page where your current cancellation button, form, or link is.
Triggering
After you've got the embed code put in, you'll need to add an HTML ID of barecancel-trigger
to whatever button, form, or link you want to trigger the form from.
❗ NOTE: Cancellation Insights does NOT actually cancel your customer's account. It simply inserts a form into the process and then sends the user on through to the link or form action you're using to cancel the account with your provider.
Test your work
After you've embedded the widget code, and placed a live customer_oid
you'll need to send a test cancellation. Don't worry, we'll intercept the very first call so it doesn't pass through to the dashboard to muddy up the metrics. Remember just send the Cancelation Insight form don't actually cancel your live customer!
callback_send
Triggered after the "Cancel Account" button is clicked. Useful for capturing the actual account cancellation event from your end if you're not utilizing a standard form element or a link redirect.
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> callback_send: function(data) {<br> // Your own callback logic <br> // e.g. <br> axios.delete(`/api/users/${user_id}`)<br> }<br>}
callback_error
Triggered whenever there is an error within the Barecancel process. Will throw with one error
argument containing all the data for deciphering what's gone wrong. Use this to log your own errors and help debug things on your end before reaching out to us for support.
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> callback_error: function(err) {<br> // Your own error logic <br> // e.g. <br> console.error(err)<br> }<br>}
test_mode
Just fiddling around locally or on staging and don't want to clutter your Baremetrics dashboard with test cancellation events? We've got you!
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> test_mode: true<br>}
Just be sure and remove or toggle this boolean to false before pushing it to production!
subscription_oids
Need to capture reasons for individual subscriptions? Send an array of subscription oids under the subscription_oids
flag.
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> // Array of subscription IDs you're looking to cancel<br> subscription_oids: ["EXAMPLE_SUB_1_ID", "EXAMPLE_SUB_2_ID"]<br>}
comment_required
You can require the comment and optionally set the error message.
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> // Can be a Boolean or a String<br> // In case of String we'll use that as the error message <br> // If the comment is not set<br> comment_required: true<br>}
trigger
If you want to change what element triggers the cancellation modal, you can change the default #barecancel-trigger
selector by any selector supported by document.getQuerySelector
.
<strong><code>window.barecancel.params = {<br> access_token_id: "ABC-123-ACCESS-TOKEN",<br> customer_oid: "CUSTOMER_ID",<br><br> trigger: ".my-custom-trigger-buttons"<br>}