Как сделать сайт с чатом в 2026: виджет или свой реалтайм-чат

Сайт с чатом делается двумя способами. Первый: поставить на существующий сайт готовый виджет, это 15-20 минут и ни строчки кода. Второй: собрать собственный чат с помощью ИИ, если нужна чат-комната, переписка пользователей между собой или нестандартная логика. В статье оба пути: сервисы виджетов с ценами, пошаговая установка и план, как навайбкодить реалтайм-чат без опыта программирования.

Какой чат вам нужен: три разные задачи

За словами «сайт с чатом» обычно прячутся три задачи, и решаются они по-разному. Прежде чем что-то устанавливать, определите свою.

• Чат поддержки. Посетитель пишет в окошко в углу сайта, вы отвечаете с телефона или компьютера. Решается готовым виджетом за 15 минут, код писать не нужно.
• Чат, который отвечает сам. Это уже чат-бот на нейросети: он знает ваши цены и услуги и консультирует без вас. Как его собрать, мы подробно показали в разборе умного ассистента для сайта, здесь повторяться не будем.
• Сайт-чат целиком. Комната, где пользователи общаются между собой в реальном времени: чат жильцов дома, участников курса, игрового сообщества. Готовые виджеты такое не умеют, зато это собирается вайбкодингом.

Первые два варианта закрывают 90% случаев для бизнеса. Третий нужен, когда чат и есть сам продукт. Разберём по порядку.

Готовый виджет чата: сервисы и цены

Виджет: это маленькое окошко чата, которое сервис даёт вам в виде готового скрипта. Вы вставляете скрипт на сайт, посетители пишут, а вы отвечаете из приложения сервиса. В России сейчас три рабочих варианта с бесплатным стартом.

• Jivo. Самый известный чат для сайта в рунете. Бесплатный тариф Starter включает чат на сайте, подключение Telegram, VK и почты, работать могут до 5 операторов. Платные тарифы начинаются от 742 ₽ за оператора в месяц, по данным обзора Jivo 2026. В 2026 году появился ИИ-оператор, который ведёт диалог сам.
• Talk-Me. Есть полностью бесплатный тариф, а платные устроены необычно: Start с оплатой 9 ₽ за обращение (платите только когда клиенты реально пишут) и Pro за 5800 ₽ в год, см. тарифы Talk-Me.
• Verbox. Бесплатная версия действует без ограничения по времени, плюс даются 14 дней полного доступа; дальше можно платить по факту обращений, что удобно при нерегулярном трафике, детали на странице тарифов Verbox.

Начните с бесплатного тарифа любого из трёх: для сайта с посещаемостью до пары сотен человек в день его хватает надолго. Установка везде одинаковая.

1. Зарегистрируйтесь в сервисе и создайте виджет: выберите цвет, текст приветствия и положение окошка на странице.
2. Скопируйте код виджета: это несколько строк скрипта, сервис показывает их сразу после настройки.
3. Вставьте код на сайт. На своём сайте: перед закрывающим тегом body. На конструкторе: через блок «вставить HTML-код», он есть в Тильде, ВК и почти любом конструкторе.
4. Установите приложение сервиса на телефон, чтобы отвечать откуда угодно.
5. Откройте сайт в режиме инкогнито и напишите сами себе: проверьте, что сообщение появляется в приложении и уведомление срабатывает.

Свой реалтайм-чат через вайбкодинг

Если задача: сайт, где люди переписываются между собой, виджет не поможет. Нужен реалтайм: сообщение одного пользователя мгновенно появляется у остальных. Технически это делается через WebSocket: постоянное соединение между браузером и сервером, по которому данные летят в обе стороны без перезагрузки страницы. Звучит сложно, но писать эту механику руками не придётся: ИИ-агенты собирают такие проекты по текстовому описанию. Как устроен подход в целом, мы разбирали в руководстве по созданию сайтов с ИИ.

Практичный путь для старта: связка ИИ-агента и Supabase. Supabase: это готовый облачный сервис с базой данных и модулем Realtime, который берёт WebSocket-механику на себя. Бесплатный тариф даёт 200 одновременных подключений и 2 млн сообщений в месяц, по разбору тарифов Supabase: для чата небольшого сообщества этого достаточно. Есть нюанс: бесплатный проект засыпает после недели без активности, для живого чата это некритично, но знать стоит.

Про Firebase (аналог от Google) в России осторожнее: хранение персональных данных россиян на зарубежных серверах конфликтует с законом 152-ФЗ, риски описаны в разборе на vc.ru. Учтите: Supabase тоже хранит данные на зарубежных серверах, поэтому сама по себе смена сервиса риск по 152-ФЗ не снимает, для чата с регистрацией пользователей стоит свериться с юристом.

1. Опишите чат текстом: кто пишет, видят ли гости сообщения без входа, нужны ли комнаты, как выглядит интерфейс. Чем конкретнее описание, тем меньше переделок.
2. Отдайте описание ИИ-агенту: подойдёт Claude Code или Codex. Попросите собрать чат на Supabase Realtime с простым интерфейсом. Если работаете с Claude Code впервые, начните с нашего гайда по работе в Claude Code.
3. Заведите бесплатный проект на supabase.com и передайте агенту ключи доступа, он сам создаст таблицу сообщений и подписку на обновления.
4. Протестируйте вдвоём: откройте чат в двух браузерах и проверьте, что сообщения появляются у обоих без обновления страницы.
5. Опубликуйте сайт на хостинге и дайте ссылку первым участникам.

Не просите ИИ сразу «сделать чат как в Telegram». Соберите сначала одну комнату с именем и текстом сообщений, запустите, а реакции, картинки и личные сообщения добавляйте по одной фиче за раз. Каждый маленький шаг легко проверить, а огромный промпт почти всегда возвращается с ворохом ошибок.

По теме: Как сделать сайт-визитку в 2026: три способа и готовый промпт

Что ещё понадобится, кроме самого чата

Чат, где пишут живые люди, тянет за собой несколько обязательных вещей. Заложите их сразу, чтобы не переделывать.

• Вход для пользователей: хотя бы имя, а лучше регистрация, иначе в чате не отличить участников. Как устроена авторизация на сайте, мы разбирали на примере личного кабинета.
• Модерация: возможность удалить сообщение и заблокировать пользователя. Без этого публичный чат быстро зарастает спамом.
• История сообщений: новый участник должен видеть, о чём говорили до него. В Supabase история хранится в базе автоматически.
• Правила чата и согласие на обработку данных: если пользователи регистрируются, вы обрабатываете персональные данные, и на сайте нужна политика конфиденциальности.

Частые ошибки

Виджет ставят, а отвечать некому. Окошко чата, в котором сутки никто не отвечает, раздражает сильнее его отсутствия. Либо поставьте приложение на телефон и правда отвечайте, либо подключите автоответ на нерабочие часы.

Свой чат начинают с мессенджера мечты. Голосовые, реакции, темы оформления в первом промпте: типичная причина бросить проект. Рабочая версия из одной комнаты собирается за вечер, остальное наращивается потом.

Забывают про телефоны. Большинство посетителей откроют чат со смартфона. Проверьте, что окно ввода не прячется за клавиатурой, а сообщения читаются на узком экране.

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

Можно ли сделать чат на сайте бесплатно?

Да, обоими способами. У Jivo, Talk-Me и Verbox есть бесплатные тарифы, которых хватает малому сайту. Свой реалтайм-чат тоже собирается на бесплатном тарифе Supabase; платить придётся разве что за домен и хостинг самого сайта.

Нужен ли программист, чтобы добавить чат на сайт?

Для виджета: нет, это вставка готового кода по инструкции сервиса. Для собственного чата код пишет ИИ-агент по вашему описанию; от вас нужны внятная постановка задачи и проверка результата, а не умение программировать.

Как сделать чат на Тильде или другом конструкторе?

Через виджет: в конструкторах есть блок для вставки HTML-кода, куда добавляется скрипт Jivo, Talk-Me или Verbox. Полноценную чат-комнату внутрь конструктора встроить не получится: для неё нужен свой сайт с базой данных.

Что выбрать: виджет или свой чат?

Если чат нужен, чтобы посетители писали вам: только виджет, он быстрее и надёжнее. Свой чат оправдан, когда общение пользователей между собой и есть суть сайта: сообщество, курс, игра. Начинать со своего чата «на вырост» не стоит.