CHAT WIDGET

Drop-in conversational lead capture for any real estate site. Streams qualified leads directly to your CRM. Zero dependencies, zero framework lock-in.

VERSION

v0.4.2

LICENSE

MIT

STACK

TS · WEB COMPONENT

UPDATED

2 weeks ago

VIEW ON GITHUB → HAVE US BUILD IT →

OVERVIEW.

A custom element you drop into any page. No React, no Vue, no build step required. It hosts a conversation, qualifies the lead, and pushes structured contact data into Follow Up Boss, Real Estate Webmasters, or HubSpot the moment the user hits send.

INSTALL.

index.html HTML

<!-- 1. Load the widget -->
<script src="https://cdn.ballistic.dev/chat-widget@0.4/widget.js"></script>

<!-- 2. Drop it anywhere -->
<ballistic-chat
  agent-id="agt_2J3K..."
  crm="fub"
  theme="dark"
></ballistic-chat>

FEATURES.

F-01

WEB COMPONENT

Single custom element. Works in WordPress, Webflow, raw HTML, Next.js, anything that renders DOM.

F-02

CRM STREAMING

Out-of-the-box adapters for Follow Up Boss, REW, HubSpot. Custom webhook target for everything else.

F-03

OFFLINE QUEUE

Network drops are buffered to IndexedDB and replayed. You never lose a lead to a flaky connection.

F-04

PROMPTABLE

Define qualification flows in plain text. The widget will follow them, ask follow-ups, branch.

F-05

THEMEABLE

All visual surfaces exposed as CSS variables. Drop it in your design system, match your brand.

F-06

A11Y NATIVE

Keyboard navigation, screen reader labels, focus traps. Tested with NVDA, JAWS, VoiceOver.

QUICKSTART.

qualification-flow.js JAVASCRIPT

// Configure the qualification flow programmatically
const widget = document.querySelector('ballistic-chat');

widget.configure({
  greeting: "Looking to buy or sell in the next 6 months?",
  qualify: ['timeline', 'budget', 'preApproved', 'neighborhood'],
  onQualified: async (lead) => {
    await pushToCRM(lead);
    bookCalendar(lead.contactId);
  }
});

CONFIGURATION.

KEY	TYPE	DESCRIPTION
agent-id REQ	string	Your Ballistic agent identifier. Generated in the admin dashboard.
crm REQ	"fub" \| "rew" \| "hubspot" \| "webhook"	Destination CRM. Use "webhook" with a custom URL for anything else.
theme	"dark" \| "light" \| "auto"	Visual mode. Defaults to "auto" — follows the page color scheme.
position	"br" \| "bl" \| "inline"	Where the widget docks. Use "inline" to render in-flow inside a container.
webhook-url	string	POST target for qualified-lead events. Required when crm="webhook".
locale	string	BCP-47 tag. en-US, en-CA, fr-CA supported out of the box.

USE CASES.

USE-01

AGENT WEBSITES

Pin to the bottom-right of every page. Captures buyer and seller intent from organic and paid traffic.

USE-02

LISTING PAGES

Inline mode on individual MLS detail pages. Pre-fills property context into the conversation.

USE-03

LANDING PAGES

Replace your contact form. 4x conversion on neighborhood and CMA landers vs. static forms.

USE-04

OPEN HOUSE QR

Print a QR. Visitors scan and qualify themselves on their phone. No clipboard required.

Need this built for your team? We do that too.

TALK TO ENGINEERING →