# Add the Web Chat widget to your website

> Add a widget in Channels > Web Chat, copy the script from Install, and paste it once before the closing body tag of your website.

Source: https://useline.io/help/messaging/web-chat  
Section: Messaging channels  
Last updated: 2026-11-05  
Roles: Owner, Admin

The Web Chat widget puts a chat on your website. Visitor messages come into the shared **Inbox**. To install it, you copy one script tag from Line and paste it into your website.

## Before you start

- You need the **Owner** or **Admin** role to set up a widget.
- You need access to your website's HTML or to its tag manager.

## Add a widget

If **Channels** > **Web Chat** already lists a widget, go to the next section.

1. Go to **Channels**, then open **Web Chat**.
2. Select **Add a widget**.
3. Type a **Name**, for example "Main website".
4. Select **Create**.

Line opens the page for the new widget. You can add more than one widget, for example one for each website.

## Set where the widget shows

1. Open the widget in **Channels** > **Web Chat**.
2. In the widget menu, select **Widget**.
3. Set the fields:
   - **Style** — **Chat bubble** or **Ask bar**.
   - **Allowed domains** — one domain per line, for example example.com. A parent domain also allows its subdomains. If you leave this empty, the widget works on any site.
   - **Launcher placement** — **Floating launcher**, **Custom trigger only**, or both.
   - **Custom trigger selector** — shows when you use a custom trigger. Add this selector, for example `[data-line-chat]`, to any button or link that must open the chat.
   - **Hide launcher on pages** (**Hide ask bar on pages** for the ask bar) — one page path per line, for example /checkout. Use `*` for any text: /account/* covers every page under /account.
   - **Position** — **Bottom right** or **Bottom left**. This field is not shown for the ask bar.
4. Select **Save changes**.

Use **Appearance** and **Conversation** to set the colours, the avatar, the greeting and the suggested questions. The **Preview** shows the real widget with your changes.

## Install the widget

1. Open the widget in **Channels** > **Web Chat**.
2. In the widget menu, select **Install**.
3. Select **Copy** to copy the script tag.
4. Paste the script tag one time on each page, before the closing `</body>` tag. If you use a tag manager, add it as a custom HTML tag on all pages.
5. Publish your website.
6. Open your website and check that the launcher shows.

The chat panel loads only after a visitor selects the launcher.

> **Important:** The script tag contains the launcher placement and the custom trigger selector. If you change either of them, copy the script tag again and replace the old one on your website.

## Answer chats

Chats appear in the **Inbox**. To see only chats, select **Web Chat** under **Views**.

The widget's workflow decides who answers first. To see or change it, open the widget and find **Handled by**. Select **Edit workflow**.

When your agent handles a chat, the Inbox shows "Line is handling this conversation." above the composer. To answer the visitor yourself, select **Take over**. To give the chat back to the agent, open the actions menu (three dots) and select **Return to AI**.

You can send files in a live chat.

## Turn off a widget

1. Open the widget in **Channels** > **Web Chat**.
2. In **Turn off this widget**, select **Turn off**.

The widget then does not load on your website. Its conversations stay in the Inbox. Select **Turn on** to start it again.

## Common problems

**The launcher does not show on the website.** Check these items:

- The widget is on. Its status in **Channels** > **Web Chat** is **Live**, not **Turned off**.
- The website domain is in **Allowed domains**, or the list is empty.
- The page is not in the list of hidden pages.
- With **Custom trigger only**, no floating launcher shows. The chat opens from your own button.

**The custom button does not open the chat.** The selector on the button must match the **Custom trigger selector**. Copy the script tag again after you change the selector.

## Related articles

- [Use the shared Inbox](https://useline.io/help/inbox/shared-inbox.md): The Inbox holds every customer conversation on SMS, calls, WhatsApp, email and Web Chat in one list. Open a conversation to read it, reply, or close it.
- [Set up what happens when a message comes in](https://useline.io/help/workflows/message-workflows.md): A message workflow starts with Message received. Filter by channel, endpoint, keywords or contact, then add an Agent step, an email or a text.
- [Hand a conversation over to a person](https://useline.io/help/ai-agents/hand-over-to-a-person.md): Add handover rules in the agent's Procedures tab. When a rule matches, the conversation waits for your team. You choose if the agent keeps answering while the customer waits.
- [Send and reply to text messages](https://useline.io/help/messaging/send-sms.md): Send an SMS from the Inbox with New message, or reply in the conversation. Texts leave from your Line number and cost credits per segment.
