# Livechat

A chat widget on your website. Visitors enter their name, email, and phone number, then chat with your team right away; the conversation arrives in Interaction in real time, just like WhatsApp and email.

## Creating a livechat channel

1. Go to **Manage → Channels**, click **Add channel**, then choose **Livechat** (requires access to manage channels).
2. Enter a **channel name** for your team (e.g. "Website Chat" — shown in Interaction & filters), the **title in the widget** (the business name visitors see), and a **theme color**, then click **Create livechat**.
3. Copy the **embed code** and paste it into your site right before `</body>`, on every page where the widget should appear.
4. Click **Try on a sample page**: a sample store with your widget installed. Test conversations arrive in Interaction as usual, so you can use it to train your team.

```
<script src="https://onix.sassly.ai/livechat.js" data-key="lc_xxxxxxxxxxxxxxxxxxxxxxxx" async></script>
```

| Site | Where to paste the code |
| --- | --- |
| WordPress | Install the "WPCode" or "Insert Headers and Footers" plugin, then paste the code into the **Footer** section. |
| Shopify | Online Store → Themes → Edit code → `theme.liquid`, paste before `</body>`. |
| Wix / Squarespace / Webflow | The Custom Code / Code Injection menu, **Footer** section (Body end). |
| Your own site | The main template (layout) before `</body>`. |

Livechat is available on every plan. One livechat channel uses one channel slot; the quota is shared with WhatsApp numbers, email addresses, and API channels (Free 1, Pro 4 channels). When you create the channel, members whose access is "selected channels" can be given access to the new channel right away.

> The key in the embed code (`lc_…`) isn't a secret because it appears in your site's HTML. To limit which sites may use it, fill in **Allowed domains** in the channel settings (the *Install & security* tab). If the code ended up on a site you don't know, click **Replace public key** — the old code stops working immediately and your site needs the new code.

## What visitors see

- A **chat button** in the bottom-right or bottom-left corner (an icon of your choice or your business logo). Clicking it opens the chat window; on phones it fills the screen. The button shows the number of new messages while the window is closed.
- **Details before chatting**: name, email, and phone number are required (numbers starting with 08 are stored as 628…). The intro text, privacy consent text, and button text can be customized.
- The **greeting** appears as the first message during business hours; outside business hours the after-hours message and the status "Outside business hours — we'll reply when we open" appear. Chats are accepted at any time.
- The **queue position** ("You're number 2 in the queue") until an agent picks up the chat, then the message "Budi joined the chat".
- Agent typing, **Read** receipts, emoji, and attachments according to the channel settings (photos only, or photos & documents; up to 10 MB per file).
- **Connection dropped?** Messages written while offline wait ("waiting for connection") and are sent automatically once the connection is back, without duplicates; team messages that arrived while offline are fetched as soon as it reconnects. If the network blocks WebSockets, the widget checks for new messages periodically.
- Visitors who come back in the same browser continue their conversation. Once a conversation is Solved/Closed, a new message opens a new conversation without filling in the details again. The session ends after 90 days without activity.
- The widget language follows the visitor's browser (Indonesian or English); texts you set are shown as they are.

## In Interaction: queue & Pick up chat

- New livechats arrive in the **Chat** tab (New) without an assignee and are visible to every member with access to that channel (team rules still apply). The channel icon is your livechat logo or the default livechat icon.
- Chats nobody has picked up **blink** with a **Waiting for pickup** marker. Members who can reply get a bell notification; the browser plays a sound and the tab title blinks — you can turn this off in **My account** → *Sound & blinking tab title for new chats*.
- **Pick up chat** (in the "The visitor is waiting to be picked up" bar above the messages and in the conversation header): the chat becomes yours and the visitor sees you join. If two agents click at the same time, only one succeeds; the other sees "Already picked up by …". **Replying without clicking Pick up chat picks it up automatically.**
- Once picked up, the conversation follows the usual rules (the team is filled in when the agent has only one Frontline team; it can be moved to another team/person). Unanswered visitor messages show the unreplied marker like other channels.
- The **Info** tab shows the visitor's details: name, email, phone number, the page where the chat started, browser & device, and whether they're **Online** (widget open) or when they were last active.
- Reply box: text, one attachment per message, emoji, templates (`/`), KB articles, and internal notes. Reactions, editing, unsending, and quoting aren't available. **Internal notes are never visible to the visitor.**
- Visitor already left the site? Replies they haven't read for 2 minutes are sent to their email (at most once every 30 minutes) — you can turn this off in the *Conversation* tab.
- Contacts are matched by email or phone number: a customer who has chatted via WhatsApp or email before lands on the same contact.

## Widget settings

Open **Settings** on the livechat channel card. The preview next to the form updates instantly as you change settings.

| Tab | Contents |
| --- | --- |
| Appearance | Channel name, widget title & subtitle (an empty subtitle = automatic online / outside-hours status), theme color (the text color on top of it is picked automatically so it stays readable), font (Inter, Plus Jakarta Sans, Poppins, Nunito, or the system font — served from Onix's own server), rounded/square corners, bottom-right/bottom-left position, chat button icon (Bubble, Two bubbles, Headset, Help, Message, Smile, Wave, or Logo), and the **logo**: shown in the widget header, as the "Logo" button icon, and as the channel icon in Interaction (square PNG/JPG/WebP, up to 512 KB). |
| Text | The intro text above the form, the privacy consent text below the form, and the Start chat button text. |
| Conversation | Attachments from visitors: off, photos only, or photos & documents. Send replies to the visitor's email (on/off). |
| Hours & auto replies | Follow the workspace business hours or use the channel's own hours, the greeting, and the after-hours message (see below). |
| Install & security | Embed code, Try on a sample page, allowed domains (one per line, subdomains included; empty = any site), and replace the public key. |

Customization is deliberately limited to choices (no free-form CSS) so the widget always stays readable and never breaks on any site. Site owners can also open/close the widget from their own button: `window.OnixLivechat.open()`, `close()`, or `toggle()`.

## Business hours & auto replies (all channels)

- **Workspace business hours** are set in **Settings → General** (all plans). Every channel — WhatsApp, email, livechat, and API channels — chooses **Follow workspace business hours** (default) or **Own business hours** in its channel settings. The time zone is always the workspace time zone.
- **Greeting**: sent once when a new conversation starts during business hours. **After-hours message**: sent when a customer writes outside business hours, at most once every 12 hours per conversation.
- Both are sent as an **Auto-reply**: they don't count as agent replies, don't reopen conversations, don't use the reply quota, and aren't part of KPIs. On WhatsApp they're a WhatsApp message, on email a reply email (never in reply to auto-replies or bounces), on livechat they appear in the widget, and on API channels they go out through the webhook.
- New livechat channels start with the greeting & after-hours message on, using default texts; other channels start with them off.
- A channel's business hours are also used to calculate response times & SLA for its conversations. Livechat has its own response target (2 business minutes by default, adjustable) — see [KPIs & SLA](https://onix.sassly.ai/en/docs/kpi).

## Demo page

Want to see the widget from the visitor's side? Open [/demo/livechat](https://onix.sassly.ai/demo/livechat): a sample store with the sample-data livechat widget installed. A workspace filled with **sample data** (at the account owner's request) also gets a "Website Chat" livechat channel with sample conversations, so the team can try the queue and Pick up chat. It's a real livechat channel — the **Try on a sample page** button on its card opens its widget.

## Security & privacy

- Visitors hold a random token stored in their browser (the storage of Onix's chat page, separate per site); Onix stores only a fingerprint (hash) of that token. The token gives no access to any other conversation.
- What's stored: name, email, phone number, the page where the chat started, and the browser/device type. IP addresses are only used to limit abuse and aren't stored. See the [Privacy Policy](https://onix.sassly.ai/en/legal/privasi); the consent text in the widget can mention your business's own privacy policy.
- Bot protection: a hidden field, a minimum time to fill in the form, a limit on chats started per IP, and message limits per visitor (30 per minute) and per channel.
- Attachments are stored privately: only that visitor and your team can open them. Visitor text is always displayed as plain text.
- Plan dropped to Free and this channel is paused? The widget doesn't appear on your site until the channel is active again.

## Not available yet

Agent online status & concurrent chat limits per agent, automatic chat distribution (round robin), satisfaction ratings, email transcripts, proactive messages ("Can we help?"), custom CSS, and an SDK for mobile apps — for mobile apps or other systems, use an [API channel](https://onix.sassly.ai/en/docs/api-channel).