Как создать Web app приложение в Telegram боте

19.10.2024
Как создать Web app приложение в Telegram боте

В этой статье рассмотрим, как создать приложение, которое будет отображаться при нажатии добавленной нами кнопки в Telegram боте. В нашем случае при нажатии кнопки будет открываться аналог браузерного окна с сайтом. В качестве сайта используем витрину, созданную на конструкторе SmartLand. Итак, начнем!

Подготавливаем бота

Сначала создадим бота. Заходим в личный кабинет Saleads.pro в разделе Конструкторы ботов – BotTelegram, нажимаем “Создать бота” и следуем инструкции.

В телеграме находим бота @botfather и вводим команду /newapp

Далее выберите созданного бота:

Введите название и описание:

Добавьте картинку с разрешением 640x360. GIF можно добавить по желанию в ответе на следующее сообщение – если в GIF нет необходимости, нажимаем команду “/empty”:

Вводим ссылку на сайт, куда будет вести приложение:

Изначально ссылка на приложение выглядит так – https://t.me/hi_i_am_eva_hr_bot/myapp. Осталось придать ссылке на приложение презентабельный вид – заменим “myapp” на “work”:

Готово! Теперь добавим кнопку.

Добавление кнопки

Пишем @botfather команду /mybots, выбираем нашего бота:

Переходим в меню бота – нажимаем Bot Settings -> Menu Button -> Configure menu button

Перед тем, как добавить собственную кнопку, нужно ввести команду “/empty”:

Возвращаемся в меню бота: Bot Settings -> Menu Button -> Configure menu button

1. Сначала пришлите URL, куда будет вести кнопка, например: https://offertop.ru/Jrp2

2. В качестве title введите желаемое название кнопки (например: “Перейти на сайт”)

Теперь давайте протестируем бота.

Проводим тестирование

Как мы видим, появилась кнопка “Перейти на сайт” – переходим:

Так будет отображаться открывшийся сайт:

Заключение

Создать Web app приложение для Телеграм бота несложно, а главное – быстро: в результате получаем привлекающую внимание кнопку, которая положительно влияет на конверсию и может домонетизировать пользователей бота с помощью сайта по типу витрины, такой как SmartLand.

Желаем вам продуктивных рекламных кампаний и высоких конверсий,
Команда Saleads.pro