dhango
dhango.
Embedded Sign-Up · How-To

Embed the dhango sign-up flow inside your own site.

dhango's merchant onboarding runs inside an iframe on your page — inline or as a modal — styled to match your brand and driven by a small JavaScript SDK. Your platform pre-fills what it already knows, controls which fields and steps the applicant sees, and gets a webhook the moment onboarding finishes.

Your backend creates a session → Your page embeds the flow → Events stream to your page → Webhook on completion

Try every capability in the interactive test harness

Toggle features, restyle the flow live, drive navigation from the host page, watch the postMessage traffic in real time, and copy the exact embed code for your configuration.

Open the test harness →

Integrate in three steps

1

Create a session (server-side)

POST /v1.0/applicationSessions with your API key. Pre-fill contact and organization data, lock fields read-only, skip steps, and set a theme — the session's configuration is authoritative.

2

Embed with the SDK

Load embed.js from the sign-up origin and call Dhango.signup(...) with the session id — inline in a container or as a modal overlay. The iframe sizes itself and closes itself on completion.

3

Listen and react

Typed events stream to your callbacks (steps, validation, completion — identifiers only, never applicant data). Your webhook endpoint is notified when onboarding finishes, before account activation.

<!-- Load the SDK from the sign-up origin, then: -->
var signup = Dhango.signup({
  container: '#signup-slot',          // or mode: 'modal'
  sessionId: '<from POST /v1.0/applicationSessions>',
  config: { theme: { primaryColor: '#0057ff', fontFamily: 'Poppins' } },
  onComplete: (e) => showThankYou(e.sessionId),
});

What you control

Theming

Background, card, text, and accent colors, border radius, font size, and any Google Fonts family — applied inside the iframe so the flow blends into your site.

Pre-fill & read-only fields

Send what you already know on the session — contact, organization, tax id, entity type — and mark fields read-only. Locked values are enforced server-side.

Skip steps

Waive steps your platform handles elsewhere. A session with a complete contact can even skip straight past step one.

Host-driven navigation

Hide the flow's own chrome — stepper, Next/Back, language menu — and drive it from your page with promise-returning SDK commands (next(), back(), getState()).

Localization

English, Spanish, German, and French. Pass the language in with the embed or switch it live with setLanguage().

Events & webhooks

A versioned, bidirectional postMessage protocol with strict origin checks, plus HMAC-signed webhooks for onboarding-finished and account activation.

Security model: framing is allowed only for origins your platform has registered (CSP frame-ancestors from a runtime allowlist); every message crosses the boundary with a strict origin check and carries identifiers only — never applicant data. Read-only and skip-step configuration set on the session is enforced by the API, not just the UI.