Apple Pay Button Injection

You can use several different methods to inject the Apple Pay button into the storefront.

The Apple Pay button can be either:

A new tag ( <isapplepay> ) is added to ISML to inject an Apple Pay control in the HTML page supports optional attributes to:

The <isapplepay> tag must have a closing tag.

If there are already items in the shopper's basket and they click the Apple Pay button for an individual product, the items currently in the basket are stored temporarily during the purchase of the individual item; the original items are then restored to the basket.

There are two places where a button can be injected via configuration:

Each is represented by a CSS selector plus additional information about how to inject. The CSS selectors are based on SiteGenesis DOM and CSS class names, but can work on sites other than SiteGenesis.

If a site is configured to inject, one of these selectors finds a match, and the __SYSTEM__ApplePay-GetRequest pipeline responds with a valid JSON for an ApplePaySession payment request, the button is injected. These buttons check out the current basket (as opposed to buttons to buy a single specific product) so the basket must not be empty to inject the button.

For Cart, the Apple Pay button is injected after “button[name=dwfrm_cart_checkoutCart]” and its margin and width are copied for Apple Pay UI guidelines reasons. The CSS classes “dw-apple-pay-button” and “dw-apple-pay-cart” are put on the injected button, and (if necessary) a CSS class corresponding to the configured button style.

For MiniCart Commerce Cloud appends to “.mini-cart-totals”. Margin, width, or any other attributes are not copied. Commerce Cloud puts “dw-apple-pay-button” and “dw-apple-pay-mini-cart” plus configured style CSS classes. Not all sites support automatic injection, and sites that do support automatic injection might find they don’t like the way the button is automatically injected. In that case, a customer developer should choose where to inject by using <isapplepay></isapplepay> in their templates.

The process of injecting the Apple Pay button is as follows:

X Privacy Update: We use cookies to make interactions with our websites and services easy and meaningful, to better understand how they are used. By continuing to use this site you are giving us your consent to do this. Privacy Policy.