Google Pay Setup & Customer Checkout flow

4.EN_Support_EC_SC.png

To provide a better customer experience, merchants can now set up Google Pay via Stripe as a payment option.

This article will cover:

 

Setting up Google Pay 

Remarks: You will need a Stripe account to activate the Google Pay payment option. Stripe is now currently only available to merchants located in Hong Kong and supported currencies are HKD and USD.

Transaction fee: 3.4% + HK$2.35 per successful card charge

The price is the same for all major cards. There’s no additional fee for international cards, failed charges, or refunds. For more details, please visit: https://stripe.com/hk/pricing

 

Step 1. Payment Options

Go to your SHOPLINE Admin Panel > [Settings] > [Payment Options]. Click the Add button to create a payment option.

1.png

 

Step 2. Setting up your account

Select your "Payment Type" as Google Pay via Stripe. Click Activate to start setting up your account

2.png


Step 3. Sign in

You will be directed to a page as shown below.

If you already have a Stripe account, click "Sign in" at the top right corner to login into your account;
For new users, please enter your information below, then click Authorize access to this account.

FireShot_Capture_1_-_Stripe__Connect_with_shopline_tes__-_https___connect.stripe.com_oauth_authorize.png

 

Step 4. Options

You will be redirected back to the SHOPLINE Admin panel after authorization.

Here you will see the system has updated the payment method with Stripe's secret key & Publishable key. You can now set up your payment processing fee, edit the name of your payment method for Google Pay and check if you need to exclude any delivery options.

After you've done the setup, click Update to add Google Pay.

googlepay_eng.jpg

 

Step 5. Publish

Although Google Pay has been added, it is currently not visible in your store.

Go back to SHOPLINE Admin panel > [Settings] > [Payment Options] > Click Publish to make this payment method available for your store.

Screen_Shot_2018-09-18_at_7.04.23_PM.png

 

Customer checkout flow using Google Pay

Google Pay only works for
Chrome on Android; Chrome for Desktop (Windows/Mac OS/Linux)
(not capable of Chrome on iOS device)

Before checking out, please check the following steps:

  • Please LOG IN to the browser with your Google Account
  • Please ADD the payment method to your Google Pay Account
  • Please UPGRADE the device and the browser to the latest version

 

How to Add Payment Method to Google Account

Step 1. Add payment method

Log into Google Pay > Payment Methods > Add payment method.

image6.png

 

Step 2. Fill in information

Fill in the required information.

image5.png

 

Step 3. Verify your payment method

You may be asked to verify your payment method, choose an option from the list. Find and enter the verification code.

You may find detailed instructions here.

 

Mobile Web Checkout 

Step 1. Confirm purchase

After customers confirm purchase and proceed to checkout, they will see the "Pay Now" button.

Screenshot_20180919-163423__1_.jpg

 

Step 2. Enter the CVC

Payment details will then pop up. After customers confirm the details and enter the CVC of their credit card, the check-out process is completed. 

Customers can also choose different payment cards by clicking the "Edit" button.

Screenshot_20180919-162558__1_.jpg

 

Desktop Web Checkout

Please be reminded to:

  • Log in to your Google Account in the browser
  • Add the payment method to your Google Pay Account (you may refer to the above section)
  • Upgrade the device and the browser to the latest version

If your customers fail to fulfill the above prerequisites, they will see the following error message on the checkout page.

Screen_Shot_2018-09-19_at_5.10.19_PM.png

 

Step 1. Choosing Google Pay as the payment method

After choosing Google Pay as the payment method, the check out page will be shown as below: 

Screen_Shot_2018-09-19_at_4.56.50_PM.png

 

Step 2. Pay now

After clicking "Pay now", a window with customers' credit cards details and an order summary will pop up. 

Screen_Shot_2018-09-19_at_51203_PM.png

 

After customers click "Pay", they will need to enter the CVC of their credit card.

Screen_Shot_2018-09-19_at_51929_PM.png

 

After customers click "Confirm", they will be directed to the order confirmation page. The check-out process is then completed.

_____2018-09-19___1.03.58_2_.png

 

 

 

 

 

Have more questions? Submit a request

Comments