When creating custom landing pages on Fermion, you can include direct checkout links that seamlessly redirect users to purchase your digital products or courses. This allows you to maintain full control over your landing page design while still leveraging Fermion’s secure checkout system.

​

How Checkout Links Work

Any anchor link or button with a redirect URL in the following format will open the Fermion checkout page:

/api/buy-digital-product?product-slug=YOUR_PRODUCT_SLUG

​

URL Parameters

Fermion’s checkout system supports several URL parameters to customize the checkout experience:

​

Required Parameters

• product-slug: The slug of your digital product or course that you want users to purchase. This field is mandatory and cannot be omitted.

​

Optional Parameters

• discount-code: Any discount code that needs to be automatically applied to the user’s checkout session. The discount code must exist in your product’s discounts section area. If the code doesn’t exist or has expired, users will see an “Invalid discount code” warning but can still complete checkout at full price.

• digital-product-price-id: The specific price ID for the digital product, useful if you have multiple pricing plans.

• total-installments-count: The number of installments for partial payment plans. Only required if the selected plan is an installment plan.

• prefilled-name: Pre-fills the user’s name on the checkout form. Useful when your landing page collects user input.

• prefilled-email: Pre-fills the user’s email address on the checkout form. Useful when your landing page collects user input.

• prefilled-phone-number: Pre-fills the user’s phone number on the checkout form. Useful when your landing page collects user input.

• smart-checkout-redirect: Set to true to automatically redirect to the best available payment gateway when prefilled-email and prefilled-name are present. This reduces one step for users to complete.

• UTM Parameters: For marketing attribution, you can add any of the following:

• utm_source, utm_medium, utm_campaign, utm_id, utm_term, utm_content

​

Code Examples

​

Basic Checkout Link

<a href="/api/buy-digital-product?product-slug=my-awesome-product">
	Buy My Product
</a>

​

Checkout Link with Discount Code and UTM Parameters

<a
	href="/api/buy-digital-product?product-slug=my-awesome-product&discount-code=EARLY_LAUNCH&utm_source=newsletter&utm_medium=email"
>
	Buy with Early Bird Discount
</a>

​

Checkout Link with Pre-filled Information and Installments

<a
	href="/api/buy-digital-product?product-slug=my-awesome-product&digital-product-price-id=price_123&total-installments-count=3&prefilled-name=John%20Doe&prefilled-email=john@example.com"
>
	Buy Product (3 Installments)
</a>

​

Complete Checkout Link with All Parameters

<a
	href="/api/buy-digital-product?product-slug=my-awesome-product&digital-product-price-id=price_123&total-installments-count=3&discount-code=EARLY_LAUNCH&prefilled-name=John%20Doe&prefilled-email=john@example.com&prefilled-phone-number=1234567890&smart-checkout-redirect=true&utm_source=adwords&utm_medium=cpc&utm_campaign=summer_sale"
>
	Buy Product Now
</a>

​

JavaScript Implementation

For dynamic checkout links that collect user input from your landing page, use this JavaScript function to safely construct the checkout URL:

function initiateCheckout() {
	// Assuming this function is called on a button click
	const params = new URLSearchParams({
		'discount-code': code,
		'product-slug': checkoutPageDataInfo.fermionDigitalProductSlug,
		'digital-product-price-id':
			checkoutPageDataInfo.pricingPlanSpecificData
				.fermionDigitalProductPriceId,
		'total-installments-count':
			checkoutPageDataInfo.pricingPlanSpecificData.planType ===
			'PartialPaymentPlan'
				? (
						checkoutPageDataInfo.pricingPlanSpecificData
							.installmentCountSelectedByUser ?? ''
				  ).toString()
				: '',
		'prefilled-name': nameOfUser || '',
		'prefilled-email': emailOfUser || '',
		'prefilled-phone-number': phoneNumber || '',
		'smart-checkout-redirect': 'true',
		utm_source: utmSource || '',
		utm_medium: utmMedium || '',
		utm_campaign: utmCampaign || '',
		utm_id: utmId || '',
		utm_term: utmTerm || '',
		utm_content: utmContent || '',
	})

	// Remove empty parameters
	params.forEach((value, key) => {
		if (value === '') params.delete(key)
	})

	window.location.href = `/api/buy-digital-product?${params.toString()}`
}

​

Manual URL Construction

If you prefer to construct URLs manually, ensure you use encodeURIComponent() for all parameter values:

const productSlug = 'my-awesome-product'
const priceId = 'price_123'
const installmentCount = '3'
const userName = 'John Doe'
const userEmail = 'john@example.com'
const utmSource = 'newsletter'

const checkoutUrl = `/api/buy-digital-product?product-slug=${encodeURIComponent(
	productSlug
)}&digital-product-price-id=${encodeURIComponent(
	priceId
)}&total-installments-count=${encodeURIComponent(
	installmentCount
)}&prefilled-name=${encodeURIComponent(
	userName
)}&prefilled-email=${encodeURIComponent(
	userEmail
)}&utm_source=${encodeURIComponent(utmSource)}`

​

Integration with Custom Landing Pages

To integrate checkout links with your custom landing pages:

1. Create your custom page in Fermion’s instructor dashboard
2. Design your landing page with HTML, CSS, and JavaScript
3. Add checkout buttons/links using the /api/buy-digital-product URL format
4. Test the checkout flow to ensure all parameters work correctly
5. Publish your page when ready

​

Best Practices

• Always test checkout links before publishing your landing page
• Use the JavaScript approach when collecting user input to ensure proper encoding
• Keep discount codes simple and avoid special characters when possible
• Validate user input before constructing checkout URLs
• Provide fallback options in case discount codes are invalid or expired
• Use UTM parameters to track marketing attribution and campaign performance