1. Add the Embed Script
Include the following script tag anywhere in your HTML (preferably right before the closing body tag):Modern Frameworks (React, Next.js, etc.)
If you are using a modern SPA framework like Next.js, do not use a raw HTML
<script> tag. Instead, use your framework’s built-in script loader (e.g., import Script from 'next/script' and <Script src="https://js.blink.store/embed.js" strategy="afterInteractive" />) to ensure the script loads reliably across client-side navigations.2. Using the JavaScript API
Once the script is loaded, it automatically binds to any clickable element with the classblink-button.
Automatic Binding (HTML)
Programmatic Binding (React / Next.js)
If you are building a Single Page Application (SPA) where you need to trigger the checkout programmatically, the script exposes a globalwindow.Blink object:
When generating the checkout URL dynamically via the API (
POST /v1/checkouts), ensure you pass "options": { "layout": "overlay" } in the payload. Our embed.js script will automatically handle formatting the URL correctly to trigger the embed mode.