Integrating without the AddressBook widget
In some scenarios, you might not want to collect the buyer's address from the AddressBook widget. You might not need to use the AddressBook widget to collect the buyer's address if you don't require a shipping address (for example, for the sale of a digital good) or if you want to collect the buyer's address on your own.
Note: If you don't use the Amazon AddressBook widget to collect an address from the buyer, the transaction isn't covered under the Amazon Payments Payment Protection Policy. For more information about the Amazon Payments Payment Protection Policy, see the Amazon Payments, Inc. Customer Agreement on the Amazon Pay website.
The Amazon Payments Payment Protection policy applies to the sale of physical goods only.
If you don't integrate with the AddressBook widget, you must create a Billing Agreement object. To do this, you have to specify the onReady callback function as one of the parameters in the widget call. The onReady function is called with a billingAgreement object when the widget renders. You can get the billingAgreementId by calling the getAmazonBillingAgreementId() function on the billingAgreement object.
You must store the amazonBillingAgreementId because you need it throughout your Amazon Pay and Login with Amazon integration.
The following example shows how to render the Wallet widget to support scenarios where you don't want to use the AddressBook widget:
<!--- put the style below inside your CSS file -->
<style type="text/css">
#walletWidgetDiv {width: 400px; height: 228px;}
</style>
<div id="walletWidgetDiv">
</div>
<script>
new OffAmazonPayments.Widgets.Wallet({
sellerId: 'YOUR_SELLER_ID_HERE',
onReady: function(billingAgreement) {
var billingAgreementId = billingAgreement.getAmazonBillingAgreementId();
},
agreementType: 'BillingAgreement',
design: {
designMode: 'responsive'
},
onPaymentSelect: function(billingAgreement) {
// Replace this code with the action that you want to perform
// after the payment method is selected.
},
onError: function(error) {
// your error handling code
}
}).bind("walletWidgetDiv");
</script>
Just as in Step 3. Add the AddressBook and Wallet widgets, you set the size of the widget via the CSS. The Walletwidget resizes to fit the provided space. You can use media query if you want to build a responsive site where you want the widgets to resize based on the size of the browser window.