How to Add Billing Code to Your Shopify App

Ardee Aram

One of the most common mistakes of beginning Shopify app developers is to assume that the Shopify app store will handle pricing and billing for them. Learn how to add billing code to your app to prevent selling it for free.

How to Add Billing Code to Your Shopify App Photo by Clément H on Unsplash

If you published a public app without the appropriate billing code, your hard work would be distributed without any compensation (aka “moolah”). This will cause you lots of grief and heartache if the “giveaway” is not exactly intentional.

It is also rather impossible to contact and manually charge each merchant who downloaded your app. This is especially true if your app stirred demand from thousands of merchants.

Before submitting that app for review, you must double-check if you added the billing code.

Use Shopify CLI to Add Billing Code Template

Fortunately, Shopify CLI provides an effortless way to add billing code to our apps.

Typing the code above will add billing logic to the file server/server.js.

How would you like to charge for your app?

For this example, we select Recurring Billing. You will want to pick this, too, if you’re going to earn monthly recurring revenue from Shopify.

server/server.js will be modified

Your server/server.js would like similar to this before generating the billing code.

After generating the billing code.

When that’s done, let’s adjust the price to be billed.

Check and Modify Price

What file to modify depends on whether you chose Recurring Billing or One-Time Billing in the previous selection.

Recurring Billing

You will need to head to server/handlers/mutations/get-subscription-url.js. For now, you can simplify your plan by having one subscription plan.

The most important things to consider are:

It is best to give customers a free trial to make them feel that they are not taking any risks when evaluating your app.

You need to modify this logic to be true when using in development stores. Switch this to false right before publishing to enable actual billing to production stores. Better yet, have an environmental flag to detect whether you intend to develop or deploy in production.

One-Time Billing

This time, locate servers/handlers/mutations/get-one-time-url.js, and modify the plan name and price accordingly.

Similar to the Recurring Billing above, you need to look out for the following:

Test if Billing Code Works

When all is set and ready to rumble, launch your app, and visit your development store to see if the billing code kicked in.

Some things to consider when testing:

Install the public app in a development store.

Head to the app dashboard, proceed to “Test your app,” and select your development store.

Click the “Install App” button.

Click the “Install unlisted app” button.

Check if billing confirmation page is working properly.

The billing confirmation page

If everything has been done correctly, you should see the above billing confirmation page. Double-check the plan name, price, and currency.

Don’t forget to properly configure your Paypal account so that Shopify knows where to deposit the money when customers purchase your app.

Learned anything from this tutorial? Got further questions that haven’t been answered yet? Comment your queries below, and I’ll get back to you as soon as I can.