Apple Pay Integration

• Overview
• Prerequisites and Apple Pay Visibility Requirements
• Setup Apple Pay with PayPal Payments
• Setup Apple Pay with Braintree
• Troubleshooting Apple Pay Visibility
• Summary

Overview

Apple Pay allows customers to make secure purchases using a credit or debit card associated with a supported Apple device. Apple Pay is available during checkout as an Express Payment Method, giving qualifying customers a one-click option to complete checkout through an enabled payment integration. 

Apple Pay does not display on the shopping cart page. Customers must proceed to the checkout page and use an Apple Pay-compatible device and browser for the Apple Pay option to appear. 

Note: To use Apple Pay in your store, you need to have a PayPal Payments account or Braintree account with Apple Pay enabled.

Prerequisites and Apple Pay Visibility Requirements

Before configuring or troubleshooting Apple Pay, verify the following requirements.

• Your store must have a supported payment integration, such as PayPal Payments or Braintree, with Apple Pay enabled.
• Show Express Payment Methods must be enabled in the One Page Checkout theme settings.
• The customer must be using an Apple Pay-compatible Apple device and supported browser.
• The customer must have Apple Pay configured and be eligible to use it with the enabled payment integration.
• Apple Pay appears in the Express Payment Methods area of the checkout page. It does not appear on the shopping cart page.
• The active checkout theme must contain the required Express Payment Methods HTML and Apple Pay merge code.

Enable Express Payment Methods

1. Go to Themes > Edit > Pages > Checkout and Order > One Page Checkout > Basic Settings.
2. Locate and enable Show Express Payment Methods.
3. Save your theme changes.

Note: Express Payment Methods provide customers with one-click checkout options through enabled and qualifying payment integrations.

Verify the Express Payment Area HTML

To confirm you have the code in place, go to Themes > Edit > Pages > Checkout and Order > One Page Checkout > HTML Editor. 

The One Page Checkout theme should contain an Express Payment area with the $$APPLEPAYBUTTON$$ merge code. This code is usually placed directly above:

<ac:visibilityarea id="ExistingCustomersArea">

An example Express Payment area is shown below:

<!-- Express ChecktotalArea -->
<ac:visibilityarea id="ExpressPayArea">
  $$EXPRESSPAYAREABEGIN$$
  <div class="checkout-express mb-3">
    <div class="checkout-express-header h3 fw-bold mb-2">Express Checkout</div>
    <div class="checkout-express-body row row-cols-auto mobile-scroll m-0">
      $$PAYWITHAMAZONBUTTON$$ $$APPLEPAYBUTTON$$ $$PAYPALSMARTBUTTONS$$
    </div>
    <div class="checkout-express-footer small text-muted pt-2">
      Or continue to pay with a credit card below
    </div>
  </div>
  $$EXPRESSPAYAREAEND$$
</ac:visibilityarea>
<!-- END Express Checkout -->

Important: The $$APPLEPAYBUTTON$$ merge code must be present in the Express Payment area for Apple Pay to render when the customer and payment integration qualify.

 

Setup Apple Pay with PayPal Payments

1. Go to Settings > Payments > Payment Methods > Apple Pay.
2. Click PayPal Login or Signup.
3. Follow the prompts to log in to or sign up for PayPal and authorize your account for Apple Pay.

1. Log in to your PayPal account.
2. Click your profile in the top-right corner, and then click Account Settings.

1. Go to Account Settings > Payment Methods.

1. Click Manage Apple Pay.
2. Register your store's domain with Apple Pay.

Note: You do not need to manually download the domain association file in the PayPal setup process. The system automatically downloads the required file when Apple Pay is enabled.

Apple Pay is now configured through PayPal Payments. Review the Prerequisites and Apple Pay Visibility Requirements section to make sure Apple Pay can display during checkout.

Setup Apple Pay with Braintree

iCloud Account Setup

• You need an Apple Developer account to complete the Apple Pay certificate setup.

Add an Apple Pay Certificate Through the Braintree Control Panel

To enable Apple Pay in your Braintree account:

1. Log in to your production Braintree Control Panel.
2. Click the gear icon in the top-right corner.
3. Click Processing from the menu.
4. Scroll to the Payment Methods section.
5. Enable Apple Pay, and then click Options.
6. Scroll to Apple Merchant Certificates (iOS).
7. Click +Add.
8. Follow the prompts to create and upload your certificate.

Register Any Domains You Plan to Use

1. Scroll to the Web Domains (Safari) section.
2. Click +Add.
3. Enter your fully qualified production domain name.
4. Click Agree & Add Domain.

Note: The domain you enter must exactly match your fully qualified domain name, including www. when applicable.

Certificate Renewal

Note: Apple Pay certificates expire after 25 months and must be kept up to date to avoid disruptions in payment processing. Follow the certificate setup instructions above to generate and upload a new certificate when renewal is required.

Enable Apple Pay for Your Store

1. In the Braintree Control Panel, click the gear icon in the top-right corner.
2. Click API.
3. Generate the required API keys.
4. In your store admin, go to Settings > Payments > Payment Methods > Apple Pay.
5. Copy and paste the Braintree API credentials and Merchant ID into the Apple Pay setup.
6. Enable the integration.

After enabling the integration, review the Prerequisites and Apple Pay Visibility Requirements section to confirm that Express Payment Methods are enabled for the checkout page.

Troubleshooting Apple Pay Visibility

If Apple Pay is enabled but the Apple Pay button does not appear, check each of the following items.

1. Confirm Express Payment Methods are enabled.
   Go to Themes > Edit > Pages > Checkout and Order > One Page Checkout > Basic Settings and verify that Show Express Payment Methods is enabled.
2. Verify the checkout theme contains the Express Payment Methods HTML.
   Customized or older themes may be missing the HTML or merge code required to render the Apple Pay button. Go to Themes > Edit > Pages > Checkout and Order > One Page Checkout > HTML Editor
3. Check the checkout page instead of the shopping cart.
   Apple Pay does not appear on the shopping cart page. Proceed to the One Page Checkout to look for Apple Pay in the Express Payment Methods area.
4. Use a supported Apple Pay device and browser.
   Apple Pay only appears when the customer is using a compatible Apple device and supported browser and otherwise qualifies to use Apple Pay.

5. Confirm the Apple Pay payment integration is enabled.
   Verify that Apple Pay is enabled through your configured PayPal Payments or Braintree integration and that any required domain registration or certificates are valid.

    

Verify the Express Payment Area HTML

The One Page Checkout theme should contain an Express Payment area with the $$APPLEPAYBUTTON$$ merge code. This code is usually placed directly above:

<ac:visibilityarea id="ExistingCustomersArea">

An example Express Payment area is shown below:

<!-- Express ChecktotalArea -->
<ac:visibilityarea id="ExpressPayArea">
  $$EXPRESSPAYAREABEGIN$$
  <div class="checkout-express mb-3">
    <div class="checkout-express-header h3 fw-bold mb-2">Express Checkout</div>
    <div class="checkout-express-body row row-cols-auto mobile-scroll m-0">
      $$PAYWITHAMAZONBUTTON$$ $$APPLEPAYBUTTON$$ $$PAYPALSMARTBUTTONS$$
    </div>
    <div class="checkout-express-footer small text-muted pt-2">
      Or continue to pay with a credit card below
    </div>
  </div>
  $$EXPRESSPAYAREAEND$$
</ac:visibilityarea>
<!-- END Express Checkout -->

Important: The $$APPLEPAYBUTTON$$ merge code must be present in the Express Payment area for Apple Pay to render when the customer and payment integration qualify.

Summary

Apple Pay is displayed as an Express Payment Method on the One Page Checkout and does not appear on the shopping cart page. For Apple Pay to display, the payment integration must be enabled, Show Express Payment Methods must be turned on, the checkout theme must contain the required Express Payment area and $$APPLEPAYBUTTON$$ merge code, and the customer must be using a supported Apple Pay device and browser.