Putting it live

Install

Create a workspace, add your domain, and go live once the agent is published. Your site’s page in the workspace shows the exact tag with your own site id in it.

<script src="https://app.synconone.com/widget/v1/loader.js"
  data-site-id="site_your_id" async></script>

The loader fetches your site’s configuration, then loads the versioned bundle it names. Nothing renders until both have arrived, and the whole thing lives in a shadow root, so your styles never leak in and its styles never leak out.

The script tag

If your site sends a strict Content Security Policy, allow the platform origin in script-src and connect-src. The workspace tells you when a page could not reach it.

JavaScript API

The loader installs window.SynconLead immediately and queues anything you call before the bundle is ready, so you can drive it from your own page without waiting for it to load.

SynconLead.open()                  // open the panel
SynconLead.close()                 // close it
SynconLead.ask("Do you deliver to Leeds?")   // open it and ask, as the visitor

SynconLead.identify({              // attach a customer you already know
  name: "Priya Nair",
  email: "priya@example.com",
})

SynconLead.event("pricing_viewed", { plan: "growth" })
SynconLead.setMode("human")        // ask for a person directly

ask is the useful one. Put it behind a “Question about this product?” button and the customer arrives in a conversation that has already started, rather than an empty panel they have to think of something to type into.

Embedded placement

Give the tag a data-embed selector, or choose the embedded layout in the studio, and it renders inside your page as part of the layout: a support page, a product page beside the options, a section of your documentation.

<div id="assistant" style="min-height: 640px"></div>
<script src="https://app.synconone.com/widget/v1/loader.js"
  data-site-id="site_your_id" data-embed="#assistant" async></script>

Known customers

Visitors are anonymous until they tell you who they are. Three things change that: the pre-chat step if you enable it, the agent asking when a conversation warrants it, or your own site calling identify after someone signs in. All three write to the same customer record, and the conversation then follows the person rather than the browser.

Knowledge and handover

The agent answers from what you give it: crawled pages, uploaded documents and articles written in the workspace. Every answer records its source. When it has nothing, it says so, and the question is collected as a gap for your team to close once.

A customer can ask for a person at any point, and the agent offers one when your rules say it should. The request reaches your whole team; one person joins, the agent steps back, and the conversation continues with everything already in it.

Your own environment

The platform is an application, a worker and a Postgres database. It ships with a compose file that runs all three. Provide a database URL, an authentication secret, the public URL and a key for at least one model provider.

cp .env.example .env    # database, auth secret, public URL, a provider key
docker compose up -d
# open the app, create the first workspace, add a site

Your customer data stays in your database. If the platform and your marketing site are on different domains, set data-api-base on the tag. Upgrades are a pull and a restart; migrations run on start.

More on security, access control and data handling.