Get started
Build
Your Paddle account
Your Paddle catalog
The Paddle checkout
Connect the Paddle checkout
Gather checkout details
Import the Paddle JS library
Add a Paddle button to your web page
Paddle webhooks
Testing
Learn

Connect the Paddle checkout

Two types of checkout are available with Paddle:

  • Overlay. An iframe is displayed over your webpage when the checkout is triggered. The checkout is customized with your product logo and brand color.
  • Inline. Embedded into your web store page, with enhanced customization options so you can achieve the same look and feel as your website.

The Paddle JS library is used to implement both types of checkout. The quickest implementation is the overlay checkout, which we will complete in this task.

TaskSection
Gather checkout detailsThe Paddle checkout
Import the Paddle JS libraryThe Paddle checkout
Add a Paddle button to your web pageThe Paddle checkout
ResourceSummary
Paddle JS library referenceFind out more about the Paddle JS library.
Overlay checkoutPaddle's overlay checkout is an iframe, displayed over your webpage. Find out how to implement this for your website, here.
Inline checkoutPaddle's inline checkout is embedded into your web store page for a more customizable, branded checkout flow. Find out how to implement this for your website, here.
Customizing the checkout with parametersThe checkout experience can be customized by passing in parameters to collect/utilize additional user data. Find out what data can be collected and how to use it, here.
Post-checkout behaviorFind out more about customizing the customer's experience once a checkout is completed.
Checkout API endpointsTake a deep dive into the Paddle API to find out how you can integrate Paddle checkout functionality with your platform.