Take full control of the customer experience from start to finish with embedded products.
If a Billgang-powered storefront doesn't suit your needs, you can leverage our products directly on your own website. From payments to automated product delivery and customer insights, you get everything Billgang has to offer.
Let's get started!
Embedding Javascript
The first step is to add the following snippet of code to the <head> section of your website. This code will load the necessary scripts for the embedded products to function:
<script src="https://platform.billgang.com/embed.js"></script>
Purchase Button
Add this button code to your website. When a user clicks this button, an embedded interface will appear to guide them through the payment process:
<button
data-billgang-product-path="SEO_PATH"
data-billgang-domain="your_billgang_domain.bgng.io"
>
Purchase
</button>
Replacing Variables
SEO_PATH: Replace this with your product's path. This can be found in the SEO section of your product edit page or by the product name.
your_billgang_domain: Replace this with your Billgang-provided domain (e.g., demo.bgng.io), or your custom domain (e.g., demo.com).
Example HTML Page
For clarity, here's a full example of an HTML page that includes all the necessary code for embedding a product:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sample Payment Page</title>
<script src="https://platform.billgang.com/embed.js"></script>
</head>
<body>
<button data-billgang-product-path="SEO_PATH" data-billgang-domain="your_billgang_domain.bgng.io">
Purchase
</button>
</body>
</html>
Conclusion
If you have any questions or issues with setting up the product embedding, our support team is always ready to assist you. Please contact us through the Billgang live chat in your dashboard.