Learn about our new Popup Order ProcessRead the Guide
Home >

Pop-Up Integration

Pop-up storefronts contain checkout processes, order processes, or other customer self-service features that "pop up" when a customer clicks an action button. They allow you to host your own, integrated cart on your web page, while still utilizing our platform to collect customer payment information and process transactions. They also enable you to present a smooth, minimalistic cleverbridge checkout experience on your website.

How to Integrate

Example Pop-Up

For a working example of a pop-up checkout process, see the Cloudbit Demo Page.

cloudbit popup checkout

Additional Information

The following is some additional information that you should consider when you decide to use the pop-up integration method:

Best Practices

The following are some best practices when integrating the popup checkout process:

  • Build the pop-up only after the user has clicked an action button. If you want to build the pop-up as soon as the visitor lands on your page, for example to improve loading times, contact Client Experience to discuss this.

  • Don't try to include cross-sell/up-sell/promotional banners or/and "Don’t Leave Layers" in the pop-up. The pop-up was designed for a quick and simple checkout experience once the customer commits to a purchase. If you want to include these marketing tools on your web page, do so before the pop-up is loaded.
  • To avoid distracting the customer during the checkout process, we suggest applying discounts before the pop-up is opened. You can apply a coupon code when opening the checkout by adding &coupon=code to the checkout link.

Note

You should consider the following points before integrating the pop-up checkout process into your website:

  • cleverbridge always shows the final purchase price inside the pop-up. This will either occur on the review pageThe review page contains summary information about the purchase a customer is about to make. (in 3-4 step checkouts) or on the checkout page (in configurations without a review page). As a result, you should ensure that the price you display on your web page matches the cleverbridge cart price. You can use our Pricing API to sync the price in your system with the price cleverbridge displays in the checkout process.
  • cleverbridge always confirms the final product selection inside the pop-up, either on the review page (in 3-4 step checkouts) or on the checkout page itself (in configurations without a review page). As a result, you should make sure that the product(s) in the cleverbridge Buy Now link match the product(s) that you displayed to the customer on your website prior to loading the checkout pop-up.
  • cleverbridge always displays our terms & conditions and privacy policy in the footer of the pop-up. To avoid confusing the customer, please avoid showing your own legal terms close to the pop-up. For example, you could put them in the footer of your website, but you should not display them directly below the pop-up.
  • You should avoid placing any of your elements on top of the pop-up (including banners, windows, pop-ups, etc.) while the pop-up is visible to the customer. Otherwise, you may hide important elements.

Note

Do not trigger the pop-up checkout for customers using Internet Explorer 8, 9, or 10. These browsers are not supported by cleverbridge due to security concerns.