Home / Docs / Demo Agent Setup

Demo Agent SetupCopy link to this section

Setting up the demo automation agent takes about 20 minutes once you have your site configured. The agent needs content to know your product and capabilities to structure what it shows.

PrerequisitesCopy link to this section

Before configuring the demo agent, make sure you've completed these steps:

  1. Site created: You need a site in the dashboard pointed at your product's URL. See Sites if you haven't done this yet.
  2. Content ingested: The agent's product knowledge comes from your documentation. Add at least your docs site and one other content source (knowledge base, videos, etc.) via ingestion.
  3. Demo context prepared: Capabilities tell the agent what your product can do. Floe prepares them after ingestion. See Capabilities.

If you haven't completed these steps, follow the Quickstart first. The demo agent won't have enough context to run a useful session without all three in place.

For facts that do not appear in those sources, an Owner or Admin can add a Reference Guide under Product Knowledge → Reference guides. Ready guides improve answers in the Demo and Website agents, but they never make the agent navigate and do not make a site demo-ready by themselves.

Configuring the demo experienceCopy link to this section

Open Demo Agent → Configure in the dashboard. The page has five cards, and each card saves independently:

  • Languages & voices picks which languages this agent speaks and the voice for each. English only, unless you enable Hindi. This is where the session's voice comes from — not the Persona card. See Languages & Voices.
  • Persona & tone controls this agent's identity, tone, answer length, and pace. Warm Guide is the default; Witty Peer, Crisp Expert, and a 500-character custom tone are also available. Identity is optional (120 characters), answer length defaults to Medium, and pace defaults to Brisk.
  • Discovery & Opening selects None (the default), BANT, MEDDIC, MEDDPICC, Challenger, SPIN, Sandler, Gap Selling, or a custom framework of up to 2,000 characters. Add up to eight qualification questions (240 characters each). The agent weaves them across the demo and asks at most one before showing the product.
  • Ask for their details controls which contact details the agent collects and when. It defaults to email and name in a form Before the demo starts. Choose name, phone, email, company, or role, mark individual fields Required, and pick a Phone region if you ask for phone. The other timings ask in conversation: after the intro, after the first feature, or when a full walkthrough is requested. See Ask for their details.
  • Opener chips are the one-tap starting points shown when the demo connects. Add, reorder, or remove up to six chips (100 characters each), or leave the list blank to derive suggestions from your guides.

Logo, accent color, and the booking CTA are shared across agents and live in the site's Settings, not on this page. There is no featured/hidden feature list on Configure: what the agent can show comes from your capabilities and guides.

Demo environment and loginCopy link to this section

The agent runs against a live instance of your product, signed in as an account you provide. This is configured under Settings → Product credentials, not on the Configure page.

  • Demo/App Domain — the origin the demo starts on. This one lives under Settings → General → Domain Configuration, not on the credentials tab. Use a demo environment or sandbox, never production. Left blank, Floe falls back to the login URL's origin and then your primary domain — so set it.
  • Login URL — where the agent signs in.
  • Demo account email and password — the account the agent uses. Credentials are encrypted at rest.

The first time you enter a demo account email, Floe asks you to confirm that you're authorized to let an automated agent sign in as this account.

Add credentials after the site exists, not while creating it. The create-site dialog has fields for them, but saving credentials requires the authorization step above, which that dialog doesn't ask for. Leave them blank there and fill them in from Settings once the site is created.

Two limits worth knowing before you pick an account:

  • The demo agent cannot complete an MFA challenge. Use an account with MFA disabled.
  • The demo account needs a password. A magic-link-only account cannot be used for demos.

The agent acts as this user. It will not invite or remove people, change permissions, connect integrations, or send messages. It can open forms and fill in fields to show how a workflow works, but it cannot click the control that would commit the change — Save, Submit, a final Create confirmation, Download, or Export — and it cannot take a destructive or account action (delete, deactivate, cancel subscription, billing, log out). These blocks are unconditional and apply to every product. Use a low-privilege account anyway, as a second line of defense — see Security & Privacy for the full guardrail.

Invest time in your demo data. An empty state kills momentum. The best demo environments have realistic sample data that makes features look like they're already in use.

Integrate with a coding agentCopy link to this section

Paste this into your coding agent after replacing the two placeholders with the values from your site settings:

Integrate Floe's Demo Agent into this website.

Requirements:
- Use Floe's hosted browser SDK at https://cdn.floe.so/floe-sdk.iife.js.
- Load the SDK and a same-origin /floe-init.js file as external deferred scripts, in that order. Do not add inline JavaScript.
- In /floe-init.js, initialize Floe exactly once with clientKey: "YOUR_CLIENT_KEY", demoMode: true, demoSiteId: "YOUR_SITE_ID", and embedMode: "docked".
- Keep the object returned by Floe() in a const named floe.
- If the site has a "See it live" button, wire it to await floe.requestDemo(). Preserve the site's existing booking or navigation fallback when that method returns false.
- If the docked embed should catch desktop exit intent, add exitIntent: true or an object with the desired dwell and top-edge threshold. Do not use exit intent with a fullscreen embed or start a session from the exit signal.
- Do not set websiteAgent. Do not add product API access or host-page DOM capture; this mode drives Floe's server-side demo browser.
- If the framework owns a client-side mount lifecycle, initialize once in the site shell and call floe.disconnect() only when that integration is permanently unmounted.
- Report the files changed and how to verify the docked pill, CTA, microphone flow, fallback, and teardown.

Canonical embedCopy link to this section

Add the two external scripts near the end of <body>. Keeping initialization in your own file works with a strict Content-Security-Policy:

<!-- Allow https://cdn.floe.so in script-src. -->
<script src="https://cdn.floe.so/floe-sdk.iife.js" defer></script>
<script src="/floe-init.js" defer></script>
// /floe-init.js — served from your own origin
const floe = Floe({
  clientKey: "YOUR_CLIENT_KEY",
  demoMode: true,
  demoSiteId: "YOUR_SITE_ID",
  embedMode: "docked",
});

floe.ready.catch((error) => console.error("Floe failed to initialize", error));

document.querySelector("#see-it-live")?.addEventListener("click", async () => {
  if (!(await floe.requestDemo())) {
    window.location.assign("/book-a-call");
  }
});

requestDemo() resolves true only when a mounted agent handled the request. Keep the fallback: a site without a runnable demo, an invalid configuration, or an SDK that did not boot should never leave the visitor with a dead button.

Add exit intent to a docked demoCopy link to this section

Exit intent re-opens the docked intro pill, once, when a desktop visitor moves to leave. It is off by default and not available in fullscreen mode:

const floe = Floe({
  clientKey: "YOUR_CLIENT_KEY",
  demoMode: true,
  demoSiteId: "YOUR_SITE_ID",
  embedMode: "docked",
  exitIntent: {
    minTimeOnPageMs: 5000,
    thresholdPx: 20,
  },
});

exitIntent: true uses those defaults. Showing the pill does not start a session, request the microphone, or send a message; the visitor still has to interact with it. See Browser SDK: Exit intent for the runtime methods and return values.

Runtime configurationCopy link to this section

  • clientKey (string, required) is the public browser key from site settings.
  • demoMode (true, required) selects the Demo Agent. If both agent flags are present, demo mode wins.
  • demoSiteId (string, required) selects the product site whose demo browser should start.
  • embedMode ("docked" or "fullscreen") defaults to "docked". Use "fullscreen" only when the entire page is dedicated to the demo.
  • exitIntent (true or object) is available only with embedMode: "docked". The object accepts enabled, minTimeOnPageMs, and thresholdPx.
  • prospectEmail (string) pre-fills the work-email step. The prospect must still start the demo themselves.
  • userInfo (object) pre-fills prospect context such as name, phone, company, and designation (shown as role). Give phone in international format, including its country code. It is unverified browser input.
  • demoCalendarLink (string) overrides the booking URL configured for the site. It must use HTTPS. Cal.com, Calendly, and Schedule Hero open inside the follow-up screen; other schedulers open separately. An explicit {email} query value enables email prefill.
  • enableAudio (boolean) defaults to true; debug (boolean) defaults to false.

See the Browser SDK for the shared API and lifecycle methods.

Create prospect-facing demos from Demo Agent → Demo Links:

  1. Click New demo link.
  2. Optionally add the prospect's name, work email, phone, company, and role. Include the phone's country code. You can also override the site's booking link with an HTTPS URL or set an expiry date.
  3. Click Create preview link. Every new link starts as a private preview.
  4. Open the preview and QA the complete experience before sharing it.
  5. Publish the link when it is ready, then copy and send it to the prospect.

Publishing is a toggle, not a deploy. You can return a published link to preview status, and edits to its prospect context, booking link, or expiry apply immediately without republishing.

Prospect context is optional. When provided, the agent can personalize its opener and frame the demo around the prospect's company and role, and it does not ask again for a detail the link already supplies. Without it, the agent starts broadly and adapts to the prospect's live questions.

Sessions are read-only historyCopy link to this section

Use Demo Agent → Sessions to review session history. It is not where you create, preview, or publish demo links.

Verifying your setupCopy link to this section

Before sharing a demo link with a prospect, test its private preview yourself:

  1. Create a link from Demo Agent → Demo Links and open its private preview.
  2. Confirm the agent can log into the configured demo environment.
  3. Ask it to show a few important capabilities and verify the navigation and explanations.
  4. Ask about a topic outside its current knowledge and confirm it responds appropriately.
  5. If you added a Reference Guide, ask about that fact and confirm the agent answers without navigating because of it.
  6. Interrupt the agent mid-explanation and confirm it adapts.
  7. Test identity capture and the booking CTA using the settings you configured.
  8. If you enabled exit intent, wait for the dwell time and move the pointer out through the top of the window. The pill should expand once, with no session or microphone prompt until you interact.
  9. Publish the link only after the preview passes QA, then open the published URL once more before sending it.

Things to watch for:

  • Navigation failures: The agent can't find a screen or clicks the wrong element. Update the relevant source content and re-run ingestion.
  • Inaccurate explanations: The agent says something wrong about your product. Check your ingested content for gaps or outdated information, and use a Reference Guide for a small authoritative fact that is missing from those sources.
  • Missing capabilities: The agent can't address a topic you expected it to know. Verify that relevant documentation was ingested.

After a content change, re-run ingestion and tell us: the generated demo context is refreshed by Floe on request, not automatically.

What's nextCopy link to this section

FAQCopy link to this section

Can I run multiple demo sessions at the same time? Yes. Each session is independent with its own browser instance.

Do I need a separate demo account for each session? A single demo account works for concurrent sessions as long as the demo data doesn't conflict. If sessions modify data (e.g., creating records), consider separate accounts to keep each session clean.

What happens if my product is down during a demo? If your demo environment is unreachable, the session can't proceed.

Can prospects interact with the product directly? No. The agent controls the browser while the prospect watches and talks.

Can I use exit intent on a fullscreen demo page? No. Exit intent is for a dormant marketing surface, so it supports the Website Agent and docked demo embeds only.