How Tos
Subscriptions
Prices & Discounts
Track & Report

Pass parameters to the Checkout

The checkout experience can be customized by passing in settings, either as JavaScript parameters, as HTML data attributes or through API parameters to generate a custom Pay Link.

Pass Parameters on the Front End

For example, you can collect a buyer’s email address as part of an earlier user flow and pass the value to the checkout so there is no need for the buyer to enter it a second time:

<form id="pre-checkout">
	<input id="useremail" type="text" placeholder="Email address">
</form>
<a href="#!" id="buy">Buy Now!</a>

<script type="text/javascript">
	function openCheckout() {
		var form = document.getElementById('pre-checkout');
		Paddle.Checkout.open({
			product: 12345,
			email: form.useremail.value
		});
	}
	document.getElementById('buy').addEventListener('click', openCheckout, false);
</script>

If using the paddle_button class, you can also pass an email to the checkout by adding the data-email attribute to your button.

Pre-checkout Flow

Paddle’s checkout is optimized for high conversion rates, which means that we collect the minimum amount of customer information needed to fulfill the order and ensure compliance.

If you need to collect additional data in your purchase flow, or would prefer to design your own purchase flow before the payment is taken you can build pre-checkout forms to collect user information and pass that data to the checkout so it is associated with the purchase.

Collected Fields

The customer data fields collected in the Paddle checkout are:

  • Customer email
  • Customer country
  • Customer postcode (when required)

Any of these fields can be passed to the Paddle checkout using JavaScript parameters or HTML attributes. If the fields are passed to the checkout, the checkout will skip the steps where they are collected. If all values are supplied, the checkout will open at the payment method selection stage.

Checkout steps are only skipped if the required fields are passed in the same order they are presented in the checkout. For example, if you wish to pass in the customer’s country and postcode, you must also collect and pass in their email address. For a complete list of parameters that can be passed to the checkout see our Checkout Parameter Reference section.

Sending additional user data

You may want to collect and pass through additional data about a user that is not needed to process the transaction, for example a user ID linked to your platform or information for marketing campaign lists.

If collecting personal data, make sure that your data processing is compliant with necessary data protection regulation, including the GDPR.

These fields can be added to the passthrough string parameter. Any data added to this parameter will be saved and sent in any subsequent webhook alerts that you set up in your Seller Dashboard. While any string can be used as the passthrough value, you may find it easiest to use a JSON string to pass multiple data values as an object definition like the example below:

Paddle.Checkout.open({
	product: 12345,
	passthrough: '{"user_id": 98765, "affiliation": "Acme Corp"}'
});

Generating Pay Link via API

Generating a checkout via the Pay Link API allows you to pass in parameters from your back end. Pay Link checkouts can be based on an existing product or subscription plan (in which case they will inherit certain properties of that product – unless you override them) or can be completely custom, and not based on any existing product.

The API will return a link to a checkout with the settings securely encoded that you can send to the user just like any standard checkout link, or pass into Paddle.js using the override parameter. This can be done either as a Paddle checkout button:

<a href="#!" class="paddle_button" data-override="https://checkout.paddle.com/checkout/custom/abc123...">Buy Now!</a>

or as a Javascript call like below:

Paddle.Checkout.open({
	override: 'https://checkout.paddle.com/checkout/custom/abc123...'
});

See our API documentation for more details on the Pay Link API.