Рекомендуем ознакомиться со статьей "Кнопки" в разделе "Как создать чат-бот".
В Telegram можно использовать как Reply-кнопки (обычные или клавиатурные), так и Inline-кнопки (кнопки в тексте).
Важно!
Информация об ограничениях:
- Reply-кнопки (обычные или клавиатурные) до 12 штук в строке;
- Inline-кнопки до 8 штук в строке;
- ТЕКСТ в кнопке ограничен 32 символами;
- кнопке НЕЛЬЗЯ задать цвет.
Как создать кнопку в блоке
Чтобы создать кнопку любого вида в блоке чат-бота, перейдите в настройки блока и кликните на вкладку "Кнопки":
Тогда раскроются настройки для добавления и редактирования кнопки. Далее кликните добавить:
Откроется модальное окно с настройками кнопки, где указывается текст кнопки, ее функция и иные настройки:
В Сейлботе существует ряд кнопок, которые работают только для бота в Telegram:
- Поделиться;
- Callback-кнопка;
- Telegram WebApp (чтобы открыть мини-приложение в ТГ, например, с виджетом или сайтом);
- Авторизация через Telegram;
Также в Telegram доступны и другие кнопки, например, оплаты, запросить номер телефона или геолокацию, отправить ссылку.
Кнопка "Поделиться"
При создании кнопки выбираете "Поделиться (только Telegram)" и заполняете поля (поле дополнительный текст необязательно):
При нажатии на получившуюся кнопку будет предложено выбрать кому из списка контактов переслать информацию:
В зависимости от того, какую ссылку вы поместили в строке "Поделиться ссылкой" в настройках кнопки, та ссылка будет отправлена по кнопке поделиться:
После выбора получателя будет вставлена ссылка из строки “Поделиться ссылкой”, а также текст из строки “Дополнительный текст”.
Таким образом, можно передавать ссылки, в том числе на сообщения из каналов в телеграмм.
Внимание! На некоторых устройствах под управлением iOs может работать некорректно.
https://www.youtube.com/watch?v=niJwFAHc05M
Telegram: кнопка Поделиться
Кнопка для авторизации на сайте
Для работы этой кнопки требуется привязка бота к домену. Делается это через @BotFather.
Выберите бота в диалоге с @BotFather, далее Bot Settings
Далее переходим в пункт Domain:
Далее в зависимости от того, был ли ранее установлен домен, будет кнопка Set Domain или Edit domain:
Вам будет предложено установить домен для бота:
Как это сделать правильно? Укажите домен salebot.pro или Свой домен, если он подключен к сайту на Сейлбот.
После того, как все приготовления готовы, можно создать кнопку:
В поле Текст впишите текст для надписи на кнопке.
В поле Ссылка - url-адрес страницы, на которой будет реализована авторизация.
Остальные поля будут нужны, если для авторизации будет использоваться отдельный бот (требуется получить разрешение на отправку сообщений для этого бота): в частности, потребуется указание имени бота.
Если нужна возможность отправлять сообщения от указанного бота, то обязательно поставьте галочку для “Запросить разрешение у пользователя на отправку сообщений от бота”:
https://www.youtube.com/watch?v=BGglUWuaq0Y
Telegram: кнопка Авторизация через Telegram
Callback-кнопка
Callback-кнопка - это кнопки с обратной связью, когда клиент видит одно, а в бот мы получаем нужный нам callback для запуска какого-либо блока воронки.
Создать ее довольно просто: в поле Кнопки нажмите на кнопку Добавить кнопку. В открывшейся форме введите текст, укажите тип - Callback-кнопка (Вконтакте, Telegram) и введите текст Callback, который должен вернуться при клике на кнопку:
Визуально кнопка выглядит как обычная inline-кнопка:
В карточке клиента после клика по кнопке Вы увидите настроенный Callback:
Важно!
В Telegram не поддерживается Callback-клавиатурные кнопки.
Обращаем внимание!
Если выбран тип кнопки "Колбек", то кнопка отобразится колбеком только в том случае, если текст кнопки будет отличаться от текста колбека.
Кнопка Telegram Web Application
Такая кнопка позволяет открыть сайт в виде веб-приложения в Telegram.
При добавлении кнопки укажите текст, тип кнопки Telegram Web Application. Далее если у вас создан сайт на платформе Сейлбот, то достаточно будет выбрать сайт из списка:
Если вам нужно указать сайт, созданный не в Сейлбот, то нажмите на кнопку "Указать внешнюю ссылку" и в поле URL вставьте нужную вам ссылку:
- Можно указать ссылку через переменную:
Указать ссылку через переменную удобно, если вам часто необходимо менять адрес страницы или сайта, например, записав переменную в настройках проекта.
Затем чтобы спустя какое-то время не искать, в каком именно блоке у вас находится кнопка с Веб-апп, достаточно будет поменять значение переменной в настройках проекта.
Например, укажите переменную в настройках проекта.
- Перейдите в настройки проекта:
- Далее во вкладке "Переменные" укажите переменную, в которой лежит значение в виде ссылки:
Далее останется передать переменную с ссылкой #{url} в поле url:
- Можно указать прямую ссылку в настройках кнопки:
https://www.youtube.com/watch?v=RFVZRBMTEN4
Telegram: кнопка WebApp
Как создать кнопки для использования в функциях API Telegram
Для большинства довольно сложно освоить API ботов Telegram и потом использовать их при создании клавиатуры, но специально для новичков есть способ проще. Вы можете просто использовать в своих нуждах генерируемый в расширенных настройках кнопок код.
Для этого перейдите в настройки блока и выберите раздел Кнопки. Добавьте все необходимые кнопки:
Далее нажмите на "Расширенные настройки".
Код созданных кнопок Вы найдете при клике на Расширенные настройки в поле Расширенные настройки кнопки:
После этого скопируйте все из расширенных настроек кнопок (предварительно можете проверить работу кнопок прямо из этого блока) в переменную, например, под названием buttons:
Далее воспользуемся функцией tg_send_message**(platform_id, text,client_message_id, reply_markup, parse_mode, disable_web_page_preview, protect_content, disable_notification**, message_thread_id, entities):
Переменную buttons передайте переменную в функцию в параметре reply_markup:
В результате получите кнопки в том виде, в каком задавали их в расширенных настройках кнопок:
Видео-инструкция "Код кнопок"
https://www.youtube.com/watch?v=S_MmHFXffBM
Код кнопок для функций API Telegram
Как удалить Reply-кнопки
Обычно кнопки удаляются сами, но бывают исключения.
Для удаления зависших кнопок Reply (клавиатурные кнопки) воспользуйтесь следующим кодом: [{"buttons":[],"one_time":true,"index_in_line":0,"line":0}]
Данный код следует разместить в расширенных настройках кнопок:
Клавиатурные кнопки-меню в Telegram
ВНИМАНИЕ! Данную возможность рекомендуем использовать только продвинутым пользователям
Клавиатурные кнопки
Для получения возможности использовать клавиатурные кнопки (reply) как постоянное меню Телеграм достаточно присвоить любое значение переменной tg_permanent_reply_buttons (переменная объявляется константой проекта).
Краткое описание действия включения tg_permanent_reply_buttons:
Задавая среди своих переменных tg_permanent_reply_buttons, Вы говорите о своем желании получить полный контроль над кнопками типа reply. Автоматические действия отключаются и ответственность переходит в Ваши руки. Данное действие распространяется на все вновь созданные клавиатурные кнопки для телеграмм
Для возвращения возможности скрывать reply-клавиатуру удалите переменную tg_permanent_reply_buttons и reply-кнопки, созданные пока данная переменная была в настройках проекта.
Как сделать меню в Telegram
Как сделать такое меню в Telegram:
Сделать такое меню может тот, кто создавал Telegram-бота.
Для этого нужно написать в Botfather в Телеграм.
Вводите команду /mybots , открывается список ваших ботов. Выбираете нужный. У вас открывается меню. Здесь нужно выбрать Edit Bot, а затем Edit Commands
Далее одним сообщением вводите команды и описание к ним. Название команд прописывается строчными буквами. Вам придет сообщение, что список команд обновлен.
Теперь в диалоге с ботом в Telegram можно увидеть меню:
При клике на кнопку меню, откроется список команд, которые ранее прописали в BotFather:
Далее переходите в Salebot, открываете проект, к которому подключен этот телеграм-бот.
Создаете блоки "Первостепенная проверка условия" или "Не состояние с условием", в условиях прописываете команды, а в поле "Текст сообщения" — тексты, которые будут приходить в ответ.
Пример:
Как совместить два вида кнопок
Создаете блок с reply-кнопкой (клавиатурная), которые вам необходимо визуализировать. Например: [{"type": "reply", "text": "НАЗВАНИЕ КНОПКИ", "line": 0, "index_in_line": 0}]
Далее создаете следующий блок (таймер в 0 секунд) с inline-кнопками (кнопки в тексте), которые необходимо разместить, не убирая reply-кнопки. Например: [{"type": "inline", "text": "НАЗВАНИЕ КНОПКИ", "line": 0, "index_in_line": 0}]
Результат:
Полезно знать
Обязательно соблюдайте последовательность: сначала reply кнопки, а потом inline. Иначе reply-кнопки пропадут со следующим блоком.
https://www.youtube.com/watch?v=fE3o36P9PLY
Telegram: как соединить два вида кнопок