# Веб-виджет

Встройте AI-чат-виджет на сайт клиента, подключив его из каталога «Интеграции»

> Full REST + WebSocket API reference: https://api.happ.tools/reference

Подключение веб-виджета добавляет AI-чат на сайт вашего клиента, и посетители общаются с агентом, не уходя со страницы. Виджет создаётся и управляется из каталога **Интеграции** через модальное окно, как и любой другой канал.

<WidgetPageDemo />

## Подключение [#connect]

1. В **Интеграциях** в разделе **Мессенджеры** нажмите плитку **Widget**.
2. В окне подключения виджета заполните:
   * **Название виджета** — подпись, по которой вы узнаете этот виджет.
   * **Описание** (необязательно) — где он работает.
   * **Разрешённые origins** — сайты, которым разрешено загружать виджет, каждый полным адресом (`https://example.com`), добавляются кнопкой **Добавить** или Enter. Оставьте список пустым, чтобы разрешить любой сайт.
3. Нажмите **Подключить**, чтобы создать виджет.
4. Возьмите код для встраивания с карточки виджета в разделе **Мои интеграции**: **Скопировать код** в её меню сразу копирует его, **Редактировать** показывает его в блоке **Код для встраивания**. Вставьте его перед `</body>` на каждой странице, где должен появляться виджет.
5. Назначьте виджету AI-агента.

## Настройка [#customize]

Внешний вид и установка настраиваются в агенте, которому назначен виджет: откройте агента → **Виджет**. На странице **Веб-виджет** четыре вкладки — **Внешний вид**, **Голос и контент**, **Поведение** и **Установка**. **Установка** даёт фрагмент кода для HTML, Google Tag Manager, WordPress или Shopify и хранит список **Разрешённых доменов** (добавляйте домены без протокола, например `example.com`, кнопкой **Добавить домен**); у каждого домена видно, работает ли на нём уже виджет.

## Поля [#fields]

| Поле                | Значение                                                                                                                                                                |
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Название виджета    | Подпись для виджета                                                                                                                                                     |
| Описание            | Необязательная заметка о том, где он работает                                                                                                                           |
| Разрешённые origins | Сайты, которым разрешено его загружать. Пустой список или `*` — любой сайт. Домен охватывает и свои поддомены; `localhost` работает всегда. Остальные сайты отклоняются |

**API:** [api.happ.tools/reference](https://api.happ.tools/reference)

## Дальше [#next]

* [Каналы](/docs/integrations/messengers) — все мессенджеры
* [Агенты](/docs/agents) — настройте, кто отвечает