LogoLogo
Back to Dript
  • Welcome to Dript
  • Integration Requirements
  • Dript Flows
  • Quick Start Guide
  • Dript Buttons
  • Development (sandbox)
  • Direct URL Integration
  • FAQ
Powered by GitBook
On this page
  • SDK Integration
  • Automatic Initialization (Simple)
  • Manual Initialization (Advanced)
  • Import in JavaScript Frameworks (ES Modules)
  • Disable Auto Initialise
  • Properties
  • Shared Properties
  • Deposit Flow Properties
  • Withdraw Flow (coming soon)

Quick Start Guide

PreviousDript FlowsNextDript Buttons

Last updated 9 days ago

Easily integrate Dript in less than 10 mins.

Looking for direct URL integration? See our guide.

SDK Integration

Dript makes it easy to embed wallet functionality into your product. Our SDK is designed for flexibility — whether you want a simple drop-in button or full programmatic control.

Automatic Initialization (Simple)

The fastest way to get started. Just include the script and the HTML element where you want the Dript widget to appear:

<!-- Include Dript SDK -->
<script src="https://cdn.dript.money/dript.min.js"></script>

<body>
  <div id="dript" data-walletAddress="0x000000" />
</body>

Manual Initialization (Advanced)

Need more control over when and how the widget is initialized? Disable auto-init and call it manually:

<!-- Disable auto-initialization -->
<script src="https://cdn.dript.money/dript.min.js" data-auto-init="false"></script>

<body>
  <div id="dript" />
</body>

<script>
  const widget = new DriptWidget({
    walletAddress: "0x0000000000"
    // ...other options
  });

  // Or use the window helper
  window.initDriptWidget({ 
    flow: "deposit", 
    walletAddress: "0x0000000000"
  });
</script>

Import in JavaScript Frameworks (ES Modules)

Coming soon

Our NPM package will be available soon.

Installable NPM package for React, Vue, Angular, and other modern frameworks.

npm install dript-widget
pnpm add dript-widget
yarn add dript-widget
import DriptWidget from 'dript-widget';

const widget = new DriptWidget({
  walletAddress: "0x0000000000"
  // ...other options
});

document.querySelector("#pay-button").addEventListener("click", () => {
  widget.openModal();
});

Disable Auto Initialise

You can disable auto-init in two ways:

1. Script attribute

<script src="https://cdn.dript.money/dript.min.js" data-auto-init="false"></script>

2. Global window flag

<script>
  window.disableDriptAutoInit = true;
</script>

Properties

The DriptWidget accepts several properties for customization. You can pass them via:

  • JavaScript config (e.g. new DriptWidget({ ... }))

  • HTML attributes (e.g. <div data-buttonText="Deposit Now">)

Shared Properties

Common across all flows — includes styling, button text, modal behavior, etc.

Option
Description
Required
Type
Default
Dript IFrame

environment

The environment you want to utilise, its important to select the correct environment.

enum['sandbox','production']

production

flow

Defines the initial flow for the widget

enum['deposit,withdraw']

deposit

partner

Partner name to display in the flows.

string

❌

partnerLogo

Partner icon (64px x 64px) url.

string

❌

targetSelector

The ID of the selector to attach the launch modal event to.

string

#dript

buttonStyle

Style of the button

enum['style-1','style-2','style-3'

style-1

buttonText

The copy inside the button

enum['text-1','text-2','text-3']

❌

Deposit Flow Properties

Custom options specific to the deposit experience (e.g. default amount, wallet address, etc.)

Option
Description
Required
Type
Default
Dript IFrame

walletAddress

The partner.com final wallet address to deposit into.

string

❌

depositAmount

The amount prefilled to deposit in fiat currency

number

❌

fiatCurrency

The deposit currency you would like to default, these are our supported deposit currencies.

enum['AED', 'AUD', 'BRL', 'CAD', 'CHF', 'CLP', 'COP', 'CZK', 'DKK', 'EUR', 'GBP', 'HKD', 'IDR', 'INR', 'JPY', 'KRW', 'MXN', 'NOK', 'NZD', 'PHP', 'PLN', 'QAR', 'RON', 'SAR', 'SEK', 'SGD', 'THB', 'TRY', 'TWD', 'USD', 'VND', 'ZAR', 'NGN']

USD

network

The network to transact on. Currently we only accept base & base sepolia (testnest)

enum['BASE']

BASE

destinationToken

The destination token that will be depositted to the walletAddress. Currently we only accept USDC

enum['USDC']

USDC

Withdraw Flow (coming soon)

Properties for enabling the upcoming withdrawal experience, including off-ramp destination and wallet selection.

Direct URL Integration