Get a free Consultation

    Search for:

    Last Updated | June 20, 2022

    Overview: How Can You Add Afterpay to Shopify?

    Afterpay is a payment gateway that offers somewhat of a “buy now, pay later” product. It offers your customers a chance to buy whatever they fancy and pay four equal installments due every two weeks, instead of paying upfront. This concept has gained a lot of traction since most Americans are receiving their bi-weekly paychecks. With flexible (and more affordable) payment options, compared to full upfront payments, integrating Afterpay with your Shopify store offers tons of benefits, such as:

    how to set up Afterpay on Shopify – Benefits:

    • Improved conversion rates: With Afterpay, your customers are motivate to make purchases they would normally hesitate to venture. Afterpay also offer zero fraud or credit risk since it settles payments upfront; something that is a big plus for small businesses.
    • Less cart abandonment: With Afterpay, your customers are motivated to make purchases they would normally hesitate to venture. More importantly it will prevent any visitors from abandoning your site as the credit feature is engaging for any buyer.
    • A much higher average order value: Since Afterpay has a minimum order size of at least $35, it automatically boosts the average order value.

    How to connect Afterpay to Shopify

    Integration with Afterpay is a win-win solution that any Shopify website design services can help you with. Since Afterpay only costs you money on successful sales, and it doesn’t entail any fixed monthly charges or setup fee, you don’t lose any money even if none of your customers choose to use this gateway. Now that we know how beneficial it is to integrate your Shopify store with Afterpay, let’s dive into how to do it right. Let’s look at a Shopify ecommerce development company integration process for Afterpay and Shopify and enhance the Ecommerce experience for your customers.

    Related Article:
    You Can Explore Further About What is a Shopify Pay code?

    How to Add Afterpay to Shopify Product Page?

    Looking for how to integrate that Afterpay snippet to your product details page? You can either seek help from a Shopify app development services company or use our easy step-by-step guide to get you started.

    How to offer Afterpay on Shopify

    How to get afterpay on shopify –  Sign up as an Afterpay Retailer

    To integrate Afterpay to your Shopify page, you need to Sign up as an Afterpay Retailer.

    How to integrate afterpay with shopify – Add the New Payment Method

    The next step is to login to Shopify and add the new payment method. Head to Settings > Payment Providers > Alternative Payments and select ‘Afterpay’.

    How do I add Afterpay to my Shopify Store – Merchant Id

    Enter the credentials from your Afterpay merchant account into their corresponding fields: Merchant Id — Merchant ID that was supplied during account creation, and the Secret Key — secret key that was supplied during account creation.

    How to Show Afterpay on Shopify – Integrate the Afterpay logo

    Next, you need to integrate the Afterpay logo within your Shopify code. Now, if you are not familiar with Shopify’s liquid code, this part could be a little difficult. On your Shopify theme, you will need to edit the code and enter the script according to the documentation issued by Afterpay. Online Store > Themes > Edit Code. Next, go to the product pricing and add to cart button in your product template and insert the Shopify script. Save and refresh the file.

    The Afterpay snippet should now appear under the product price.

    As a last test run, head to the checkout process and see if the Shopify checkout redirects to Afterpay option.

    How To Add Afterpay Logo To Shopify?

    To add Afterpay logo to Shopify, here is a simple guide to follow:

    • Login on to your Shopify store
    • Click Action navigate to edit code and click edit code.
    • Click on theme. Liquid. Navigate all the way down to html/ and press enter key twice
    • Open new tab copy this link into your browser https://developers.afterpay.com/after.
    • Paste the code you copy from this link into theme. Liquid
    • Click on save and refresh your product page. You can also hire Shopify specialists to help you with the logo.

    How Does Afterpay Work with Shopify?

    Using Afterpay with Shopify is as simple as a breeze with Shopify ecommerce integration services. Retailers simply add Afterpay to their checkout process online like they would with other payment options like credit cards or PayPal. Customers have the option to select Afterpay at checkout, after which they will be redirected to the Afterpay portal detailing the payment amount, payment frequency, and the amount that is due at time of checkout. At the customer end, Afterpay receives the first installment from the customer, but the seller’s payments are settled by Afterpay after a cut. So in essence, Customers pay off their balance in installments to Afterpay, not the seller. If the customer makes good on their monthly installments, they do not get charged an extra fee but if a payment is missed, a $10 fee is charged.

    How Much Does Afterpay Cost For Merchants?

    While Afterpay is completely free for consumers, it does make money by charging retailers for every successful sale. Retailers usually pay 30 cents per transaction, plus a 4-6% commission fee. Percentage fee keeps decreasing for larger transactions. Now, it may seem like a hefty sum as compared to other gateways, like the PayPal processing fees of 2.9% + 30 cents for each transaction. While Afterpay charges more than regular credit card fees, the numerous benefits offered by Afterpay more than make up for the cost.

    What is Afterpay widget Shopify?

    Once Afterpay is setup as a payment option, you can display the Afterpay widgets depicting the cost breakdown on the product pages and thumbnails. Custom scripts can be installed on your product pages so that customers will remember to use Afterpay. Afterpay widgets are really important since they automatically break down the cost into installments so that customers can have a clearer picture of their payments.

    What is Afterpay banner Shopify?

    If are looking to add Afterpay banner on product page, go to Section->product-template.liquid->find name=”add” and place a line of code after or before this button or place where you want on page.

    FAQ About How to Install Afterpay on Shopify

    How To Add Afterpay To Shopify POS?

    The Shopify POS solution is not a certified Afterpay integration. If any store owner is looking to offer Afterpay at the store level, they are encouraged to apply for a certified POS platform integration or alternatively sign up for the Afterpay Standalone (web browser) based solution. The Afterpay Standalone solution enables merchants to login to the Afterpay Merchant Portal using a web browser and process in-store transactions directly through the Afterpay Portal.

    How To Add Afterpay Logo To Shopify?

    To add the Afterpay logo to your Shopify store, login on to your Shopify store and click on Online Store. Next, Click Action navigate to edit code and click edit code. Select theme.liquid. Navigate all the way down to html/ and press enter key twice. Copy and Paste the code provided online into theme.liquid and save. Refresh to see whether the logo has been added to your store.

    How Do You Test Afterpay On Shopify?

    Finish installing Afterpay on your Shopify store. As a last test run, head to the checkout process and see if the Shopify checkout redirects to Afterpay option.

    What Is Afterpay Liquid Snippet For Shopify?

    The Afterpay liquid snippet is placed at the bottom of the product page.


    Folio3, a Software Powerhouse established in 2005, is one of the leading eCommerce solution providers for SMBs and Fortune 500. The Company has expertise in diverse industries such as Animal Care, Retail, Automotive, Food and Agriculture, and Health care. From ecommerce store design and development to full-scale ERP deployment and integration, Folio3 has done it all.