Widget

Install the widget to capture support signals and customer conversations.

The widget is HAL's customer-facing entry point. It powers the inbox, help deflection, and support signals that can influence the operator loop.

Basic install

Add the embed script to your site after you create a project in HAL.

<script
  src="https://api.chatwithhal.com/widget.js"
  data-project-id="your-project-id">
</script>

Set widget language

You can force the widget UI language from your app in two ways: directly on the embed script with data-locale, or through the JavaScript init() API.

Option 1: Use data-locale on the script tag

<script
  src="https://api.chatwithhal.com/widget.js"
  data-project-id="your-project-id"
  data-locale="de">
</script>

Option 2: Set locale in HalWidget.init()

<script src="https://api.chatwithhal.com/widget.js"></script>
<script>
  window.HalWidget.init({
    projectId: 'your-project-id',
    locale: 'de'
  });
</script>
  • locale should be a supported language code such as en, de, fr, or sl
  • An explicit locale from the embed code or init() overrides the widget's default language setting in HAL
  • If you do not set a locale, HAL falls back to the widget default language and then the browser language

What the widget feeds

  • Customer conversations in Inbox
  • Repeated support themes and friction signals
  • Help-center usage and deflection context
  • Visitor identity data when configured

CRM stage sync

When the widget sends CRM stage information, HAL treats it as a lower-authority signal by default. If your sales team has already moved a company to a later stage, widget updates will not downgrade it.

  • Default: advance_only keeps manual sales progress authoritative
  • Optional: exact applies the requested stage exactly, including intentional downgrades
  • Where to set it: Settings → Widget → CRM Stage Sync for the project default, or per request in the widget/API payload

Use exact only when your own backend is the CRM system of record and should override later stages.

Push deal value from your app

If your product already knows the value of a trial, quote, or expansion, you can push that data into HAL from the widget script after the visitor has been identified.

<script
  src="https://api.chatwithhal.com/widget.js"
  data-project-id="your-project-id">
</script>
<script>
  await window.HalWidget.identify({
    email: 'buyer@example.com',
    company: { name: 'Acme' }
  });

  await window.HalWidget.setDeal({
    deal_value: 12000,
    stage_name: 'Qualified'
  });
</script>
  • deal_value writes to the linked company record in HAL CRM
  • stage_name is optional and follows the same precedence rules as setStage()
  • The visitor must already be linked to a contact/company, which usually means calling identify() with an email first

Reset identity on logout

If your app supports login/logout, reset the widget when the user signs out. This clears the current browser-side widget identity and remounts the widget with a fresh anonymous visitor so the next user can be identified cleanly.

// After your app logs the user out
await window.HalWidget.resetIdentity();

// Later, after a different user logs in
await window.HalWidget.identify({
  user_id: 'user-456',
  email: 'new-user@example.com',
  user_hash: 'server-generated-hmac'
});
  • Use this on shared browsers or any SaaS app where different accounts can use the same device
  • Call it before identifying the next user
  • It resets the client-side widget identity; it does not delete CRM records or historical conversations in HAL

Recommended rollout

1. Install on the main product or marketing site

Start where customers and trial users actually ask questions, not on every property at once.

2. Add knowledge before expecting strong replies

The widget gets much better once your help-center and operating context are in place.

3. Keep human approval where needed

Use HAL to recommend and draft responses, then choose the level of automation you are comfortable with.

Related docs