PayPal CheckoutPRO

The PayPal Checkout add-on allows you to accept PayPal or credit card payments from your forms. You can either charge a fixed amount using the button in isolation, or you can use the WS Form E-Commerce fields to produce more advanced cart options.

The PayPal Checkout button uses the latest client-side payment process offered by PayPal. Their express and standard editions are now considered legacy products.

Note: When a PayPal Checkout transaction is completed, WS Form PRO will store the transaction ID with the form submission. This transaction ID is a credit transaction ID. Your customer will receive a debit transaction ID. Although these IDs are different, you can still search using either transaction ID in PayPal.

Installation

The WS Form PayPal Checkout add-on is installed in the same way as installing the WS Form PRO plugin.

Once installed you will need to activate the license for the plugin. When you purchase the PayPal Checkout add-on, you will be given a license key. If you have lost your license key(s), click here.

To activate your license key:

  1. Click ‘WS Form’ in the WordPress administration menu.
  2. Click ‘Settings’.
  3. Click the ‘PayPal Checkout’ tab at the top of the page.
  4. Enter your license key.
  5. Click the ‘Activate’ button.

If your license key fails to activate, please ensure you are using the correct license key and not your WS Form PRO license key.

Configuring PayPal Checkout

In order to use the PayPal Checkout button, you first need to enter your PayPal client ID’s.

If you do not yet have a PayPal account, register for a new account.

To obtain your client ID’s:

  1. Login to your PayPal account
  2. Create a new app by clicking here

To enter your client ID’s:

  1. Click ‘WS Form’ in the WordPress administration menu.
  2. Click ‘Settings’.
  3. Click the ‘PayPal Checkout’ tab at the top of the page.
  4. Enter your sandbox and live publishable key.
  5. Click the ‘Save’ button.

Once configured, the PayPal Checkout button will appear under the ‘E-Commerce’ section of the toolbox when editing a form.

Adding The PayPal Checkout Button

To learn how to add, edit, clone, move, resize, offset, or delete a PayPal Checkout button field, please click here.

When editing a custom button field, the field settings sidebar will appear. This contains the following tabs:

You can edit any of the settings in each of these tabs and then click the ‘Save’ button to save your changes. If you do not want to save your changes, you can click the ‘Cancel’ button or click any other form element to close the field settings sidebar.

For a full explanation of the configuration options for the PayPal Checkout button, click here.

Basic

The basic tab contains settings that the majority of WS Form users will need to control a field. The settings are as follows:

Label

This label is used to identify the custom button in the WS Form form builder.

Transaction

Amount To Charge

By default this field is blank, and the PayPal Checkout button will charge the amount calculated by the e-commerce fields on your form (the same as entering #ecommerce_cart_total). For example, you might have a single price field for making a donation, or a more elaborate form with prices, quantities, and subtotals.

You can also enter a fixed amount into this field.

WS Form variables can be entered into this field.

Description

Enter the description of the transaction in this field. For example: Payment To My Blog.

WS Form variables can be entered into this field.

Note To Payer

The note to payer option allows you to add a note that will be shown in the PayPal Checkout modal.

PayPal Checkout Note To Payer

WS Form variables can be entered into this field.

Button

Label

Select the style of button you would like to create by changing this setting. The available options are:

  • PayPal Checkout
  • PayPal Credit
  • Pay with PayPal
  • Buy Now
  • PayPal
  • PayPal Installment

Further information about the available button styles can be found by clicking here.

Color

Select the button color you would like to use. The default and recommended color is gold.

Shape

Select the button color you would like to use. The default and recommended shape is pill.

Size

Select the button size you would like to use. The default and recommended shape is small. Note that the responsive size is also a preferable option when taking advantage of WS Forms responsive layouts.

Height

Height is optional. Leave this field blank, or enter a value in pixels (typically between 25 and 55) to specify a button height. Different button sizes have different limitations on height.

For further information about button heights, click here:

Layout

This setting determines the button layout when multiple buttons are available. Choose from horizontal or vertical.

Tagline

When enabled the PayPal tagline will appear under the button.

Funding

Funding

When multiple funding sources are available to the buyer, PayPal automatically determines which additional buttons are appropriate to display. However you can choose to opt in or out of displaying specific funding sources in either the horizontal or vertical layout.

When enabled the specified funding methods will be shown if the buyer is eligible.

Funding Icons

If enabled funding icons will be shown (e.g. Visa, Mastercard, etc).

Advanced

The advanced tab contains additional form attribute settings that provide further control over how the PayPal Checkout button is rendered.

Shipping

Recipient Name

You can use this field to pre-populate the recipient name when used in conjunction with the shipping mapping fields.

Shipping Address Mapping

This field is optional. Shipping Address Mapping tells WS Form which of your form fields relate to the corresponding shipping fields in PayPal Checkout. When using this feature, the following fields MUST be mapped:

  • Address Line 1
  • City
  • State
  • Postal Code
  • Country

To map a field:

  1. Click the ‘Add’  icon at the bottom right of the field mapping section.
  2. In the left-hand column, select your form field.
  3. In the right-hand column, select the corresponding PayPal field.
  4. Repeat this process for each field on your form.
  5. Click the ‘Save’ button at the bottom of the sidebar to save your changes.

Transaction

Detail Mapping

This field is optional. Detail  Mapping tells WS Form which of your cart detail form fields relate to the corresponding detail fields in PayPal Checkout. When using this feature, the following fields are available for mapping:

  • Subtotal
  • Shipping
  • Tax
  • Handling Fee
  • Shipping Discount
  • Insurance
  • Gift Wrap

To map a field:

  1. Click the ‘Add’  icon at the bottom right of the field mapping section.
  2. In the left-hand column, select your cart detail form field.
  3. In the right-hand column, select the corresponding cart detail PayPal field.
  4. Repeat this process for each field on your form.
  5. Click the ‘Save’ button at the bottom of the sidebar to save your changes.
Zero Amount

You can configure how WS Form should handle zero amounts for PayPal Checkout buttons. In some cases you may wish to show an error message (e.g., a donation amount is set to zero). In other cases you may wish to still submit the form (e.g., if something is determined to be free). Select the appropriate action from the pull-down list.

Zero Amount Message

If you opt to show an error message, enter the error message you would like be shown here.

Error Messages

WS Form PRO processes any error messages as standard WS Form messages. The error message settings match those of the ‘Show Message‘ action. You can configure these options to change how the error messages are displayed to users.

Classes

For developers WS Form allows you to add your own classes to fields.

Wrapper CSS Classes

The wrapper CSS class setting enables you to add a class (or classes) to a field wrapper. Field wrappers are sections of HTML added around a field to position them on the page. To add multiple classes, add a space between the class names.

Field CSS Classes

To add a class to the actual field element itself, enter a class (or classes) to this setting. To add multiple classes, add a space between the class names.

Breakpoints

The breakpoint settings define the width of a field and also what the offset (how many columns from the left-hand side of the form or the previous field) of a field is for each breakpoint. For more information about the breakpoint settings and capabilities of WS Form, click here.