Paddle Checkout

Integrate Paddle Checkout Functionality into Blocs

The Paddle Checkout Bric allows you to add a Paddle overlay checkout to any Blocs button.



1. Add a Default Button Bric

As first step for creating a Paddle checkout button (like displayed on top of this page), add a default button bric to the page.
You are able to stype this button accordingly to your needs.

Give this button an ID (like paddle-button)

2. Add a Paddle Checkout Bric

In order to make this default button to a Paddle Checkout button, add a Paddle Checkout bric to the page.

In the settings of this Paddle Checkout bric, enter following information:

- Vendor ID: Available in the Paddle dashboard settings. Must be a number like 12345
- Product ID: Available in the Paddle dashboard in the product information. Must be a number like 557092
- Button ID: The ID of the button you created before like paddle-button

These are all required settings. In Blocs preview, after pressing the button, you should see a overlay checkout appearing.

3. Pull Price Information from Paddle

In order to display the price of the product as button text, add the class paddle-gross to the button.
In addition, add a custom attribute to the button, with the name data-product and as value the numeric product ID.