# Display BNPL Messaging

Automatically explain buy now, pay later payment options.

# iOS (UIKit)


To display promotional messaging for buy now, pay later payment options, use the [Payment Method Messaging Element](https://docs.stripe.com/payments/mobile/payment-method-messaging-element.md).

## Set up Stripe [Server-side] [Client-side]

First, you need a Stripe account. [Register now](https://dashboard.stripe.com/register).

The [Stripe iOS SDK](https://github.com/stripe/stripe-ios) is open source, [fully documented](https://stripe.dev/stripe-ios/index.html), and compatible with apps supporting iOS 13 or above.

#### Swift Package Manager

To install the SDK, follow these steps:

1. In Xcode, select **File** > **Add Package Dependencies…** and enter `https://github.com/stripe/stripe-ios-spm` as the repository URL.
2. Select the latest version number from our [releases page](https://github.com/stripe/stripe-ios/releases).
3. Add the **StripePaymentSheet** product to the [target of your app](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app).

#### CocoaPods

1. If you haven’t already, install the latest version of [CocoaPods](https://guides.cocoapods.org/using/getting-started.html).
2. If you don’t have an existing [Podfile](https://guides.cocoapods.org/syntax/podfile.html), run the following command to create one:
   ```bash
   pod init
   ```
3. Add this line to your `Podfile`:
   ```podfile
   pod 'StripePaymentSheet'
   ```
4. Run the following command:
   ```bash
   pod install
   ```
5. Don’t forget to use the `.xcworkspace` file to open your project in Xcode, instead of the `.xcodeproj` file, from here on out.
6. In the future, to update to the latest version of the SDK, run:
   ```bash
   pod update StripePaymentSheet
   ```

#### Carthage

1. If you haven’t already, install the latest version of [Carthage](https://github.com/Carthage/Carthage#installing-carthage).
2. Add this line to your `Cartfile`:
   ```cartfile
   github "stripe/stripe-ios"
   ```
3. Follow the [Carthage installation instructions](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos). Make sure to embed all of the required frameworks listed [here](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking).
4. In the future, to update to the latest version of the SDK, run the following command:
   ```bash
   carthage update stripe-ios --platform ios
   ```

#### Manual Framework

1. Head to our [GitHub releases page](https://github.com/stripe/stripe-ios/releases/latest) and download and unzip **Stripe.xcframework.zip**.
2. Drag **StripePaymentSheet.xcframework** to the **Embedded Binaries** section of the **General** settings in your Xcode project. Make sure to select **Copy items if needed**.
3. Repeat step 2 for all required frameworks listed [here](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking).
4. In the future, to update to the latest version of our SDK, repeat steps 1–3.

> For details on the latest SDK release and past versions, see the [Releases](https://github.com/stripe/stripe-ios/releases) page on GitHub. To receive notifications when a new release is published, [watch releases](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository) for the repository.

Configure the SDK with your Stripe [publishable key](https://dashboard.stripe.com/test/apikeys) on app start. This enables your app to make requests to the Stripe API.

#### Swift

```swift
import UIKitimportStripePaymentSheet

@main
class AppDelegate: UIResponder, UIApplicationDelegate {

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {StripeAPI.defaultPublishableKey = "<<YOUR_PUBLISHABLE_KEY>>"
        // do any other necessary launch configuration
        return true
    }
}
```

> Use your [test keys](https://docs.stripe.com/keys.md#obtain-api-keys) while you test and develop, and your [live mode](https://docs.stripe.com/keys.md#test-live-modes) keys when you publish your app.

## Initialize the Payment Method Messaging Element

Call `create` to instantiate the Payment Method Messaging Element with a `PaymentMethodMessagingElement.Configuration`. The Configuration object contains details about the potential purchase and how information about it should be displayed. After PaymentMethodMessagingElement has successfully initialized, put its view into your UI.

#### Swift

```swift
@_spi(PaymentMethodMessagingElementPreview) import StripePaymentSheet

class MyViewController: UIViewController {

    private var amount = 1000 // $10.00
    private var currency = "USD"

    private var paymentMethodMessagingElementView: UIView?

    func addPaymentMethodMessagingElement() {
        Task { @MainActor in
            // Create configuration object
            let configuration = PaymentMethodMessagingElement.Configuration(
                amount: amount,
                currency: currency,
            )

            // Create PaymentMethodMessagingElement
            switch await PaymentMethodMessagingElement.create(configuration: configuration) {
            case .success(let element):
                let elementView = element.view
                self.view.addSubview(elementView)
                self.paymentMethodMessagingElementView = elementView
                // Set up constraints for elementView
                NSLayoutConstraint.activate([(
                    // ..
                )])
            case .noContent:
                // No element is available to display with this configuration
                // You may want to adapt your UI accordingly
                // ...
            case .failed(let error):
                // An unrecoverable error has occurred while attempting to load the element
                // You may want to log the error or take other action
                // ...
            }
        }
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        // Set up the remainder of your page
        // ...

        addPaymentMethodMessagingElement()
    }
}
```

## Optional: Update the element

If the customer performs an action that changes the configuration (for example, selecting a different product variant), initialize a new `PaymentMethodMessagingElement` instance to reflect the new information.

#### Swift

```swift
class MyViewController: UIViewController {

    // ...

    func updatePaymentMethodMessagingElement() {
        paymentMethodMessagingElementView?.removeFromSuperview()
        addPaymentMethodMessagingElement()
    }
}

```

## Optional: Customize the element

Customization options are available through the `PaymentMethodMessagingElement.Configuration` and `PaymentMethodMessagingElement.Appearance` objects.

#### Swift

```swift
// Configure appearance
let appearance = PaymentMethodMessagingElement.Appearance(
    style: .flat,
    font: .boldSystemFont(ofSize: 12),
    textColor: .black,
    infoIconColor: .blue
)

// Create configuration object
let configuration = PaymentMethodMessagingElement.Configuration(
    amount: 1000, // $10.00
    currency: "USD",
    locale: "en_GB", // Defaults to device locale but can be explicitly set
    countryCode: "US", // Defaults to customer IP address but can be explicitly set
    paymentMethodTypes: [.affirm, .klarna], // Defaults to dynamic payment methods from the Dashboard, but can be explicitly set
    appearance: appearance
)

```