Кнопка Telegram на сайт: ссылка, HTML и проверка перехода
Чтобы добавить кнопку Telegram на сайт, укажите в обычной ссылке публичный адрес нужного аккаунта, канала или бота и оформите её как кнопку. Для простого перехода не требуется отдельный чат-виджет. Сначала проверьте адрес получателя: красивая кнопка с ошибочным именем пользователя ведёт не к вашему бизнесу.
Определите, куда должен попасть посетитель
Для обращения к специалисту используйте подтверждённый публичный адрес его аккаунта. Для подписки — адрес канала. Для автоматического сценария — адрес работающего бота. Подпись должна соответствовать назначению: «Написать в Telegram», «Открыть канал» или «Открыть бота».
Кнопка «Поделиться» решает другую задачу: предлагает посетителю переслать ссылку. Это отдельно описано в документации Telegram Sharing Button. Не используйте её вместо контакта с сотрудником.
Базовый формат публичной ссылки — https://t.me/имя\_пользователя. В реальном адресе замените пример точным username без символа @. Форматы ссылок перечислены в документации Telegram. Для закрытых сообществ действуют пригласительные ссылки; их доступность и право публикации проверяйте отдельно.
Добавьте ссылку в HTML или задайте её ИИ
Минимальная разметка выглядит так. Значение YOUR_USERNAME — заглушка: до публикации замените его своим проверенным публичным именем.
<a href="https://t.me/YOUR_USERNAME">
Написать в Telegram
</a>
Это ссылка, а внешний вид кнопки задаётся стилями сайта. Не заменяйте её элементом, который только выглядит кликабельным, но не имеет рабочего перехода. Для такого контакта не нужен токен бота; не вставляйте секреты в HTML.
На сайте в Lovarus можно передать задачу обычным языком. Учебный пример:
На странице услуги добавь кнопку «Написать в Telegram»
рядом с основным способом связи.
Адрес получателя возьми из моей подтверждённой ссылки.
Если ссылки нет, сначала запроси её.
Сохрани остальные тексты и оформление страницы.
На телефоне кнопка не должна перекрывать меню и форму.
Не добавляй чат-виджет, бота и автоматическую отправку сообщений.
После правки перечисли, что нужно проверить на опубликованном сайте.
Передайте свой адрес отдельно и сверьте результат. Уточните, где именно нужна кнопка: в первом экране, карточке услуги или контактах. Несколько одинаковых плавающих кнопок могут мешать навигации; для первой версии достаточно одного понятного расположения.
Если нужно изменить существующий элемент, используйте локальную задачу, как в статье о точечных правках сайта.
Проверьте переход на опубликованной версии
После публикации изменений откройте внешний адрес сайта, а не только превью в редакторе.
- Нажмите кнопку на телефоне с установленным Telegram и проверьте получателя.
- Откройте сайт на компьютере и проверьте, куда ведёт ссылка в вашем браузере. Поведение зависит от установленного клиента и его настроек.
- Сверьте username, название и назначение: личный чат, канал и бот не взаимозаменяемы.
- Убедитесь, что ссылка доступна посетителю, который не является администратором вашей группы или канала.
- Проверьте видимость подписи, наведение и переход клавишей Enter после выбора ссылки клавишей Tab.
Нажатие не означает, что сообщение уже отправлено. Если нужен тест получения обращения, согласуйте его с ответственным сотрудником и отправьте отдельное тестовое сообщение. Для бота дополнительно проверьте его реальный ответ; открытие профиля не доказывает работу сценария.
Измеряйте клик отдельно от обращения
Если на сайте подключена аналитика, можно настроить отдельную цель на нажатие кнопки. Убедитесь, что тестовый клик фиксируется один раз. Название цели должно описывать переход, например «Клик Telegram», а не «Получена заявка».
Отдельно учитывайте полученные сообщения и их результат. Посетитель может открыть Telegram и ничего не написать; нельзя объявлять все клики обращениями. Редакторские проверки помечайте отдельно, чтобы не принимать их за новых клиентов.
Если ссылка не открывает нужного получателя, сначала проверьте её напрямую и сверьте имя. После смены username обновите адрес на сайте. Сохраните альтернативный способ связи на случай недоступности мессенджера.
Откройте Lovarus, укажите страницу и проверенный адрес Telegram, затем добавьте одну кнопку и пройдите проверку перехода. Этот пример описывает порядок работы; реальный бот или чат в рамках статьи не подключался.