How to use PayPal with Web Forms (Complete Tutorial)

Dec 28, 2016 1:39 pm

This post is to show you step-by-step instructions on how to use PayPal with Web Forms. This post will guide you through the following steps:

  1. How to setup your PayPal API
  2. How to enable PayPal for Web Forms
  3. How to setup a Web Form to use PayPal
  4. How to create a Custom PayPal Confirmation Page

Step (1): How to setup your PayPal API

First, login to your PayPal Account and navigate to your Developer Dashboard. From the Dashboard click on the My Apps & Credentials link in the left-hand menu and scroll to the REST API apps section:

---
Click on the Create App button and give it a unique name.
---

On the next page you will see your Client ID and Secret. Copy those values and save them in a .txt file to your local machine (for example).

Note: For security purposes do not share these values.

---

Step (2): How to enable PayPal for Web Forms

In your Freedom Green interface go to > Green > Toolbar > Edit Web Forms under the Website column. There you will see a Settings section with the PayPal Client ID and the PayPal Secret fields. Copy/paste the Client ID and Secret values obtained from Step (1) above. Save.

---

How to setup a Web Form to use PayPal

In order to use PayPal in a Web Form (such as a Membership Renewal Form) you must have first completed steps (1) & (2) of this tutorial. Then, your web form must have the following two Fields:

Type: PayPal - Hidden (or other optional)
Unique ID: total_payment
Value: Enter in a value or leave blank to accept what is submitted by the browser

Type: PayPal - Hidden
Unique ID: paypal_button
Value: Blank

For example, if you have a Membership Renewal form you would have your Membership Fields and your PayPal Fields. Then, when a user fills out and submits the form they will be redirected to PayPal's website to complete their transaction. Once the user completes their transaction they are redirected back to the Freedom site. Depending on the form's configuration the user will either be presented with a default Freedom system generated message where the user is required to click a link to finish the transaction or they will be presented with a custom PayPal Confirmation Page.

Finally, when the user clicks the Finish link to complete the transaction they will be presented with a Thank You Page.

---

How to create a Custom PayPal Confirmation Page

First complete steps (1), (2), and (3) of this tutorial. Next edit your Web Form and go to the Configuration tab. There you will see a section for PayPal Confirmation. This is where you put content that you want the user to see when they are redirected back to the website from PayPal after submitting a payment. If this editor is left blank users will be presented with a Freedom generated message.

The Thank You page's content will be what the user will see upon clicking the Finish link on the PayPal Confirmation page. If the Thank You page's HTML source is left blank the user will see a Freedom generated default Thank you page.