## Overview

Affirm enables your customers to go through the Affirm loan application flow using our **Modal** or **Redirect** checkout.

### Modal

Users go through the Affirm flow in a modal while remaining on your site. Modal checkout also enables client-side callbacks so that you can receive confirmation checkout from `affirm.js` instead of HTTP.

### Redirect

Users are redirected to Affirm's site, where they authenticate and go through the checkout flow. Once they complete checkout, they're returned to the merchant site.

## Modal Checkout

1. Add a metadata flag to your checkout object.

2. Define callback functions (optional).

**Add a metadata flag to your checkout object**

Enable modal checkout by adding a new parameter to the checkout object metadata.

**mode**

_optional_ enum. Set to `modal` to enable the modal checkout flow (default uses redirect checkout flow).

**Define callback functions (optional)**

The `affirm.checkout.open()` function accepts an argument object where you can [define success and failure callback functions](🔗).

**onFail**

_optional_ function. Called when the customer exits, cancels, or is declined in the Affirm checkout flow.

**onSuccess**

_optional_ function. Called when the customer confirms their Affirm loan. Receives success_object, which contains the checkout_token.

**onOpen**

_optional_ function. Called when the customer successfully loads the Affirm checkout flow.

**onValidationError**

_optional_ function. Called when there was a validation error with the checkout request submitted.

## Test modal checkout

After implementing modal checkout, call `affirm.checkout.open()`. The modal checkout flow appears in a lightbox modal above your page contents. Use the the following code to test your modal checkout.

## Example code

**Example checkout object**

## Appendix

## Third-party cookies

Modal checkout requires that third-party cookies are allowed and enabled within a browser's privacy and security settings. If third-party cookies are blocked, and the Affirm.com cookie is not already present on the customer's device, then the Affirm checkout flow will display in a new pop-up window instead of in a modal window. If you (or your customer) experience any issues, please check the browser settings/

## Chrome

Go to **Preferences > Advanced > Content Settings > Cookies**.

## Safari

1\. Go to **Safari > Settings for This Website...** .

2\. Uncheck **Enable content blockers**.