Build a Paddle Checkout in 10 Minutes

It’s super quick to get a Paddle checkout up and running on your website with just 5 lines of code. Follow the walkthrough below to import the Paddle JavaScript library and open the overlay checkout on your own store page.

Make sure you’ve created a one-time product or recurring plan in your paddle dashboard before continuing

Import the Paddle JavaScript library On your test store page add the following code just before the closing </body> tag to import the Paddle.js library and run the checkout setup method:

Please do not self-host Paddle.js, this will prevent you from receiving bug fixes and new features.

<script src="https://cdn.paddle.com/paddle/paddle.js"></script>
<script type="text/javascript">
	Paddle.Setup({ vendor: 1234567 });
</script>

Your Paddle Vendor ID can be found on the Authentication page in your Paddle dashboard.

Add a buy button

Any clickable element on your page can be made into a buy button by adding the paddle_button class and specifying the ID of the product you wish to use in the checkout:

<a href="#!" class="paddle_button" data-product="12345">Buy Now!</a>

You can find the product ID of your one-time product or recurring plan in the listing table under the Catalog section of your Seller Dashboard

Test your checkout!

Click the green buy button and you will see an overlay checkout displayed on top of your test store page. To test the whole checkout without making a real payment, you can create a product coupon.

If the checkout fails to display, check the browser console for any error messages. If you continue to have problems, get in touch with our support team or use our live chat.

Next

Learn more about Selling with Paddle