Integrate Payment Gateway in Power Pages

Introduction

In today's online world, it's really important for businesses that sell things or offer services online to have a smooth way for people to pay them. Power Pages is a well-liked tool for making websites because it's easy to use and helps you make websites fast. But if you want to use it for online shopping or selling stuff, you need to add a way for people to pay you. This article will show you how to do that, so you can take payments on your Power Pages website.

Use Cases

Adding a payment gateway to Power Pages can bring lots of benefits for different types of businesses:

Online shops: If you sell things online, adding a payment gateway lets customers buy directly from your website, making shopping easier.
Service providers: People who offer services like advice, coaching, or freelance work can get paid online, which makes it simpler for clients.
Donation pages: Charities and non-profits can collect donations smoothly through their Power Pages websites, making it easier for people to give money for good causes.
Event Sign-ups: Businesses that organize events or workshops can let people sign up and pay for tickets online, making the whole process of registering simpler.

Step-by-step process to integrate payment gateway

Step 1. For this article, we will use 'Stripe' as our payment gateway. Go to STRIPE and create an account for yourself. Navigate to the developer's page and copy Publishable and Secret keys under API keys as shown below.

Publishable

Step 2. Create a Power Pages Site or use an existing one. Click on the edit button as shown below.

Step 3. Add a blank payment page on the site created in Step 2 as shown below.

Payment

Step 4. Click on the 'Set up' tab on the left navigation. Go to External apps -> Install 'Stripe' integration -> Click on manage.

External

Step 5. A new pop-up will appear. Paste the Publishable and Secret keys copied in Step 1 and save.

Enable stripe

Step 6. Go to Data Tab -> Click on New Table -> Create a table with the name 'Payment' -> Click on Primary Column.

Table

Step 7. Under Primary Column -> Update column name to Payment Number -> Set column requirement Business Recommended-> Click on save as shown below.

Payment number

Step 8. In the Payments table, make the following changes

Change the datatype of Payment Number: Auto Number
Create a new column Amount with datatype: Currency
Create a new column Customer Name with datatype: Text as shown in the image below.

Step 9. Now edit the 'Information' form in the payment table. Update the form as shown below.

Customer name

Step 10. Create a new form named 'Payment' and update the form as shown below.

General

Publish all the changes and come back to the payment page.

Step 11. On the payment page, select the Multistep form as shown below.

Multistep form

Step 12. Provide the form name and click on done.

Click on done

Step 13. Now click on Add Step as shown below.

Click on add step

Step 14. Update details in step 1 as shown below and click ok.

Click on ok

Step 15. Now add another step update details as shown below and click ok.

Add another step

Step 16. Now sync the changes on the power pages site. After syncing is complete, click on step settings for Step 2 and update details as shown below.

App integration

Step 17. After the above changes are made, the form will look as shown below.

Pop up window

Step 18. Now restart the power page's site before opening it in real time.

Step 19. Open Power Pages Site -> Go to the payments page -> Fill in the details as shown below and click next.

Click on next

Step 20. On the Payment Page, fill in the credit card details and click on Pay Now.

Click on paynow

Step 21. The user will get a success message as shown in the image below.

Success message

Conclusion

Adding a payment gateway to Power Pages helps businesses take online payments, creating new chances for selling things and making money. By following this article, you can easily set up a payment system on your Power Pages site. Whether you're selling items, providing services, collecting donations, or managing event sign-ups, integrating a payment gateway improves your website's features and makes it more professional. Please feel free to reach out in case of any concerns.