Improvements to inline checkout

Released February 8, 2023

We've optimized inline checkout to reduce the number of steps, making it easier for customers to checkout.

Here's what's new:

  • Customer email and location are now on the same screen, removing a screen from the checkout process.
  • Card details are now on the payment screen, rather than a click away.
  • We added new events to better reflect the new checkout journey.
Screenshot showing the new simplified payment screen that includes card details
  • Improved checkout conversion
    We tested these changes extensively before launch, with some sellers seeing an increase of checkout conversion rate of up to 2.7%.
  • Opportunity for a one-page checkout experience
    If you pass email and location fields as parameters, customers land on a screen asking them for card details — no clicks needed.

There are no breaking changes. This means:

  • Customers can still checkout, even if you don't make any changes.
  • Existing events still work. They're not deprecated; you can continue to use them.

There are visual changes. This means that you may need to update your integration to maintain the best checkout experience for your customers.

We've turned on the improved inline checkout experience in sandbox. Switch your checkout to sandbox using the Paddle.Environment.set('sandbox') method.

See: Work with the Paddle Sandbox

To accommodate the simplified checkout process, the checkout frame is slightly taller.

We recommend:

  1. Change frameInitialHeight to at least 450 to avoid scrollbars in the checkout frame.
  2. Make sure there's enough space for the frame to grow, depending on the number of payment methods you have.
Number of payment methodsMinimum recommended height

If you've built breadcrumbs or other elements to let your customers know where they are in the checkout process, you may need to change these.

Where before, breadcrumbs might have looked like this:

graph LR A[Product] --> B[Email address] B --> C[Address] C --> D[Payment]

Now, the customer journey looks more like this:

graph LR A[Product] --> B[Customer details] B --> C[Payment]

There are three new events that you can use to better reflect the new customer journey:

Checkout.Customer.DetailsCustomer has landed on the screen to enter their email and location details (step 1).
Checkout.Payment.SelectionCustomer has landed on the screen to select payment method (step 2).
Checkout.Payment.SelectedCustomer has selected a payment method.

We've updated our guides with these new changes:

Login to your Paddle account to chat directly with our Seller Support team, or email