> This page is for version v2 (default).
> For other versions, use one of these documentation indexes:
> - v2 (default): https://developers-beta.clearpay.co.uk/v-2/llms.txt
> - v1: https://developers-beta.clearpay.co.uk/v-1/llms.txt

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers-beta.clearpay.co.uk/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers-beta.clearpay.co.uk/_mcp/server.

# Deferred Shipping

In the Deferred Shipping flow, the customer returns to the merchant's checkout to\
finalise their delivery options, and complete their order.

Follow the steps below to set up the button for Deferred Shipping which includes:

* Create an order token for redirect
* The use of the initializeForRedirect method
* Redirecting the customer to finalise the order

## Create an Clearpay order token

To create the order token for a redirect flow:

1. See the normal information in the [Create Order (V1)](/v-1/api-reference/online-api/orders/create-order) or [Create Checkout (V2)](/api-reference/online-api/checkouts/create-checkout) pages, depending on which version of the API you use. The only difference is that you must include `mode` to be set as `express`.

```curl
--request POST \
  --url https://api-sandbox.afterpay.com/v2/checkouts \
  --header 'accept: application/json' \
  --header 'content-type: application/json' \
  --data '{"amount":{"amount":"10.00", “currency”: “AUD”}, “mode”: “express”, "merchant":{"redirectConfirmUrl":"https://example.com/checkout/confirm", "redirectCancelUrl":"https://example.com/checkout/cancel"}}'
```

## Redirect Checkout with afterpay.js

With a popup, you need to:

1. Create the [Clearpay Express Checkout Button](/ec-setup)
2. Add an [Express Checkout Entry Point](/ec-setup).
3. Load afterpay.js script on your site. See below.

### Load afterpay.js

To launch the Clearpay Express Checkout process you must include the afterpay.js script on your site.

You must also set the `onload` attribute to point to your own function (e.g. initClearpay) where you will initialise the popup.

For example, loading the sandbox afterpay.js script:

```javascript
<script src="https://portal.sandbox.afterpay.com/afterpay.js" async onload="initClearpay()">
    </script>
```

Do the following:

1. Inside your own onload function (i.e. initClearpay), use Afterpay.js to initialise the
   * popup window by invoking `initializeForPopup` (Integrated Shipping)
   * The redirect flow by invoking `initializeForRedirect` (Deferred Shipping)

Then set the following properties:

1. Set `countryCode` to the two-character ISO 3166-1 country code of the merchant account.
2. Set the `addressMode` to one of the provided address mode constants. For Deferred Shipping, select an option that does not contain shipping options.
3. Set `target` to the ID (or class) assigned to your button that triggers the checkout process.
4. Handle lifecycle events:`onCommenceCheckout`: This is where the retrieval of the Clearpay token from your server occurs. Once the token is retrieved, call `actions.resolve(TOKEN)` to start the checkout process

```html
<html>
  <head>
    <script>
      // ensure this function is defined before loading afterpay.js
      function initAfterpay () {
        AfterPay.initializeForRedirect({
          countryCode: 'AU',
          onCommenceCheckout: function(actions) {
            /* retrieve afterpay token from your server */
            /* then call `actions.resolve(token)` */
          },
          target: '#afterpay-express-button',
          addressMode: AfterPay.ADDRESS_MODES.ADDRESS_WITHOUT_SHIPPING_OPTIONS,
        })
      }
    </script>
   <script src="https://portal.sandbox.afterpay.com/afterpay.js" async onload="initAfterpay()">
   </script>
  </head>
  <body>
    <button id="afterpay-express-button" 
    data-afterpay-entry-point="mini-cart"
    data-afterpay-checkout-button-label="Checkout using Clearpay Express">
      Checkout using Clearpay Express
    </button>
  </body>
</html>
```

## Finalising an order for Deferred Shipping

Previously when the Afterpay order token was created you would have defined the properties `redirectConfirmUrl` and `redirectCancelUrl` in the merchant.

When the customer completes the Clearpay Express checkout,  these properties are used to direct the customer back to the specified URL. This specified URL depends on the outcome of the checkout. So, if the customer completes the Clearpay checkout window, they are redirected to the `redirectConfirmUrl` after confirmation. But if the checkout is cancelled, the customer is redirected to the `redirectCancelUrl`.

Once the customer has successfully returned back to your site, You should:

1. Use the Clearpay order details to prefill your checkout.
2. Allow the customer to select a delivery method and make any other actions that you want the customer to do. For example, enter a promotion code.
3. Display the [Clearpay checkout widget](/ec-checkout-widget) on the final review page before the customer finalizes the order.

> **Important**
>
> The [Clearpay checkout widget](/ec-checkout-widget) is **mandatory** for Deferred Shipping.