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

# How to integrate your Agent with Chatwoot

> Enable live chat functionality in your chatbot using Chatwoot integration.

The Chatwoot integration element allows you to open a Chatwoot widget, enabling users to directly communicate with a human. This feature adds a **Live Chat** layer to your **Agent Dialog** on *release0.com*.

## Requirements

To use this integration, ensure the following prerequisites are met:

**Chatwoot Account**: Create an account on [Chatwoot](https://www.chatwoot.com).
**Website Inbox**: Set up a "Website" inbox in your Chatwoot account.

### Steps to Create a Website Inbox

1. Log in to your Chatwoot account.
2. Navigate to the **Settings**.
3. Select **Inboxes** and click on **Add Inbox**.

<Frame style={{ maxWidth: '800px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/BMYN_fruDBtiWNDa/images/elements/integrations/chatwoot/chatwoot-setup-add-inbox.png?fit=max&auto=format&n=BMYN_fruDBtiWNDa&q=85&s=78bbe2376fc01dac413fe77db74000b8" alt="Release0.com - Chatwoot setup add inbox" width="2936" height="1544" data-path="images/elements/integrations/chatwoot/chatwoot-setup-add-inbox.png" />
</Frame>

4. Then in the **Choose channel** section, select **Website**.

<Frame style={{ maxWidth: '800px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/BMYN_fruDBtiWNDa/images/elements/integrations/chatwoot/chatwoot-setup-select-website.png?fit=max&auto=format&n=BMYN_fruDBtiWNDa&q=85&s=6d08941bbadcdc3577f0f9730750a3b8" alt="Release0.com - Chatwoot setup choose channel" width="2332" height="1452" data-path="images/elements/integrations/chatwoot/chatwoot-setup-select-website.png" />
</Frame>

5. Fill in the required details, such as the inbox name and website URL.
6. Click on **Create Inbox** to finalize the setup.
7. Then copy your **Website Token** from the **Inbox Settings**. This will be used to connect your **Chatwoot element** in your agent flow with your Chatwoot.

<Frame style={{ maxWidth: '800px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/BMYN_fruDBtiWNDa/images/elements/integrations/chatwoot/chatwoot-setup-inbox-ready.png?fit=max&auto=format&n=BMYN_fruDBtiWNDa&q=85&s=7fbabb2598653ebc2178a9db610c4db9" alt="Release0.com - Chatwoot setup create inbox" width="2252" height="1334" data-path="images/elements/integrations/chatwoot/chatwoot-setup-inbox-ready.png" />
</Frame>

<Frame style={{ maxWidth: '600px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/1TZM7rGX6vnyZ5KU/images/elements/integrations/chatwoot/chatwoot-setup-element.png?fit=max&auto=format&n=1TZM7rGX6vnyZ5KU&q=85&s=ed47948adb2d643aac18ff8f0669b36d" alt="Release0.com - Chatwoot setup element" width="724" height="360" data-path="images/elements/integrations/chatwoot/chatwoot-setup-element.png" />
</Frame>

## Setup Instructions

### 1. Insert a Chatwoot element

Place the **Chatwoot element** in your **Agent Dialog** wherever you want the widget to be triggered.

<Frame style={{ maxWidth: '600px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/BMYN_fruDBtiWNDa/images/elements/integrations/chatwoot/open-chatwoot.png?fit=max&auto=format&n=BMYN_fruDBtiWNDa&q=85&s=5d2d7c6f64064c6e81e88f37d3d3ea52" alt="Release0.com - Open chatwoot" width="430" height="677" data-path="images/elements/integrations/chatwoot/open-chatwoot.png" />
</Frame>

### 2. Obtain Your Website Token

To locate your website token:

1. Go to your Chatwoot dashboard.
2. Navigate to **Inbox Settings** of your created Website Inbox.
3. Copy the **Website Token**.

### 3. Prefill User Information

You can use collected variables to prefill user information in Chatwoot by setting values in the **Set User Details** section.

* **Example**: If you set the `Email` input to `john@gmail.com`, Chatwoot will associate the email with the current user.

## Custom Attributes

Chatwoot supports custom attributes, which allow you to enhance user interactions. These attributes will be automatically filled by your **Agent Dialog**.

### Example: Result URL

You can link the current **Result URL** to the Chatwoot conversation by adding the following custom attribute:

* Applies to: Contact
* Display Name: Agent Result URL
* Key: Agent\_result\_url
* Description: Release0 result URL that points the user on Release0, before triggering the Chatwoot widget
* Type: Link

<Frame style={{ maxWidth: '400px' }}>
  <img src="https://mintcdn.com/release0-13d037a7/BMYN_fruDBtiWNDa/images/elements/integrations/chatwoot/chatwoot-custom-attributes.png?fit=max&auto=format&n=BMYN_fruDBtiWNDa&q=85&s=3ce60ec8294d50f6b39101b1cd453aa8" alt="Release0.com - Chatwoot custom attributes" width="1168" height="1174" data-path="images/elements/integrations/chatwoot/chatwoot-custom-attributes.png" />
</Frame>

## Setting User Behavior

When prefilling user information, you can specify how the user ID is handled:

1. **Default Behavior**: If the `ID` input is left empty, Chatwoot will use either:
   * The user's `Email`.
   * The `Result ID` from your **Agent Dialog**.

2. **Avoid Duplicate Contacts**: Setting the `Email` as the `ID` ensures contacts are properly merged and prevents duplicates in Chatwoot.

### Validation and Testing

Before deploying the integration, ensure the following:

* The **Chatwoot element** is correctly configured in your **Agent Dialog**.
* The **Website Token** is accurate and functional.
* Custom attributes, such as the `Result URL`, are correctly passed to Chatwoot.
* Prefilled user information appears correctly in the Chatwoot conversation.

> **Note**: If issues persist, refer to the [Chatwoot Documentation](https://www.chatwoot.com/docs) or contact their support team.
