Checkout Overlay

Instead of using the hosted checkout, you can utilize the checkout overlay—a modal or popup that can be seamlessly integrated into any website, including WordPress, Webflow, Wix, and more, allowing you to easily sell your products without users leaving your website.

You can also toggle on and off features from:

• Store logo
• Product media
• Product description
• ‘Name’ field
• Discount code

Copy and paste the HTML embed code to add a “Buy” link to your web page. Style the link however you wish.

Use with JS Frameworks

The checkout overlay works by embedding a JavaScript lemon.js file into your website. Upon loading, the script automatically initializes to detect clicks on .lemonsqueezy-button elements.

When using the checkout overlay with modern JavaScript frameworks like React or Vue, the lemon.js initialization may occur before your component is rendered. In such cases, manually call the window.createLemonSqueezy() method after the component has mounted. This method can be called multiple times if needed.

useEffect(() => {
  window.createLemonSqueezy()
}, [])