Pre-selecting PayPal via Store Builder Library
This article explains how you can attempt to skip the FastSpring Storefront and send your customer directly to PayPal, using the Store Builder Library.
Using Store Builder Library (SBL), you can optionally create a button that launches PayPal directly. The goal is to bypass the initial Popup Storefront or Web Storefront interface altogether. However, this approach is only available under certain conditions. Using this method streamlines the purchase process for customers who frequently make purchases using PayPal. It may also make the process more familiar to such customers and should improve conversion rates for them.
- Conditions Required to Pre-Select PayPal
- Methods of Pre-Selecting PayPal
- Determining When to Display a Separate PayPal Button
Conditions Required to Pre-Select PayPal
Under certain circumstances, pre-selecting PayPal still results in the standard checkout flow (with a Popup Storefront or a Web Storefront). When this happens with a Popup Storefront, PayPal is selected as the payment method.
The FastSpring Storefront cannot be skipped in any of the following circumstances:
- You can configure your Storefront to allow customers to opt-out of having FastSpring save the payment details when buying a subscription (thus creating a manual renewal subscription). If the Storefront targeted via the data-storefront attribute when you load SBL allows this, then the Storefront cannot be skipped. It is displayed to allow the customer to select or clear that checkbox. To control this setting:
- For Web Storefronts: Storefronts → Web Storefronts → Settings → General Settings → Auto/Manual subscription renewal
- For Popup Storefronts: Storefronts → Popup Storefronts → Settings → Checkout → Auto/Manual subscription renewal
- If FastSpring does not support PayPal payments in the order country (e.g., in Turkey), then the Storefront is displayed as usual, with no PayPal option available.
- If the buyer's postal code is required (e.g., for U.S. orders) and is not included in the SBL session, then the Storefront cannot be skipped. You can prevent this by supplying the buyer's postal code via one of the following methods if the postal code is known:
- using fastspring.builder.push() on a session containing a payment contact object that includes the buyer's postal code
- using fastspring.builder.recognize() on a payment contact object that includes the buyer's postal code
Methods of Pre-Selecting PayPal
To create a button that attempts to skip the FastSpring Storefront and directs the customer straight to the PayPal login, use one of the following approaches:
- The markup directive data-fsc-action="PaypalCheckout"
- Include both of the following in your session object:
- "paymentMethod": "paypal"
- "checkout": "true"
Determining When to Display a Separate PayPal Button
There are two ways you can identify whether or not PayPal is currently available for the order session. Using either of the following methods, you can hide or show a dedicated "Pay with PayPal" button, according to PayPal's actual current availability.
Using the smartdisplay Directive
If you plan to create a button using the markup directive data-fsc-action="PaypalCheckout", you can add a couple of directives to the button so that it only appears when PayPal is currently available.
Adding both data-fsc-order-paypal-available and data-fsc-smartdisplay to your button causes the element to be hidden when PayPal is not available, and to be displayed when it is available. Here is an example of a basic button (you could adjust the style using CSS):
<button data-fsc-action="PaypalCheckout" data-fsc-order-paypal-available data-fsc-smartdisplay>Check Out with PayPal</button>
Parsing the Order Object Response
The order object response includes an array named availablePaymentMethods that lists each of the payment methods that are currently available. The response includes a single value for each available payment method, as in the following example:
"availablePaymentMethods":[ "wire", "paypal", "card", "purchaseorder", "amazon" ],
If "paypal" is in the array, you can display a button that launches PayPal directly. If "paypal" is not in the array, you may choose to suppress/hide the button.