Chat Widget

Your website's chat interface

The Chat Widget (configured at Settings > Chat Widget) is the floating chat button and conversation window that appears on your website. It's how your visitors start a chat conversation with your AI assistant or your team.

Getting the widget right is important — it's often the first interaction a customer has with your AI.

Installation

To add the widget to your website:

1. Go to Settings > Chat Widget.
2. Copy the installation code snippet.
3. Paste it into the head or just before the closing body tag of every page where you want the widget to appear.

The widget will load automatically once the script is on the page.

Appearance

Widget position

Choose where the chat button appears on the page — bottom-right or bottom-left. Bottom-right is the most common convention and what most visitors expect.

Greeting message

Set the message that appears in the chat window when a visitor first opens it. A good greeting is welcoming and sets expectations:

"Hi there! I'm your AI assistant. Ask me anything about our products, or I can connect you with our team."

Widget color and logo

The widget inherits your brand colors and logo from Settings > Branding. You can override them here if you want the widget to use different colors from the rest of your branding.

Launch behavior

Proactive triggers

You can configure the widget to open automatically based on visitor behavior:

• Time on page — Open after the visitor has been on the page for X seconds.
• Scroll depth — Open when the visitor scrolls to a certain percentage of the page.
• Exit intent — Open when the visitor moves their cursor toward the browser's close button.
• Specific pages — Only trigger on certain URLs (e.g., your pricing page or checkout).

Use proactive triggers carefully — an intrusive widget that pops up immediately can hurt more than it helps.

Allowed domains

For security, you can restrict the widget to only load on specific domains. This prevents someone from copying your installation code and embedding your widget on their own site.

The JavaScript API

For more advanced integrations, Autoch.at provides a JavaScript API that lets you control the widget programmatically from your website's code.

Opening and closing the widget

// Open the chat widget
AutochatWidget.open();

// Close the chat widget
AutochatWidget.close();

Identifying the visitor

If you know who the visitor is (for example, they're logged into your app), you can pass their identity to Autoch.at so the conversation is automatically linked to their client record:

AutochatWidget.identify({
  name: "Jane Smith",
  email: "jane@example.com",
  phone: "+1-555-0100"
});

Passing custom attributes

You can also pass custom data that will be available to your AI assistant and visible in the conversation detail:

AutochatWidget.setAttributes({
  plan: "Pro",
  accountId: "ACC-12345"
});

This is particularly useful for support scenarios — your AI can greet the customer by name and already know their account details before they say a word.