Connect the Paddle checkout

Introduction

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.

Try it now

Task	Section
Gather checkout details	The Paddle checkout
Import the Paddle JS library	The Paddle checkout
Add a Paddle button to your web page	The Paddle checkout

Learning

Resource	Summary
Paddle JS library reference	Find out more about the Paddle JS library.
Overlay checkout	Paddle's overlay checkout is an iframe, displayed over your webpage. Find out how to implement this for your website, here.
Inline checkout	Paddle'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 parameters	The 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 behavior	Find out more about customizing the customer's experience once a checkout is completed.
Checkout API endpoints	Take a deep dive into the Paddle API to find out how you can integrate Paddle checkout functionality with your platform.