> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hiveku.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Add a Chat to Your Website

> Put a chat button on your site in your brand colors, publish it, and answer visitors from your Helpdesk inbox

A chat button lets visitors ask a question without leaving your site. Your website assistant answers what it can and offers to pass anything else to your team, and every conversation arrives in your Helpdesk inbox.

This guide adds the chat to the Northwind site, in Northwind's colors.

## Open the chat settings

Click **Helpdesk** in the left rail, then **Setup** at the top, then **Chat widget**.

![The Helpdesk tabs with the Setup menu open: Connections, Chat widget and Settings, with Chat widget outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-01-open-widget-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=94ad84c5f671343c56d04b31e34be865)

Only account owners and admins can change these settings.

## Make it look like your brand

**1. Name it**

On the **Appearance** tab, type the name visitors see at the top of the chat, for example your business name.

![Name and picture, with the Name box filled in with Northwind Coffee and outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-02-name-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=53bcc1135024389fc265147f993af6b9)

**2. Pick your colors**

Under **Colors**, type your brand color into **Main color** (it colors the header, the chat button and the send button). **Second color** is where the header's gradient fades to. The preview on the right changes as you type.

If the page says the text is hard to read on your main color, pick a slightly darker shade, or the text color it suggests. Here the Northwind orange was darkened a little so the white text stays readable.

**3. Save**

Click **Save** at the top right.

![Main color B35624, Second color 7A3A14 and white text, with the Main color box and the Save button outlined, and the preview showing the chat in Northwind orange](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-03-colors-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=0574c87c0928254868ebd07f87349d1a)

The **Messages** tab sets the welcome text, and **Templates** offers ready-made looks.

## Add it to your site

**1. Open the Install tab**

Click **...** at the end of the tabs, then **Install**.

![The settings tabs with the extra tabs menu open: Who answers, Pre-chat and Install, with Install outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-04-install-tab-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=961da1ca4eafad114ef7120c2066b10b)

**2. Click Add chat**

Under **Your Hiveku websites**, click **Add chat** next to your site. (You can also ask the AI in the site builder to "add the Hiveku chat".)

![Your Hiveku websites: Northwind Coffee Roasters, Not added, with its Add chat button outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-05-add-chat-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=f5ceb69c50bf713f0bb548aa013ac24c)

**3. Publish your site**

The site now reads **Waiting for deploy**: the chat is saved to it and shows on the live site after its next publish. Click **Go to deploy**, then **Deploy** next to **Production** (see [Publish Your Changes](/how-tos/site-builder/publish)).

![Northwind Coffee Roasters, Waiting for deploy: Saved. The chat shows on your live site after the next deploy, with Go to deploy outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-06-waiting-for-deploy-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=4e7d7f3f184c644b096139a8dcbaf705)

![The Deploy menu with the Production row's Deploy button outlined](https://mintcdn.com/locusdigital/Jd9J8MdQ6yozPU-N/images/how-tos/site-builder/chat-07-deploy-closeup.webp?fit=max\&auto=format\&n=Jd9J8MdQ6yozPU-N\&q=85\&s=d54e29447a622cbdab297c7bc75d7f4f)

> [!NOTE]
>
> Not on a Hiveku website? The same tab has a one-line snippet to paste into any site. See [Website Chat](/helpdesk/chat-widget).

## Try it on your site

Open your live site. The chat button sits in the bottom corner, in your colors.

![The bottom-right corner of the Northwind site: the Made in Hiveku badge, and below it the round orange chat button, outlined](https://mintcdn.com/locusdigital/mIM56hvaITGhxGrD/images/how-tos/site-builder/chat-08-on-your-site-closeup.webp?fit=max\&auto=format\&n=mIM56hvaITGhxGrD\&q=85\&s=89b0ea1513b97fb48eb6e89a00640f89)

**1. Open the chat**

Click the chat button, then **Send us a message**. (**Talk live**, when it shows, starts a voice call with your assistant.)

![The open chat: Northwind Coffee, Online, Hi there, How can we help?, with the Send us a message button outlined and Talk live below it](https://mintcdn.com/locusdigital/mIM56hvaITGhxGrD/images/how-tos/site-builder/chat-09-open-chat-closeup.webp?fit=max\&auto=format\&n=mIM56hvaITGhxGrD\&q=85\&s=b62e4bd8b586ba6a2bb4759169ac9037)

**2. Ask a question**

Type a question a visitor might ask and press **Enter**. Your website assistant answers from your website pages, your help articles and your saved answers. **Talk to a person** stays under the conversation, so a visitor can reach your team at any time.

![The visitor's question Do you sell coffee subscriptions? and the assistant's answer about free shipping and the 17 dollar Explorer plan, with a link to the subscription options, outlined](https://mintcdn.com/locusdigital/mIM56hvaITGhxGrD/images/how-tos/site-builder/chat-10-answered-closeup.webp?fit=max\&auto=format\&n=mIM56hvaITGhxGrD\&q=85\&s=fb2a05af323b8274537d271fe2e54223)

## Answer chats in your inbox

Every chat arrives in **Helpdesk** > **Inbox**:

* **Assistant** lists the chats your assistant is answering.
* **Waiting for you** lists the chats that need your team: the assistant passed it on, or the visitor wrote back to you.
* **Live now** shows who is chatting on your site right now.

![The Inbox tabs with Assistant selected, and the chat from Website visitor, Assistant answering, outlined](https://mintcdn.com/locusdigital/mIM56hvaITGhxGrD/images/how-tos/site-builder/chat-11-inbox-assistant-closeup.webp?fit=max\&auto=format\&n=mIM56hvaITGhxGrD\&q=85\&s=bc0b67841470303b61ae7afb2cf5c30d)

Click a chat to read it. Under each answer you can see what the assistant searched. To answer yourself, click **Take over**, or type in **Reply** and click **Send**: replying takes the chat over from the assistant, and your reply shows in the chat on your website. Click **Resolve** when you are done, and the chat moves to **Done**.

![The conversation: The assistant is answering. Replying takes over the chat, with the Take over button, outlined; below it the visitor's question and the assistant's answer with Searched help articles and Searched the website](https://mintcdn.com/locusdigital/mIM56hvaITGhxGrD/images/how-tos/site-builder/chat-12-conversation-closeup.webp?fit=max\&auto=format\&n=mIM56hvaITGhxGrD\&q=85\&s=a9775efe6bbab572e0a831a80ffe3577)

For a chat waiting for your team, see [Answer a Visitor Who Asked for a Person](/how-tos/helpdesk/answer-a-waiting-visitor). To teach the assistant what it could not answer, see [Teach Your Website Assistant](/how-tos/site-builder/teach-your-website-assistant).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.