Get a Free Consultation

    Search for:

    How to Add Afterpay to Shopify?

    Last Updated | January 16, 2024

    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 up front. This concept has gained a lot of traction since most Americans are receiving their bi-weekly paychecks.  Hence, the demand for Shopify afterpay is increasing every passing second. The reason why adding Afterpay to Shopify compliments each other so well. With flexible (and more affordable) payment options, compared to full upfront payments, integrating Afterpay with your Shopify store offers tons of benefits, such as:

    Shopify integration

    How to Add Afterpay to Shopify

    Some benefits of using Afterpay on Shopify:

    • Improved conversion rates: With Afterpay, your customers are motivate to make purchases they would normally hesitate to venture into. Afterpay also offers 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 into. 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 Add Afterpay to Shopify

    Reasons 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 fees, you don’t lose any money even if none of your customers choose to use this gateway. And there goes the most cumbersome thought out from the window related to Shopify and Afterpay. 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.

    Shopify integration

    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. The Afterpay Shopify integration isnt that difficult to execute.

    The Afterpay Shopify integration isn’t that difficult to execute and includes the following steps.

    Sign up as an Afterpay Retailer

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

    Add the New Payment Method

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

    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.

    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 for you to do Shopify theme customization. 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.

    Read Also How to Open a Shopify Store

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

    How to offer Afterpay on Shopify

    2. How To Add Afterpay Logo To Shopify?

    To add the 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 the theme. Liquid. Navigate all the way down to HTML/ and press enter key twice
    • Open a new tab and copy this link into your browser https://developers.afterpay.com/after.
    • Paste the code you copy from this link into the theme. Liquid
    • Click on save and refresh your product page. You can also hire Shopify specialists to help you with the logo.

    7 Benefits of afterpay shopify integration

    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 the 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.

    Step Description
    1. Shopify Store Setup – The merchant sets up an online store using Shopify, adds products, and configures the store settings.
    2. Afterpay Integration – Merchant installs the Afterpay app or plugin from the Shopify App Store.
    3. Product Listings – Merchant designates which products are eligible for Afterpay payments, usually by setting a minimum and maximum purchase amount.
    4. Customer Shopping – Customers visit the Shopify store, browse products, and add items to their cart as usual.
    5. Checkout – During the checkout process, customers select Afterpay as a payment option, if available.
    6. Afterpay Approval – Customers provide their details to Afterpay, which assesses their eligibility for the installment plan.
    7. Payment Plan – If approved, Afterpay divides the total purchase amount into equal installments, typically four, and schedules automatic payments.
    8. Order Confirmation<br>- The order is confirmed, and the customer receives an order confirmation email.
    9. Payment Schedule<br>- Customers are responsible for making payments directly to Afterpay according to the agreed-upon schedule.
    10. Order Fulfillment – The merchant processes the order and fulfills it as they would with any other payment method.
    11. Afterpay Payments – Afterpay pays the merchant the full purchase amount upfront, minus their service fees.
    12. Customer Payments – Customers continue making scheduled payments to Afterpay until the total purchase amount is paid off.
    13. Late Fees (if applicable) – Afterpay may charge late fees to customers for missed payments, which are outlined in the terms of the installment plan.
    14. Returns and Refunds – Merchants can process returns and refunds through Shopify, and Afterpay will adjust the customer’s payment plan accordingly.

    This integration enhances the shopping experience by offering customers the flexibility to split their payments over time while allowing merchants to receive the full order amount upfront. Additionally, it can attract more customers and boost sales for Shopify store owners.

    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. Thus, Afterpay for Shopify is a match made in heaven

    What is Afterpay widget Shopify?

    The Afterpay widget seamlessly integrates Afterpay’s payment functionality into a Shopify store, making it a convenient and attractive option for customers who want to spread out the cost of their purchases over time without incurring interest or fees if payments are made on schedule.

    A Comprehensive Guide on Integrating Afterpay with BigCommerce

    What is the Afterpay banner Shopify?

    If are looking to add an Afterpay banner on the 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.

    Process to integrate Afterpay into Shopify:

    Integrating Afterpay into your Shopify store allows your customers to opt for installment payments at checkout, potentially increasing conversion rates and average order values. Here’s a step-by-step guide to help you set up Afterpay on your Shopify store:

    Step 1: Set Up a Merchant Account with Afterpay

    Before you can offer Afterpay as a payment option, you’ll need to sign up for a merchant account on the Afterpay website. Follow their sign-up process, providing all necessary business details. After your account is approved, you’ll receive a Merchant ID and a Secret Key, which are crucial for integrating Afterpay with your Shopify store.

    Step 2: Log in to Your Shopify Admin

    – Navigate to your Shopify Admin dashboard.

    – Click on ‘Settings’ at the bottom left corner of the page.

    –  From the settings menu, choose ‘Payments.’

    Step 3: Configure Alternative Payments

    In the ‘Payments’ section, scroll down to find the ‘Alternative Payments’ area.

    Click on ‘Choose alternative payment.’

    Step 4: Search and Select Afterpay

    In the search bar, type in “Afterpay.”

    Select Afterpay from the list of available payment methods.

    Step 5: Enter Your Afterpay Merchant Details

    Input your Merchant ID and Secret Key into the respective fields. These details should have been provided to you when you signed up for your Afterpay merchant account.

    Step 6: Activate Afterpay

    Before activating, ensure that the ‘Enable test mode’ option is unchecked (unless you are planning to run test transactions).

    Click on the ‘Activate’ button.

    Step 7: Verify the Integration

    Go to your online store’s checkout page and see if Afterpay appears as an available payment method.

    Optionally, you can conduct a test transaction to ensure everything is working correctly.

    Step 8: Customize Afterpay Display Settings (Optional)

    You might also want to customize how Afterpay information is displayed on your product pages. This could involve adding banners or information snippets that inform customers about the availability of Afterpay for their purchases.

    Step 9: Review Afterpay’s Merchant Terms

    Make sure to thoroughly review Afterpay’s merchant terms and conditions to ensure you comply with their policies and to understand how their fees and payment processes work.

    Step 10: Monitor and Manage Afterpay Transactions

    Regularly monitor and manage your Afterpay transactions from your Shopify admin and Afterpay merchant account to ensure everything is running smoothly.

    By following these steps, you should be able to successfully integrate Afterpay with your Shopify store, providing your customers with an additional payment option at checkout.

    FAQ About How to Install Afterpay on Shopify

    What is Shopify POS Afterpay?

    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.

     where is Afterpay snippet located?

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

    How Do I Get the Afterpay widget on Shopify?

    If you want to add customized widgets, you can modify the AP Widgets and AP Modal scripts, which are two independent scripts.

    By heading to Settings & Tools > All Settings & Tools > Custom Scripts > Add New, you can add a widget.


    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.