Getting Started

Table of contents

1. HTML Initialization
2. JavaScript Initialization

---

HTML Initialization

You can create a “Pay With Bitcoin” button with just 2 lines of HTML as shown below. The script tag loads the JavaScript plugin from our CDN. The script will look for any div with the class posfra-pay-button, if the embed-token attribute is valid the script will automatically display a “Pay with Bitcoin” button.

<script src="https://cdn.posfra.com/posfra.js"></script>

<div 
  class="posfra-pay-button"
  embed-token="f419128f528d75174399b3662a2e0ceaed29b98a59cbc9d33601fa2f903c1b6f"
  usd="50"
  redirect-url="https://yoursite.com/paid"
  ref="order-12345"
  data='{"customerId":"abc123"}'
></div>

JavaScript Initialization

Beyond simple integration with the HTML UI components, Posfra.js empowers developers to create tailor-made Bitcoin payment experiences using its low-level JavaScript SDK. This SDK exposes all core payment operations, so you can craft fully customized user flows, interact with the payment backend directly, and adapt the widget’s logic as needed for your application.

document.addEventListener('DOMContentLoaded', () => {
    const element = document.querySelector('#my-element');
    const embedToken = 'f419128f528d75174399b3662a2e0ceaed29b98a59cbc9d33601fa2f903c1b6f';
    const posfra = new Posfra(embedToken);
    posfra.createPayWithBitcoinButton(element, {
        btc: '0.002',
        ref: 'order-12345',
        redirectURL: 'https://yoursite.com/paid',
        data: '{"customerId":"abc123"}',
    });
});