---
title: Amazon Pay script
url: amazon-pay-checkout/v1-amazon-pay-script.html
---

* TOC
{:toc}
{::options toc_levels="3" /}

***

### Amazon Pay script

Add the Amazon Pay script to your HTML file to enable front-end functionality on your website. 

<ul id="profileTabs" class="nav nav-tabs">
  <li class="nav-item"><a class="active nav-link noExtIcon" href="#ustab" data-toggle="tab">US</a></li>
  <li class="nav-item"><a class="nav-link noExtIcon" href="#eutab" data-toggle="tab">EU / UK</a></li>
  <li class="nav-item"><a class="nav-link noExtIcon" href="#jptab" data-toggle="tab">JP</a></li>
</ul>
<div class="tab-content">
  <div role="tabpanel" class="tab-pane active" id="ustab">   
<div markdown="block">
```html
<script src="https://static-na.payments-amazon.com/checkout.js"></script>
```
</div>
  </div>
  <div role="tabpanel" class="tab-pane" id="eutab">
<div markdown="block">
```html
<script src="https://static-eu.payments-amazon.com/checkout.js"></script>
```
</div>
  </div>
  <div role="tabpanel" class="tab-pane" id="jptab">
<div markdown="block">
```html
<script src="https://static-fe.payments-amazon.com/checkout.js"></script>
```
</div>
  </div>
</div>

***

### Render the Amazon Pay button

Use amazon.Pay.renderButton() to render the Amazon Pay button to a HTML container element.

The Amazon Pay script will make an AJAX request using the configuration provided for the `createCheckoutSession` button parameter. The response must be in JSON format. 

#### Code sample

<ul id="profileTabs" class="nav nav-tabs">
  <li class="nav-item"><a class="active nav-link noExtIcon" href="#usButtonTab" data-toggle="tab">US</a></li>
  <li class="nav-item"><a class="nav-link noExtIcon" href="#euButtonTab" data-toggle="tab">EU</a></li>
  <li class="nav-item"><a class="nav-link noExtIcon" href="#ukButtonTab" data-toggle="tab">UK</a></li>
  <li class="nav-item"><a class="nav-link noExtIcon" href="#jpButtonTab" data-toggle="tab">JP</a></li>
</ul>
<div class="tab-content">


  <div role="tabpanel" class="tab-pane active" id="usButtonTab">   
<div markdown="block">
```html
<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-na.payments-amazon.com/checkout.js"></script>
    <script type="text/javascript" charset="utf-8">
        amazon.Pay.renderButton('#AmazonPayButton', {
            merchantId: 'merchant_id',
            createCheckoutSession: {
                url: 'https://mystore/amazonpay/createcheckoutsession'
            },
            sandbox: true, // dev environment
            ledgerCurrency: 'USD', // Amazon Pay account ledger currency
            checkoutLanguage: 'en_US', // render language
            productType: 'PayAndShip', // checkout type
            placement: 'Cart', // button placement
            buttonColor: 'Gold'
        });
    </script>
</body>
```
</div>
  </div>

  <div role="tabpanel" class="tab-pane" id="euButtonTab">
<div markdown="block">
```html
<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-eu.payments-amazon.com/checkout.js"></script>
    <script type="text/javascript" charset="utf-8">
        amazon.Pay.renderButton('#AmazonPayButton', {
            merchantId: 'merchant_id',
            createCheckoutSession: {
                url: 'https://mystore/amazonpay/createcheckoutsession'
            },
            sandbox: true, // dev environment
            ledgerCurrency: 'EUR', // Amazon Pay account ledger currency
            checkoutLanguage: 'en_GB', // render language
            productType: 'PayAndShip', // checkout type
            placement: 'Cart', // button placement
            buttonColor: 'Gold'
        });
    </script>
</body>
```
</div>
  </div>

<div role="tabpanel" class="tab-pane" id="ukButtonTab">
<div markdown="block">
```html
<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-eu.payments-amazon.com/checkout.js"></script>
    <script type="text/javascript" charset="utf-8">
        amazon.Pay.renderButton('#AmazonPayButton', {
            merchantId: 'merchant_id',
            createCheckoutSession: {
                url: 'https://mystore/amazonpay/createcheckoutsession'
            },
            sandbox: true, // dev environment
            ledgerCurrency: 'GBP', // Amazon Pay account ledger currency
            checkoutLanguage: 'en_GB', // render language
            productType: 'PayAndShip', // checkout type
            placement: 'Cart', // button placement
            buttonColor: 'Gold'
        });
    </script>
</body>
```
</div>
  </div>  

  <div role="tabpanel" class="tab-pane" id="jpButtonTab">
<div markdown="block">
```html
<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-fe.payments-amazon.com/checkout.js"></script>
    <script type="text/javascript" charset="utf-8">
        amazon.Pay.renderButton('#AmazonPayButton', {
            merchantId: 'merchant_id',
            createCheckoutSession: {
                url: 'https://mystore/amazonpay/createcheckoutsession'
            },
            sandbox: true, // dev environment
            ledgerCurrency: 'JPY', // Amazon Pay account ledger currency
            checkoutLanguage: 'ja_JP', // render language
            productType: 'PayAndShip', // checkout type
            placement: 'Cart', // button placement
            buttonColor: 'Gold'
        });
    </script>
</body>
```
</div>
  </div>
</div>

#### Parameters

<table width="100%" border="1">
    <tbody>
        <tr id='IXV9CA8wPdP'>
            <td id='s:IXV9CA8wPdP;IXV9CAYD3dl' style='vertical-align: top; font-weight: bold; width: 30%;' class='bold'><b>Parameter</b>
                <br /></td>
            <td id='s:IXV9CA8wPdP;IXV9CAsibgY' style='vertical-align: top; font-weight: bold; width: 70%;' class='bold'><b>Description</b>
                <br /></td>
        </tr>
        <tr id='IXV9CAG9zH5'>
            <td id='s:IXV9CAG9zH5;IXV9CAYD3dl' style='vertical-align: top;'>merchantId<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAG9zH5;IXV9CAsibgY' style='text-align: left;vertical-align: top;'>Amazon Pay merchant account identifier
                <br /></td>
        </tr>
        <tr id='SPI9CAw52Yq'>
            <td id='s:SPI9CAw52Yq;SPI9CAwqfh9' style='vertical-align: top;'>createCheckoutSession<br>(<b>required</b>)<br><br>Type: <a href="../amazon-pay-checkout/v1-amazon-pay-script.md#type-createcheckoutsession">createCheckoutSession</a>
                <br /></td>
            <td id='s:SPI9CAw52Yq;SPI9CAy6rIp' style='text-align: left;vertical-align: top;'>Configuration for calling your endpoint to <a href="../amazon-pay-api-v2/v1-checkout-session.md">Create Checkout Session</a>. The response must be in JSON format
                <br /></td>
        </tr>
        <tr id='IXV9CAuxZkz'>
            <td id='s:IXV9CAuxZkz;IXV9CAYD3dl' style='text-align: left;vertical-align: top;'>placement<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAuxZkz;IXV9CAsibgY' style='text-align: left;vertical-align: top;'>Placement of the Amazon Pay button on your website<br><br>Supported values: ‘Home’, ‘Product’, ‘Cart’, ‘Checkout’, and 'Other'
                <br /></td>
        </tr>
        <tr id='IXV9CAD2lCG'>
            <td id='s:IXV9CAD2lCG;IXV9CAYD3dl' style='text-align: left;vertical-align: top;'>ledgerCurrency<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAD2lCG;IXV9CAsibgY' style='text-align: left;vertical-align: top;'>Ledger currency provided during registration for the given merchant identifier<br><br>Supported values: 
            <ul>
                <li>US merchants - 'USD'</li>
                <li>EU merchants - 'EUR'</li>
                <li>UK merchants - 'GBP'</li>
                <li>JP merchants - 'JPY'</li>
              </ul>
            </td>
        </tr>
        <tr id='IXV9CARMeio'>
            <td id='s:IXV9CARMeio;IXV9CAYD3dl' style='vertical-align: top;'>productType<br><br>Type: string
                <br /></td>
            <td id='s:SPI9CAcT2N8;SPI9CAy6rIp' style='text-align: left;vertical-align: top;'>Product type selected for checkout<br><br>Supported values:<br>
                    <ul>
                      <li>'PayAndShip' - Offer checkout using buyer's Amazon wallet and  address book. Select this product type if you need the buyer's shipping details</li>
                      <li>'PayOnly' - Offer checkout using only the buyer's Amazon wallet. Select this product type if you do not need the buyer's shipping details</li>
                    </ul>
              Default value: 'PayAndShip'
                <br /></td>
        </tr>
        <tr id=''>
            <td id='' style='vertical-align: top;'>buttonColor<br><br>Type: string
                <br /></td>
            <td id='' style='text-align: left;vertical-align: top;'>Color of the Amazon Pay button<br><br>Supported values: 'Gold', 'LightGray', 'DarkGray'<br>
              Default value: 'Gold'
                <br /></td>
        </tr>
        <tr id='SPI9CAUKjWp'>
            <td id='s:SPI9CAUKjWp;SPI9CAwqfh9' style='vertical-align: top;'>checkoutLanguage<br><br>Type: string
                <br /></td>
            <td id='s:SPI9CAUKjWp;SPI9CAy6rIp' style='text-align: left;vertical-align: top;'>Language used to render the button and text on Amazon Pay hosted pages. Please note that supported language(s) is dependent on the region that your Amazon Pay account was registered for<br><br>Supported values: 
              <ul>
                <li>US merchants - 'en_US'</li>
                <li>EU/UK merchants - 'en_GB', 'de_DE', 'fr_FR', 'it_IT', 'es_ES'</li>
                <li>JP merchants - 'ja_JP'</li>
              </ul>
            </td>
        </tr>
        <tr id='IXV9CAGCmFe'>
            <td id='s:IXV9CAGCmFe;IXV9CAYD3dl' style='vertical-align: top;'>sandbox<br><br>Type: boolean
                <br /></td>
            <td id='s:IXV9CAGCmFe;IXV9CAsibgY' style='text-align: left;vertical-align: top;'>Sets button to Sandbox environment<br><br>Default value: false
                <br /></td>
        </tr>
    </tbody>
</table>

#### Type: createCheckoutSession

<table width="100%" border="1">
    <tbody>
        <tr id='IXV9CANwXji'>
            <td id='s:IXV9CANwXji;IXV9CA9vlVH' style='vertical-align: top;' class='bold'>Parameter
                <br /></td>
            <td id='s:IXV9CANwXji;IXV9CAxsfso' style='vertical-align: top;' class='bold'>Description
                <br /></td>
        </tr>
        <tr id='IXV9CAwIzcN'>
            <td id='s:IXV9CAwIzcN;IXV9CA9vlVH' style='vertical-align: top;'>url<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAwIzcN;IXV9CAxsfso' style='text-align: left;vertical-align: top;'>Your endpoint URL to <a href="../amazon-pay-api-v2/v1-checkout-session.md">Create Checkout Session</a>
                <br /></td>
        </tr>
        <tr id='IXV9CADhyet'>
            <td id='s:IXV9CADhyet;IXV9CA9vlVH' style='vertical-align: top;'>method<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CADhyet;IXV9CAxsfso' style='text-align: left;vertical-align: top;'>HTTP request method<br><br>Supported values: 'GET', 'POST'<br>Default value: 'POST'
                <br /></td>
        </tr>
        <tr id='IXV9CAxUvN5'>
            <td id='s:IXV9CAxUvN5;IXV9CA9vlVH' style='text-align: left;vertical-align: top;'>extractAmazonCheckoutSessionId<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAxUvN5;IXV9CAxsfso' style='text-align: left;vertical-align: top;'>Checkout Session ID parameter in the response<br><br>Default value: 'checkoutSessionId'
                <br /></td>
        </tr>
    </tbody>
</table>

***

### Enable checkout info updates

Use amazon.Pay.bindChangeAction() to enable updates in case the buyer wants to select a different shipping address or payment method.

#### Code sample

```html
<script type="text/javascript" charset="utf-8">
    amazon.Pay.bindChangeAction('#changeButton1', {
      amazonCheckoutSessionId: 'xxxx',
      changeAction: 'changeAddress'
    });
</script>
```

#### Parameters

<table width="100%" border="1">
    <tbody>
        <tr id='IXV9CA1supv'>
            <td id='s:IXV9CA1supv;IXV9CA5ow66' style='vertical-align: top; font-weight: bold; width: 30%;' class='bold'>Parameter
                <br /></td>
            <td id='s:IXV9CA1supv;IXV9CAnhWct' style='vertical-align: top; font-weight: bold; width: 70%;' class='bold'>Description
                <br /></td>
        </tr>
        <tr id='IXV9CAvxdY3'>
            <td id='s:IXV9CAvxdY3;IXV9CA5ow66' style='vertical-align: top;'>amazonCheckoutSessionId<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CAvxdY3;IXV9CAnhWct' style='vertical-align: top;'>Amazon Pay Checkout Session identifier
                <br /></td>
        </tr>
        <tr id='IXV9CA5FJrL'>
            <td id='s:IXV9CA5FJrL;IXV9CA5ow66' style='text-align: left;vertical-align: middle;'>changeAction<br>(<b>required</b>)<br><br>Type: string
                <br /></td>
            <td id='s:IXV9CA5FJrL;IXV9CAnhWct' style='vertical-align: top;'>Update requested by the buyer<br><br>Supported values: 'changeAddress', 'changePayment'
                <br /></td>
        </tr>
    </tbody>
</table>

***

### Sign out from Amazon

Use amazon.Pay.signout() to give buyers the option of signing out from their Amazon account. 

**Best practice:** Give buyers the option of signing out after they complete checkout. Bind the function to a “Sign out from Amazon” link on your order confirmation page. 

#### Code sample

```
<script type="text/javascript">
  document.getElementById('Signout').onclick = function() {
    amazon.Pay.signout();
  };
</script>
```


