PayPal Shopping increases conversion. You better believe it.
Before using the Web SDK make sure you have required it by adding this tag on every page that you intend to use the SDK. You do this by adding this code snippet in your element.
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script src="https://www.paypal.com/sdk/js?client-id=SB_CLIENT_ID&analytics=custom"></script>
</head>
Add this code to initialize the SDK. We use this to identify one integration from another. You can obtain your client ids from https://developer.paypal.com
pp.init({
client: {
sandbox: 'AZDxjDScFpQtjWTOUtWKbyN_bDt4OgqaF4eYXlewfBP4-8aqX3PiV8e1GWU6liB2CUXlkA59kJXE7M6R',
production: '<insert production client id>'
}
})
The PayPal pixel is a snippet of JavaScript code that allows you to track visitor activity on your website. It works by loading a small library of functions which you can use whenever a site visitor takes an action (called an event) that you want to track (called a conversion). Tracked conversions appear in the PayPal Insights dashboard, where they can be used to measure the effectiveness of your checkout integration, to define custom audiences for re-targeting, for dynamic offer campaigns, and to analyze that effectiveness of your website’s conversion funnels.
In order to implement the pixel, you will need:
- Access to your website’s code base
- Your pixel’s base code or your PayPal App’s client id.
- Access to your PayPal Account
Ready? Let’s get started.
You can use the PayPal pixel to track your website visitors’ actions. This is called conversion tracking. Tracked conversions appear in the PayPal Insights dashboard, where they can be used to analyze the effectiveness of your conversion funnel. You can also use tracked conversions to define custom audiences for optimization and dynamic messaging campaigns. Once you have defined custom audiences, we can use them to identify other PayPal users who are likely to convert and target them with your messages and offers.
There are three ways to track conversions with the pixel:
-
standard events, which are visitor actions that we have defined and that you report by calling a pixel function
-
custom events, which are visitor actions that you have defined and that you report by calling a pixel function
These are functions of the tracking SDK
paypal.Session.setUser(userId) // Should be actual emailpaypal.Session.addToCart(data)
paypal.Session.removeFromCart(data)
paypal.Session.purchase(data)
--- (For recommendations in the future) --- paypal.Session.view(data)
paypal.Session.click(data)
paypal.Session.search(data)
Commerce identity gives you the ability to identify PayPal Shopping users who visit your website. Think of it as a more advanced version of Log In with PayPal.
These are functions of the Commerce Identity SDK
This is the new one-touch identity resolver
paypal.sessionRecovery.IdentityInline(element, {onIdentified: (token) => {
/*
This token is an encrypted access_token and refresh_token combination.
*/
},
onEvent: (data) => {
/*
This is a callback that reports UI events that transpire on the Modal
*/
}
})
This is the new one-touch identity resolver
ppsh.ui.IdentityModal({style: {
algin: 'RIGHT' // RIGHT, LEFT,
animation: 'SLIDE' // SLIDE, APPEAR
},
captureEmail: true,
onIdentified: (token) => {
/*
This token is an encrypted access_token and refresh_token combination.
*/
},
onEvent: (data) => {
/*
This is a callback that reports UI events that transpire on the Modal
*/
}
})
Contextual Messaging lets you message PayPal Shopping users who visit your website. These messages act as reminders to avail offers and services from PayPal.
These are functions of the Commerce Identity SDK
ppsh.ui.MessageInline({onEvent: (data) => {
/*
This is a callback that reports UI events that transpire on the Modal
*/
}
})
ppsh.ui.MessageModal({
style: {
algin: 'RIGHT' // RIGHT, LEFT,
animation: 'SLIDE' // SLIDE, APPEAR
},
onEvent: (data) => {
/*
This is a callback that reports UI events that transpire on the Modal
*/
}
})