How to add multiple billing plans to an app?

gunnar-1
Shopify Partner
2 0 0

Hi There,

 

I have followed the step to step guide to implement a recurring application charge (https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/charge-a-fee-using-...), but I would actually like to have four options (Basic, Normal, Advanced and Enterprise), how do I do this? I have looked everywhere and tried everything, but I can't get it working. This is the part of the code from the tutorial where I add a billing option:

const stringifiedBillingParams = JSON.stringify({

  recurring_application_charge: {

    name: 'Recurring charge',

    price: 20.01,

    return_url: TUNNEL_URL,

    test: true,

  }

})

 

Where do I put the other options?

0 Likes
Busfox
Shopify Staff
Shopify Staff
619 48 94

Hi @gunnar-1,

 

I think you may be thinking about creating recurring charges wrong. You create a recurring charge on a shop that matches the plan that merchant selected, rather than create a single charge that encompasses all your plans.

 

So using your example, if your plan tiers cost $5, $10, $15, and $20 per month respectively, and the merchant chose the Advanced plan, your Billing params would looks like this:

 

const stringifiedBillingParams = JSON.stringify({
  recurring_application_charge: {
    name: 'Advanced plan',
    price: $15,
    return_url: TUNNEL_URL,
    test: true,
  }
})

You'll need to have logic in your app to know which plan a merchant chooses, and to make the appropriate API call to create the correct charge.

 

Hope that helps! Let me know if you need any clarification!

 

 

0 Likes
gunnar-1
Shopify Partner
2 0 0

Thanks for the reply! It's the logic for a client to choose a plan in the first place that I'm after, would you be able to help me with that?

0 Likes
osamaeshtiaq
New Member
2 0 0

How can we add logic in our app to know what plan has the user chosen?

0 Likes
Adam_Hurlburt
Explorer
41 1 10

I'm doing this right now for my app which brought me to this thread.

 

I'm pretty sure you'll need to create your own UI with buttons to select the plan, when the buttons trigger you would trigger the app subscription logic, handle the webhook, etc.

 

The one thing I haven't been able to find (and I was searching for), was if you can allow the merchant to select a plan on installation, I'm guessing you would essentially allow the installation without a plan and then detect the merchant doesn't have a plan and then show them a UI which prompts for plan selection before they can do anything else. I suppose you could auto opt them into the most basic plan to start as well and then allow for upgrade later. Would be nice if there was a tutorial with some examples of options. The number of threads on this is a good indication it's insufficiently explained.

 

Edit: found this thread: https://community.shopify.com/c/Shopify-APIs-SDKs/Billing-API-integration-for-multiple-recurring-pla... which I think points to what I mentioned above, you basically let the authentication finish and then present a UI to prompt for plan selection (so you don't follow the tutorials showing you to initiate a recurring charge immediately after auth, instead after auth you show a screen which doesn't let the merchant do anything except choose a plan, each plan can have a free trial, etc. Then once the select the plan you initiate the recurring charge. Would be nice if there was a generic component for this, seems like a pretty common use case but guessing it's up to everyone to build their own for now.

0 Likes