Tutorial: Add Apple Pay support to older versions of Pipeline

With the launch of Apple Pay, iOS users in the Safari browser will be able to checkout in seconds without the need to manually enter credit card information. Most e-commerce web traffic is customers browsing on their phones, but mobile checkout is still less common than it should be. Apple has designed Apply Pay to make it easier for customers to complete the checkout process from a mobile phone. In this tutorial we will cover the process of adding Apple Pay support to versions 1.6 and below.

Versions 1.7 and above already support Apple Pay

If you downloaded Pipeline after September 13th 2016 your theme already supports Apple Pay.

Shopify provides generalized instructions for this code update here -- the instructions below accomplish the same task with code examples and screenshots specific to Pipeline.

templates/cart.liquid

Open the theme HTML/CSS code editor and navigate the to file  template/cart.liquid. Paste the following code where it is shown in the screenshot:

{% if additional_checkout_buttons %}
  <div class="grid__item additional-checkout-buttons">
    {{ content_for_additional_checkout_buttons }}
  </div>
{% endif %}<br>

assets/ajaxify.js.liquid

Open the theme HTML/CSS code editor and navigate the to file  assets/ajaxify.js.liquid. Paste the following code where it is shown in the screenshot -- 

if (window.Shopify && Shopify.StorefrontExpressButtons) {
      Shopify.StorefrontExpressButtons.initialize();
    }

Still need help? Contact Us Contact Us