One-time PayPal Payments

This page will explain in 2 steps how to implement PayPal one-time payments into your Bubble app using SubSocket Single Payment.

Switching from sandbox mode to live:

PayPal offers a sandbox and live mode (like the test and live mode in Stripe). In this documentation we will create a sandbox integration. Sandbox mode is used for testing while live mode is for receiving real payments. To test the sandbox integration you will need your sandbox credentials. Best practice is to first implement the sandbox environment and after successfully testing replace it with the live environment. When switching from sandbox to live, you will need to upgrade to the Launch plan in SubSocket and add your live Client ID and Secret to SubSocket if you have not already. You will also need to, for example, replace your sandbox Single Payment URL for a Single Payment URL you created in live mode in SubSocket.

Visit SubSocket.io and create an account. Once you have created an account, you will see a screen where you can create your first application. You will need an application name and your PayPal API keys. Your live keys aren't needed immediately, you can always add them later. You can read here more on how to retrieve your PayPal API keys.

Create a SubSocket Single Payment

Inside your SubSocket dashboard, you can go to the Single Payment tab and click on the button Create Single Payment to create your first Single Payment. After creation, you can see your Single Payment details like the Single Payment ID and the Single Payment URL.

Step 2/2: Let a user create a one-time PayPal transaction using the Bubble plugin

Keep in mind that in Bubble you have a version-test and version-live. So make sure you are using the correct Return/cancel URL in your live app.

To create a one-time transaction you can redirect your users to the Single Payment URL. Our plugin make handling these URLs super easy. To subscribe a user to a plan, you need to do the following inside your Bubble editor:

1 - Place a button (or any other element) on your page.

2 - Create a workflow for this button with the 'Open an external website' workflow action:

3 - Inside the properties for this action, you can place your Single Payment ID. When this action is run your user is redirected to the Single Payment URL. As simple as that! To make check that the payment is completed, we need to do one last thing when the user is redirected to the return URL.

Keep in mind that in Bubble you have a version-test and version-live. So make sure you are using the correct Return/cancel URL in your live app.

Check that the payment succeeded

To check that the payment succeeded when the user is redirected back to the return URL, you need to implement the following workflow on page-load on the page of your return URL.