# Веб-віджет

Вбудуйте 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)

## Далі [#далі]

* [Канали](/docs/integrations/messengers) — усі месенджери
* [Асистенти](/docs/agents) — налаштуйте, хто відповідає