Auto-init payment buttons with simple HTML attributes
Please configure a Payment Link ID first
Use the Test Panel on the right to set your link ID
<!-- 1. Load SDK & Buttons -->
<script src="/sdk/dcp-sdk.umd.js"></script>
<script src="/sdk/dcp-buttons.v1.js"></script>
<!-- 2. Initialize -->
<script>
DCP.init({
projectId: 'your-project-id',
env: 'test'
});
DCPButtons.init();
</script>
<!-- 3. Place Buttons Anywhere -->
<div class="DCPButton"
data-tool="YOUR_TOOL_ID"
data-label="Pay with Crypto"
data-theme="light">
</div>
<!-- Dark Theme -->
<div class="DCPButton"
data-tool="YOUR_TOOL_ID"
data-label="Pay Now"
data-theme="dark">
</div>| Attribute | Type | Description |
|---|---|---|
| data-tool | string | Payment link/tool ID (required) |
| data-label | string | Button text (default: "Pay with Crypto") |
| data-amount-usd | number | Override amount in USD |
| data-theme | light|dark | Button color theme |
| data-blockchains | JSON array | Supported chains (future use) |
Saved in localStorage per environment
Override default amount
Zero JavaScript required - just HTML attributes!