Upgrade to new Billing Pages

Upgrade steps to turn your current Billflow embeds to the new Billing Pages

Have you already integrated with Billflow using the embed snippet with config options? No worries, your current integration will work fine. The benefit that the new Billing Pages provides is that it hosts your configs so you never have to go into code to update them. Now, all updates are done straight from the Billflow dashboard. Follow the steps below to upgrade to the new Billing Pages.

Step 1: Create Billing Page

On the dashboard you will now find 5 options for billing pages. Create a new billing page for your needs.

Pricing Page: Same as the previous pricing page type. Intended for marketing site.

Checkout Form: Same as the previous Signup/checkout form.

Plan Picker: New type intended for plan selection in-app and optionally showing customer portal for subscribers. Use this if you are using the customer portal and signing users up with it as well.

Customer Portal: Same as the previous customer portal type. Intended for subscription management in-app. Use this if you are using just the customer portal portal currently.

Invoice Portal: New type that is similar to the customer portal. Intended for viewing invoices in-app.

Step 2: Set options to match your config

Go to your current embed snippet and turn on the options on the billing page to match what you have configured on your embed snippet. Options on the dashboard are worded naturally so it will be intuitive to pick the options you have configured from your snippet.

Save once you are done and you will have the option to embed.

You can still pass in configs to the new snippet just as before. So any dynamic data you will pass in the same way like the commonly used 'metadata' option. Same for handleResponse.

Step 3: Update your current embed snippet

Copy your new embed snippet. It should look familiar, it has an addition of a billing_page_id. Necessary dynamic values will still be there like email and hash, but all other options can now be set on the dashboard. Paste your new snippet in.

Secure Setup remains the same

<div id="billflow-embed"></div>
    <script>
        window.billflowSettings = {
    "billing_page_id": "7nTEgMCYPYSHvCOdwqyo",
    "email": "// change this to your customer's email",
    "hash": "// change this to your hash generated by your server using secured setup"
};
        (function () { var s = document.createElement('script'); s.src = 'https://js.billflow.io/billflow-embed.js'; s.async = true; s.type = 'text/javascript'; var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x); })();
    </script>