Google Pay Setup & Customer Checkout flow

SHOPLINE_Support-Advanced-Plan.jpgTo provide better customer experience, merchants can now set up Google Pay via Stripe as new payment option.

This article will cover:

 

Setting up Google Pay 

Remarks: You will need a Stripe account to activate Google Pay payment option. Stripe is now currently only available to merchants located in Hong Kong and supported currency 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" > Press "Add" button

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" on the top right hand corner to login to your account;
For new user, please enter your information below > 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 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 > Press "Update" to add Google Pay

Screen_Shot_2018-09-18_at_55855_PM.png

 

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 visible in 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 "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 card by clicking the "Edit" button.

Screenshot_20180919-162558__1_.jpg

 

Desktop Web Checkout

Please be reminded to:

  • log in 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 in checkout page.

Screen_Shot_2018-09-19_at_5.10.19_PM.png

 

Step 1 : choosing Google Pay as payment method

After choosing Google Pay as 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 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 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