MasterPass is here and available in BlueSnap’s Payment API! This is an important new digital wallet that securely stores a shopper’s payment and shipping details and supports all major credit and debit card types, including MasterCard, Visa, American Express, Discover, Diners, and JCB.
Offering MasterPass can help you increase conversions across devices, including mobile devices. Implementation is not difficult, so don’t let the initial setup stand in the way of getting more sales!
Let’s look high-level at what is involved in integrating with MasterPass in the Payment API (don’t worry Hosted Checkout merchants, you can find your documentation here):
Add the MasterPass button to your checkout page
To add the MasterPass button to your checkout page, you just need to add this code:
But where should you place the button to create the best checkout flow for your shopper?
We’d recommend placing it early on in the checkout process, before the shopper has had to complete any forms with the address or other details. This is because the shopper’s address and payment details are already stored in MasterPass, so you can take advantage of this to minimize checkout friction. Here’s an example of a shopping cart that includes the MasterPass checkout option right up front.
If the shopper checks out with MasterPass, you can then just pull the shopper info from MasterPass and populate any remaining forms with that information. Less work for the shopper means quicker checkout and lower chances that the shopper might abandon the cart.
Launch the MasterPass lightbox when the shopper chooses MasterPass
The shopper will complete checkout in the lightbox, and upon finishing will be sent back to your site for final confirmation of the purchase.
Get final shopper confirmation
When the shopper finishes in MasterPass, BlueSnap will pass you the wallet ID and the shopper’s information from MasterPass. You can then display the relevant details, such as the final price and shipping address to the shopper and get the shopper’s confirmation to complete the purchase.
Process the transaction
After you have the shopper’s confirmation, you are ready to process the transaction via MasterPass in the Payment API!
There are two easy ways to do this:
Option 1. Create or update a Vaulted Shopper with the wallet info, and then use the vaulted shopper ID in the Auth Capture or Auth Only request
You can save the shopper’s information from the wallet by including it in a Create Vaulted Shopper or Update Vaulted Shopper request.
Create Vaulted Shopper with wallet ID
Then just send a standard Auth Only or Auth Capture request with the vaulted shopper ID.
Option 2. Add the wallet ID directly in your Auth Capture or Auth Only request
If you prefer, you can simply include the wallet ID directly in an Auth Only or Auth Capture request.
Auth Capture with wallet ID
Your transaction is complete and the shopper benefitted from a simple and smooth checkout process.
For complete details on MasterPass in the Payment API, see our Developer Hub.
If your payment gateway isn’t letting you integrate with digital wallets, you may want to consider switching. Here is your ultimate guide to switching payment gateways: