@paydock/client-sdk
Version:
Paydock client sdk
61 lines (53 loc) • 2.02 kB
Markdown
## AfterpayOnSiteMessaging
Afterpay On-Site Messaging informs customers that Afterpay had an available payment method on the website. Allows to have this features when implemented:
- An interactive icon ⓘ that shows a modal with some available information.
- Shows if an instalment is available and its amount.
- Displays the best payment option available on that particular product.
The general flow to use it is:
1. Initialize the Afterpay On Site Messaging class, providing a HTML selector id, and configuration parameters that requires AfterPay. The general format is:
```js
var afterpayOnSiteMessaging = new paydock.AfterpayOnSiteMessaging(
"#selector",
configParams,
);
```
2. Once all in place, just call load function to start the injection, like following:
```js
afterpayOnSiteMessaging.load();
```
### AfterpayOnSiteMessaging example
A full description of the config parameters for [AfterpayOnSiteMessaging](#AfterpayOnSiteMessaging) meta parameters can be found [here](#IAfterpayOnSiteMessagingConfig). Below you will find a fully working html example.
```html
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>Using PayDock AfterpayOnSiteMessaging!</h2>
<div id="afterpayOnSiteMessagingDiv"></div>
</body>
<script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
<script>
const afterpayOnSiteMessaging = new paydock.AfterpayOnSiteMessaging(
'#afterpayOnSiteMessagingDiv',
{
mpid: "uuid-uuid-uuid-uuid-uuid",
placement_id: "uuid-uuid-uuid-uuid-uuid",
page_type: "product",
amount: "100",
currency: "AUD",
consumer_locale: "AU",
item_skus: "Test",
item_categories: "Test",
is_eligible: true
}
);
afterpayOnSiteMessaging.onError(function(error) {
console.log("On Error Callback", error);
});
afterpayOnSiteMessaging.load();
</script>
</html>
```