Docs
Chargebee offers multiple options to integrate its hosted checkout, such as Drop-in script, Hosted Pages API, or Payment Link. These integration options allow you to use the checkout in your web application either as a stand-alone page or as an overlay. On the other hand, the Embedded Checkout feature allows you to embed the Chargebee Hosted Checkout within your web pages as an iFrame. An embedded checkout allows for a better integration experience rather than relying on a standalone page setup.
Chargebee supports embedding checkout only with the full-page layout .
Ensure to enable and configure Full Page Checkout in your Chargebee site and configure your Checkout settings, styling and customization to suit your brand.
Embedding a hosted checkout involves two steps:
Let us dive deeper into these steps:
Before you can embed the full-page checkout, you can decide how you want to integrate the checkout option that will display on your web page. Based on the customer's use case, you can decide which option to choose from:
Depending on your mode of checkout integration, by now, you would either have a cart object prepared (Drop-in Integration), or a hosted page URL (Payment link URL / Hosted Page URL obtained via API).
Embedding checkout involves the following steps:
Learn more about creating an HTML container, mounting the checkout, and resizing the embedded checkout.
Callbacks are functions that trigger additional actions following specific events within the checkout flow. By using Callbacks, you can incorporate supplementary functions, customize event triggers, and gain precise control over navigation and transitions. This flexibility extends to error handling and cross-platform compatibility, ensuring a consistent checkout experience.
Learn more about callback functions.
By default, when you have provided a Redirect URL for a plan in the Chargebee app, you are redirected to the set web page. However, for handling better redirection within your application at your end, you can use the success callback function, because callbacks allow you to have better control over redirection.
Articles & FAQ