Кнопка Telegram для сайта: как добавить + лучшие сервисы

Телеграм — популярный мессенджер, аудитория которого превышает миллиард активных пользователей по всему миру.

Преимущества подключения Телеграм-виджета к сайту:

• Удобный способ коммуникации — у большинства клиентов приложение уже установлено на телефоне или компьютере.
• У клиента сохраняется полная история переписки в его профиле, поэтому он может вернуться к диалогу с брендом в любой удобный момент.
• Возможность принимать запросы от заказчиков круглосуточно, даже в нерабочее время.
• К виджету можно подключить чат-бота, который сэкономит время операторов при первичной обработке заявок. Робот умеет моментально отвечать на типовые вопросы по заранее настроенным сценариям. Например, если клиент спрашивает про доставку, бот автоматически отправляет актуальные условия и адреса пунктов выдачи.

Как выбрать сервис

Выбор подходящего виджета зависит от масштабов вашего бизнеса и используемой инфраструктуры. Если у вас небольшой сайт-визитка или личный блог, достаточно будет установить бесплатную кнопку-ссылку или официальный виджет Telegram. Это позволит посетителям в один клик переходить в ваш канал или личные сообщения.

Для интернет-магазинов и компаний с полноценным отделом продаж простых кнопок недостаточно. В таких случаях стоит присмотреться к агрегаторам мессенджеров (например, Teletype или Umnico), которые собирают обращения из разных источников в единое окно. Если вы активно используете CRM-систему (amoCRM, Битрикс24), лучше подойдут коннекторы вроде Wazzup или ChatApp, которые позволяют менеджерам общаться с клиентами прямо из карточки сделки.

Функции кнопки Telegram на сайте

• Прямой переход в чат или группу. Клиенту часто неудобно звонить, поэтому детали он предпочитает обсуждать текстом.
• Функция звонка. Кнопка может инициировать аудиовызов через мессенджер, что повышает конверсию при грамотном ведении диалога.
• Ссылка с перенаправлением. Этот вариант подходит для услуг и продаж. С помощью небольшого продающего текста можно подогреть интерес посетителя, а кнопка направит его в канал или бота для получения подробной информации.
• Всплывающее окно. Такой формат привлекает максимум внимания. Он может использоваться как призыв подписаться на канал для получения скрытого контента, как интерактивная мини-игра или форма захвата контактов.

Как добавить виджет Telegram на сайт вручную

Ниже — пример самостоятельного добавления виджета через HTML.

Писать код самостоятельно необязательно: готовый код генерируют онлайн-сервисы.

В качестве примера ниже представлена структура рабочего скрипта:

<script async src="https://telegram.org/js/telegram-widget.js?21" data-telegram-post="t.me/GroupName/PostNumber" data-color="13B4C6" data-dark="1" data-dark-color="39C4E8"></script>

1. Тег script используется для подключения исполняемых скриптов.
2. Готовые скрипты загружаются из официального хранилища Телеграм, на что указывает значение атрибута src.
3. Атрибут async позволяет скрипту загружаться асинхронно, не блокируя отображение остальных элементов страницы.
4. Атрибут data-telegram-post содержит ссылку на конкретную публикацию или чат в стандартном формате t.me.
5. Атрибуты color и dark отвечают за визуальное оформление и автоматическое включение темной темы.

Что касается JavaScript и CSS: все JS-скрипты для официальных виджетов уже написаны разработчиками Telegram, поэтому дополнительное программирование не требуется. Визуальные параметры легко настраиваются через стандартные атрибуты ширины, высоты и цвета прямо в HTML-коде.

ТОП сервисов для создания Телеграм-кнопки

Teletype — агрегатор чатов и интеграции

Сайт Teletype

Функционал:

• Агрегатор каналов связи. В единую панель можно подключить Telegram, WhatsApp, ВКонтакте и другие популярные соцсети.
• Для операторов создается единое рабочее пространство, а руководитель получает подробную статистику скорости ответов и качества обработки лидов.
• Есть интеграции с популярными CMS и CRM.
• Гибкая настройка ролей: можно подключать несколько операторов и задавать часы работы.

Ориентировочная стоимость начинается от 2250 рублей в месяц при подключении номера, либо около 450 рублей при работе через бота. При оплате за длительный период действуют скидки.

Umnico App — омниканальный виджет для мессенджеров

Umnico собирает сообщения из всех популярных мессенджеров и социальных сетей в едином окне. Платформа предоставляет готовый бесплатный виджет для установки на сайт, поддерживает работу из браузера и интегрируется с CRM.

Плюсы:

• Омниканальность: один личный кабинет для всех рабочих диалогов.
• Наличие удобного виджета кнопок мессенджеров для сайта.
• Надежные интеграции с CRM и системами облачной телефонии.
• Подходит и микробизнесу, и крупным колл-центрам.

Минусы:

• Настройки интерфейса могут показаться сложными для новичков.
• Тарифы формируются динамически в зависимости от количества каналов и сотрудников.

Платформа предлагает бесплатный пробный период. Дальнейшая работа оплачивается по подписке, базовая стоимость стартует примерно от 350 рублей в месяц.

Chat2Desk — чат-платформа для поддержки и продаж

Сервис превращает мессенджеры и чат на сайте в единый инструмент поддержки клиентов. Платформа умеет распределять обращения между операторами, поддерживает автоответы и создание ботов.

Плюсы:

• Глубокие сценарии автоматизации через триггеры и шаблоны.
• Готовые связки с CRM.
• Подходит для больших отделов продаж с очередями обращений и контролем качества.

Минусы:

• Для проектов с одним менеджером функций избыточно.
• Освоение всех возможностей платформы требует времени.

ChatApp.Online — агрегатор с упором на CRM

ChatApp напрямую подключает Telegram и WhatsApp к популярным системам вроде Битрикс24 и amoCRM. Основная концепция заключается в том, что менеджер работает исключительно внутри карточки CRM, не открывая дополнительных окон.

Плюсы:

• Бесшовная интеграция с CRM-системами без сторонних чат-интерфейсов.
• Встроенный конструктор ботов и наличие партнерской программы.

Минусы:

• Сервис актуален только для компаний, которые уже внедрили CRM.
• Первичная настройка может потребовать привлечения специалиста-интегратора.

Wazzup — глубокая интеграция мессенджеров

Популярный в России сервис, который подключает мессенджеры к CRM-системам. Главная задача Wazzup — привязать каждый диалог из мессенджера к конкретной сделке и контакту в воронке продаж.

Плюсы:

• Настройка под процессы продаж и сопровождения клиентов.
• Гибкая логика распределения новых диалогов между менеджерами.
• Детальная аналитика по скорости ответов.

Минусы:

• Часть продвинутых функций доступна только на дорогих тарифах.
• Требуется базовое понимание логики работы CRM.

Базовые тарифы зависят от количества линий и выбранных платформ связи. Обычно стартовая цена начинается от 800 рублей в месяц.

Chaty — плавающая кнопка соцсетей

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

Плюсы:

• Моментальный запуск: скрипт подключается за пару минут.
• Большой выбор иконок мессенджеров.
• Имеются готовые плагины для популярных CMS.

Минусы:

• Это исключительно визуальный виджет, он не собирает диалоги в единое окно.
• Для аналитики общения все равно потребуется отдельная платформа.

Существует бесплатный тарифный план с лимитом на количество показов. Платные версии предлагают расширенные настройки и убирают ограничения.

Elfsight — каталог виджетов

Сайт Elfsight

Функционал:

• Моментальная передача сообщений с сайта в ваш Telegram.
• Большой набор параметров: триггеры появления окна, настройка расписания работы, кастомизация дизайна.

Стоимость:

• Lite версия предоставляется бесплатно. Она работает на одном сайте и ограничена небольшим количеством просмотров в месяц. Присутствует вотермарка сервиса. Подходит для тестирования.
• Базовые платные тарифы стартуют от 5 долларов в месяц, снимают логотип сервиса и расширяют лимиты на просмотры. Подходят для сайтов с небольшой посещаемостью.
• Продвинутые тарифы от 10 до 20 долларов открывают безлимитные просмотры и позволяют устанавливать множество виджетов на разных доменах.

Инструкция по использованию:

1. Зарегистрируйтесь и перейдите на страницу создания виджета Telegram Chat.
2. Настройте внешний вид, загрузите аватар, пропишите приветственное сообщение.
3. Нажмите кнопку публикации и скопируйте уникальный HTML-код.
4. Вставьте полученный фрагмент кода в подвал вашего сайта перед закрывающим тегом body.

Официальный виджет от Telegram

Ссылка на сервис: telegram.org/widgets

Инструкция по использованию:

1. На официальном сайте доступно несколько типов виджетов. Если задача состоит в перенаправлении трафика в канал, выберите виджет подписки. Учитывайте, что ваш канал должен быть открытым и публичным.
2. Вставьте ссылку на нужный пост или канал в соответствующее поле. Настройте цветовую гамму, отображение логотипа и включите темную тему при необходимости.
3. Скопируйте сгенерированный код из строки Embed Code.
4. Разместите код на страницах вашего сайта. Если вы используете конструкторы сайтов вроде Tilda, добавьте на страницу блок HTML-код.

EnvyBox — онлайн-чат и Телеграм-кнопка

Сайт EnvyBox

Функционал:

• Набор инструментов: кнопка мессенджера дополняется сервисом заказа обратного звонка.
• Уведомления о возвращении клиентов на сайт для быстрой реакции отдела продаж.

По статистике разработчиков, комплексный подход увеличивает количество звонков почти в четыре раза.

Тарификация гибкая: можно оплачивать функционал за минуты разговора или приобрести безлимитную лицензию, стоимость которой при годовой оплате составляет около 740 рублей в месяц.

T.website — генератор коротких ссылок и html-кода

Сайт T.website

Простой и быстрый генератор ссылок и микро-виджетов для подписки на канал.

Инструкция по использованию:

1. Перейдите по ссылке на сервис, вставьте юзернейм вашего канала.
2. Получите готовый сниппет кода для вставки на сайт.
3. При необходимости код легко кастомизируется через CSS.

Сравнительная таблица сервисов

Название сервиса	Ключевая особенность	Бесплатный тариф	Интеграция с CRM
Umnico	Омниканальность и виджет на сайт	Есть виджет	Да
Wazzup	Глубокая интеграция внутри CRM	Тестовый период	Да (AMO, Битрикс)
Teletype	Агрегатор и детальная аналитика	Тестовый период	Да
Elfsight	Каталог красивых виджетов	Есть (с лимитами)	Нет
Chaty	Плавающая кнопка соцсетей	Есть (базовый)	Нет
Telegram Widget	Официальное решение	Полностью бесплатен	Нет

Плагины для WordPress

Рассмотрим популярные плагины для сайтов на базе CMS WordPress.

Replain

Удобный плагин, который моментально перенаправляет запросы с сайта в ваш личный Telegram-аккаунт. Инструмент позволяет настраивать внешний вид кнопки, использовать заранее подготовленные шаблоны ответов и подключать нескольких операторов.

Telegram Notifications

Этот вариант отлично подходит для интернет-магазинов, так как инструмент тесно интегрирован с популярным модулем WooCommerce. Плагин позволяет настроить автоматические уведомления о новых заказах и отправлять их напрямую в ваш мессенджер. Решение платное.

Telegram Bot&Channel

Бесплатный инструмент для связки сайта с Телеграм-ботами. Он позволяет планировать отправку сообщений, публиковать контент из блога в канал и обмениваться сообщениями с пользователями через интерфейс WordPress.

WP Telegram

Комплексный плагин для синхронизации сайта с мессенджером. Он поддерживает автопостинг свежих статей в Telegram-каналы, умеет отправлять уведомления о новых товарах из WooCommerce и обладает гибкой системой фильтрации контента.

Как создать своего бота в Telegram

Если вы хотите не только получать сообщения от клиентов, но и автоматизировать рутину (выдавать прайс-листы, записывать на услуги), вам потребуется бот.

Базовые шаги по созданию Телеграм-бота:

1. Откройте поиск в мессенджере и найдите официального бота @BotFather.
2. Запустите его командой Start и выберите из списка меню пункт /newbot.
3. Придумайте публичное имя бота и уникальный никнейм, который обязательно должен заканчиваться словом bot.
4. После создания вы получите токен доступа (API Token), который понадобится для подключения бота к агрегаторам или виджетам.
5. Используя команду /setdomain, вы можете привязать бота к домену вашего сайта для настройки бесшовной авторизации.

После создания бота, его можно подключить к любому сервису из нашей подборки (например, Umnico или Teletype) или использовать популярные конструкторы ботов для визуальной сборки логики ответов без программирования.