Shopify

This page describes how to install and configure Zapper as a payment provider for the Shopify eCommerce platform.

Overview

Shopify

Shopify, a dynamic and user-friendly eCommerce platform, empowers businesses with its streamlined approach to online retail. Leveraging a range of built-in functionalities and customizable themes, Shopify eliminates the complexities of setting up an online store. With an array of apps and integrations available in the Shopify App Store, you can effortlessly enhance your store's capabilities, tailoring it to your unique business needs. This all-inclusive approach ensures that Shopify equips you with the fundamental features anticipated from an eCommerce platform right from the start, simplifying your journey to online success.

Zapper Payments Plugin

The Zapper payment provider for Shopify offers a seamless payment experience, catering to a wider range of customer preferences. With our enhanced system, customers now have the option to make payments using their credit or debit cards, in addition to our existing dynamic QR code solution. This means that during checkout, customers can either choose to scan the dynamic QR code using the Zapper app or directly enter their card details to complete their order payment. This versatility ensures a convenient and efficient payment process for all customers, making their shopping experience even more enjoyable. Learn more about the payments flow here.

This guide is composed of the following sections:

  1. Pre-requisites - The pre-requisites required before the Zapper payment method can be used in production.

  2. Installation - Installation and configuration of the Zapper payment method.

  3. Checkout and Payments - The customer experience when making use of the Zapper payment method.

Pre-requisites

  1. The merchant must be registered as a Zapper Merchant to use the Zapper plugin in production.

  2. The merchant must be able to log in to the Zapper Merchant Portal.

Zapper charges the standard transaction processing fee plus an additional + 0.5% Shopify fee.

Installation

To install the Zapper payment method on your Shopify Store, complete the following steps:

  • Login to your Shopify Store

  • Follow the Shopify prompts to install the Zapper application:

  • The merchant will be redirected to Zapper's Merchant Portal and prompted to sign into a merchant account:

  • Select a Zapper site from the dropdown and click "Link site":

  • The merchant will be redirected to the Shopify store to activate the Zapper payment method.

Before activating, take note of the "Test mode" flag and ensure it is unchecked if the merchant intends to process live payments.

Checkout and Payments

This section describes the user experience when checking out and making a payment using the Zapper payment method.

Checkout

Checkout page may differ slightly based on the Shopify theme.

On Checkout the user will be provided with Zapper as a payment provider option. The following image is a snippet of the payment options on the Shopify checkout page:

Payments

The payment process is as follows:

  1. When the user selects the Zapper payment option on checkout and proceeds to finalize their order, they will be presented with Zapper Hosted Payment page.

  2. If the user prefers the familiar convenience of our dynamic QR code solution, they can proceed by using the Zapper mobile app to effortlessly scan the on-screen QR Code. For users accessing the store from a mobile device, the QR Code is seamlessly replaced with a deep-link button, ensuring a smooth transition to the Zapper application.

  3. However, if the user prefers to use their credit or debit card for payment, they can now opt for the new card payment option. This straightforward method allows users to directly input their card details and complete the payment process right on the spot.

  4. Once the payment is successfully processed – whether through QR code scanning or card payment – users will receive a confirmation in the form of a checkmark symbol. With this assurance of payment, they will then be seamlessly redirected back to the store's default payment confirmation page.

By introducing this new card payment option alongside our existing QR code solution, we're committed to delivering a more inclusive and user-friendly payment experience that caters to a diverse range of customer preferences.

The order on the merchants store will automatically be updated with payment complete.

Last updated