Embedded Checkout

The Drop-in
Crypto Widget

Don't redirect your customers. Keep them on your domain, maintain your brand identity, and increase conversion rates up to 40% with an embedded, white-labeled crypto checkout widget.

Get Snippet Code View Live Demo

iFrame or Modal

2 Lines of Code

Select Currency

Bitcoin

BTC Network

Tether USD

TRC-20 Network

Ethereum

ERC-20 Network

Litecoin

LTC Network

Secured by AlbaPay Protocol

Redirects Kill Conversions

Industry data shows that every time you redirect a user away from your domain to a third-party payment portal (like PayPal or native crypto gateways), cart abandonment spikes by roughly 12% to 18%.

Users trust your brand. When the URL suddenly changes to `pay.someweirdcryptoAPI.com`, less-technical buyers panic, assuming it's a phishing attempt, and close the window.

"We switched from a redirect flow to the AlbaPay embedded widget on our checkout page. Our crypto payment completion rate increased by 38% overnight simply by keeping the user on our domain."

— E-Commerce Manager, TechGear Imports

Embed in 3 Steps

No complex API integrations required. Copy, paste, and get paid.

Copy the Script Hook

Add a single line of JavaScript to your `` tag. This lightweight script (under 12kb) loads the widget securely without impacting your page speed score.

Place the Div Tag

Place an empty `

` exactly where you want the checkout UI to appear. e.g., Right below your shipping address form.

Pass the Order Amount

When the user clicks 'Checkout', dynamically pass the total fiat amount and order ID to the widget via JS. The iFrame instantly renders the payment flow.

Widget Capabilities

A full-featured payment processor crammed into an isolated iFrame.

Unmatched Theming

Pass your CSS hex codes through the Javascript configuration to perfectly match the widget's buttons, text, and background to your site's aesthetic. Supports Light/Dark mode toggling natively.

Auto-Translation (Localization)

The widget's UI automatically detects the user's browser language and translates the checkout instructions into 15+ supported languages, increasing international conversion.

Responsive & Mobile First

Designed from the ground up for mobile. The widget automatically resizes its font and grid structures to fit perfectly on iPhones and Android devices, ensuring QR codes are always readable.

Real-time Websockets

The moment a user broadcasts a crypto transaction, the widget updates instantly with a "Payment Detected" UI state, preventing double-payments while waiting for blockchain confirmations.

Web3 Wallet Detection

The widget detects if the user has an injected Web3 wallet (like MetaMask or TrustWallet). If detected, it offers a "Pay with MetaMask" button to sign the transaction automatically without copying addresses.

PCI-Compliant Architecture

Because the widget acts as a secure iFrame sandbox connecting directly to our nodes, no payment data ever touches your server logs, keeping your infrastructure completely out of regulatory scope.

Perfect for Custom Flows

Custom E-Commerce Stores

If you built a bespoke React or Vue storefront, the widget slides easily into your front-end without requiring deep backend API surgery, keeping your development timeline short.
Charities & Donations

Embed a simple "Donate with Crypto" widget on your landing page. The widget allows users to input custom fiat amounts and pick their preferred coin instantly.

Developer Integration

Listening for Javascript success events from the widget.

ReactComponent.tsx

import { useEffect } from 'react';

export default function CryptoCheckout({ orderTotal, orderId }) {
  useEffect(() => {
    // Initialize widget when component mounts
    window.AlbaPayWidget.render('#cg-widget-container', {
      price: orderTotal,
      currency: 'USD',
      order_id: orderId,
      theme: {
        mode: 'dark',
        primary_color: '#ec4899' // Your brand pink
      }
    });

    // Listen for iframe events
    const handlePaymentEvent = (event) => {
      if (event.data.status === 'paid') {
        window.location.href = `/success?order=${orderId}`;
      }
    };
    
    window.addEventListener('message', handlePaymentEvent);
    return () => window.removeEventListener('message', handlePaymentEvent);
  }, []);

  return <div id="cg-widget-container"></div>;
}

Widget Vs Hosted Invoices

Feature	Embedded Widget	Hosted Invoices (Pay.AlbaPay)
User Domain Status	Stays on your site	Redirects to our site
UI Customization	Full CSS Control	Logo & Colors only
Integration Effort	Frontend Script (Easy)	Dashboard/API (Easiest)
Conversion Drop-off	Extremely Low	Moderate

Widget FAQs

Can I still get Webhooks if I use the Widget?

Yes. While the frontend Javascript can listen for success events to update your UI (like showing a celebration animation), your actual database should only be updated via the secure backend Webhook we fire to your server upon blockchain confirmation, preventing frontend manipulation.

Is the iFrame secure against XSS?

Absolutely. The widget is isolated via cross-origin policies. It cannot access your site's cookies or local storage, and your site cannot intercept the cryptographic data moving through the widget.

Improve Conversion

Generate your embed script and have crypto checkout running in the next 5 minutes.

Get Your Script

The Drop-in Crypto Widget

Your Brand Checkout