# Чат-виджет на сайт в Bolt.new: установка Моночата за 2 минуты

Bolt.new собирает проекты прямо в браузере, обычно на Vite + React, иногда на Next.js или Astro. Онлайн-чат Моночата ставится одной строкой кода, и Bolt-агент вставит её по промпту. Это не встроенная интеграция Bolt, а стандартная вставка скрипта виджета. Ответы операторов и ИИ-сотрудника идут из одного окна вместе с Telegram, VK, MAX и почтой. Тариф «Старт» — 0 ₽.

## Как установить

1. Войдите на [monochat.ru/login](https://monochat.ru/login) и откройте «Каналы» → «Виджет».
2. Укажите домен, на котором будет жить сайт (адрес после публикации или свой домен), и скопируйте ключ виджета.
3. В Bolt откройте проект и вставьте промпт ниже, заменив `ВАШ_WIDGET_KEY`.
4. Опубликуйте проект и откройте сайт: кнопка чата появится справа внизу.
5. Отправьте тестовое сообщение и ответьте на него из Моночата.

## Промпт для Bolt

```text
Подключи к проекту онлайн-чат поддержки Моночат (monochat.ru), одной строкой, на всех страницах.
- Vite/React/Vue: в index.html перед </body>.
- Next.js: компонент Script из next/script в app/layout.tsx, strategy="afterInteractive".
- Astro: в общий layout перед </body>.
Строка: <script src="https://monochat.ru/widget/ВАШ_WIDGET_KEY.js" async></script>
Ключ публичный. Не добавляй скрипт дважды, не меняй остальной код.
Кнопки «Связаться» пусть открывают чат через window.Monochat?.open().
Документация: https://monochat.ru/docs/bolt.md
```

## Код

```html
<!-- index.html, перед </body> -->
<script src="https://monochat.ru/widget/ВАШ_WIDGET_KEY.js" async></script>
```

Для Next.js — пример на странице [Next.js](https://monochat.ru/docs/nextjs).

## Превью и домены

Превью Bolt открывается на служебном адресе. Если чат не появился в превью, проверьте опубликованную версию или добавьте адрес превью в «Домены сайтов» в настройках виджета. Виджет загружается только на разрешённых доменах и на `localhost`.

## Частые вопросы

### Это официальная интеграция с Bolt?

Нет. Bolt-агент просто вставляет в код скрипт виджета по промпту. Ничего устанавливать в Bolt не нужно.

### Нужен ли бэкенд или база данных?

Нет. Виджет — один асинхронный скрипт. Переписка хранится в Моночате на серверах в России, ваш проект ничего не хранит.

### Можно ли сделать свою кнопку вместо стандартной?

Да. Вызовите `window.Monochat?.open()` из любой кнопки, а стандартную кнопку можно скрыть через `Monochat.hide()`. Подробнее — в [JavaScript API](https://monochat.ru/docs/javascript-api).

### Агент может сам получить ключ виджета?

Если агент умеет отправлять HTTP-запросы, он может зарегистрировать проект через [Agent API](https://monochat.ru/docs/agent-api), а вы подтвердите email. В Bolt обычно проще взять ключ в кабинете и вставить в промпт.

### Сколько стоит?

«Старт» — 0 ₽: все каналы, без лимита операторов. ИИ-автоответы и работа без подписи — на платных тарифах, см. [тарифы](https://monochat.ru/pricing).

## Ещё по теме

- [Универсальный промпт для ИИ-агентов](https://monochat.ru/docs/ai-prompt)
- [React](https://monochat.ru/docs/react), [Vue](https://monochat.ru/docs/vue), [HTML](https://monochat.ru/docs/html)
- [MCP-сервер](https://monochat.ru/docs/mcp)
- [Демо виджета](https://monochat.ru/demo)