Skip to content

🎁 BFCM is live! Save up to 30% on EComposer and unlock a free Feature Pack. Explore deals

🎁 The4 BFCM: 15% off Athora & Vetro + free homepage setup & 6 months of EComposer Standard free. See the deal

4.93,472 reviews on the Shopify App Store Install free New to Shopify?Open your store

Afterpay On‑Site Messaging Extension

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.  Hence, the demand for Shopify afterpay is increasing every passing second. This is the reason why we decided to integrate Afterpay to EComposer

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.

Afterpay On‑Site Messaging Extension — Overview (Screenshot 1)

First, please install the Afterpay app in your store. Here is the link to that app on Shopify App Store.

Afterpay On‑Site Messaging Extension — Overview (Screenshot 2)

After you have installed the app, it will show up in the App list on your site.

Afterpay On‑Site Messaging Extension — Overview (Screenshot 3)
  1. Firstly, you need to ensure that you had connected with Afterpay sucesfully. These steps below need to be done by yourself

  • Sign Up:
    • Create an account with Afterpay on their official website
  • Configure Afterpay:
    • Once the app is installed, follow the instructions to configure Afterpay for your store.
    • You’ll need to enter your Afterpay account details, API credentials, and other settings.
    • Connect the account successfully in the app dashboard
Afterpay On‑Site Messaging Extension — Overview (Screenshot 4)
  1. To open the Extension popup: From the left sidebar, go to Extensions → search for the extension name and click to install, or click View more to browse all available extensions in the app.

Afterpay On‑Site Messaging Extension — Overview (Screenshot 5)

Drag and Drop the Afterpay element to any position of the product page (usually under Price)

Afterpay On‑Site Messaging Extension — Overview (Screenshot 6)

Result: the Afterpay message doesn’t show up in the Editor view but on the live page

Afterpay On‑Site Messaging Extension — Overview (Screenshot 7)

Last updated

Was this page helpful?