Рекомендуем прочитать статью Кнопка.

В Telegram можно использовать как кнопки ответа (обычные или клавиатурные кнопки), так и Inline-кнопки (кнопки в тексте).

Важно: ограничения кнопок

Учитывайте следующие ограничения платформы при создании кнопок:

  • Кнопки ответа (клавиатура): максимум 12 кнопок в строке.
  • Inline-кнопки: максимум 8 кнопок в строке.
  • Текст кнопки: ограничен 32 символами.
  • Цвет кнопки: не настраивается. Кнопки используют стандартный стиль платформы.

Как создать кнопку в блоке

Чтобы создать любую кнопку в чат-боте, перейдите в настройки блока и нажмите на вкладку «Кнопки»:

Затем откроются настройки добавления и редактирования кнопки. Далее нажмите Добавить:

Откроется окно настроек, позволяющее задать название кнопки, действие и дополнительные параметры.

Следующие типы кнопок доступны только для бота Telegram:

  • Кнопка «Поделиться» – позволяет пользователям делиться контентом.
  • Callback-кнопка – отправляет скрытый callback-запрос вашему боту.
  • Telegram WebApp – открывает мини-приложение (например, виджет или веб-сайт) внутри Telegram.
  • Вход через Telegram – авторизует пользователей через их аккаунт Telegram.

В Telegram также доступны другие кнопки, такие как оплата, запрос номера телефона или геолокации, а также отправка ссылки.

Кнопка «Поделиться»

При создании кнопки выберите «Поделиться (только Telegram)» и заполните поля (необязательное поле дополнительного текста):

Эта кнопка позволяет переслать информацию, выбрав контакт из вашего списка.

Введите URL, которым хотите поделиться, в поле «Ссылка для отправки» кнопки.

После выбора контакта будет отправлено содержимое из полей «Ссылка для отправки» и «Дополнительный текст». Используйте это для обмена ссылками на посты Telegram-каналов и другим контентом.

Внимание! На некоторых устройствах iOS может работать некорректно.

Кнопка входа на веб-сайт

Для работы кнопки входа ваш бот должен быть предварительно авторизован для целевого домена. Эта настройка выполняется через @BotFather.

Шаги для настройки:

  1. Откройте чат с @BotFather.
  2. Выберите своего бота из списка.
  3. Выберите Bot Settings > Domain и добавьте домен вашего веб-сайта.

Затем нажмите на кнопку Domain:

Примечание: Кнопка будет называться Edit domain, если домен уже существует, или Set domain, если его нужно добавить.

Вам будет предложено настроить домен для вашего бота:

Правильный формат домена:

Введите ваш домен как mavibot.ai или как yourdomain.com, если у вас есть веб-сайт, подключенный к MaviBot.

Следующий шаг:

После проверки и настройки домена вы можете приступить к созданию кнопки авторизации.

В поле Текст введите надпись, которая будет отображаться на кнопке.

Затем укажите URL страницы в поле Ссылка, где будет происходить авторизация.

Остальные поля понадобятся, если для авторизации используется отдельный бот (необходимо получить разрешение на отправку сообщений для этого бота): в частности, нужно указать имя бота.

Если вам нужна возможность отправлять сообщения от указанного бота, обязательно установите флажок «Запросить разрешение у пользователя на отправку сообщений от бота»:

Кнопка входа через Telegram

Callback-кнопка

Callback-кнопка — это кнопка обратной связи, когда клиент видит одно, а в боте мы получаем нужный callback для запуска любого блока воронки.

Создать её довольно просто: в поле Кнопки нажмите кнопку Добавить. В открывшейся форме введите текст, укажите тип — Callback-кнопка (Telegram) и введите Текст callback'а, который должен возвращаться при нажатии на кнопку:

Визуально кнопка выглядит как обычная inline-кнопка:

После нажатия на кнопку вы увидите настроенный Callback в карточке клиента:

Это важно!

Telegram не поддерживает Callback-кнопки на клавиатуре.

Обратите внимание!

Если выбран тип кнопки «Callback», кнопка будет отображаться как callback только в том случае, если текст кнопки отличается от текста callback'а.

Кнопка веб-приложения Telegram

Эта кнопка позволяет открыть веб-сайт как веб-приложение в Telegram.

При добавлении кнопки укажите её название, выберите тип кнопки Telegram Web App и укажите ссылку на веб-сайт, который откроется как веб-приложение:

  • Вы можете указать ссылку через переменную:

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

Как это работает:

  1. Определите переменную (например, landing_page_url) в настройках вашего проекта.
  2. Ссылайтесь на эту переменную (например, #{landing_page_url}) во всех кнопках Web App в ваших сценариях.

Преимущество: вместо ручного обновления URL в каждом отдельном блоке кнопок вам нужно изменить значение переменной только один раз в настройках проекта, и все кнопки обновятся автоматически.

Альтернатива: вы также можете указать прямую статическую ссылку непосредственно в настройках кнопки.

Как создать кнопки для функций Telegram API

Хотя работа напрямую с Telegram Bot API может быть сложной, особенно для новичков, MaviBot предлагает гораздо более доступную альтернативу.

Метод: использование сгенерированного кода

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

Шаги:

  1. Перейдите в настройки вашего блока и откройте раздел Кнопки.
  2. Используйте интерфейс для добавления и настройки всех необходимых кнопок (текст, ссылки, функции).
  3. Система автоматически сгенерирует правильный код Telegram API в фоновом режиме.

Этот подход позволяет визуально создавать сложные клавиатуры, пока платформа обрабатывает техническую реализацию.

Нажмите «Расширенные настройки», чтобы просмотреть сгенерированный код Telegram API для ваших кнопок.

Протестируйте кнопки, затем скопируйте сгенерированный код из Расширенных настроек в переменную, например buttons.

Эта функция отправляет сообщение через Telegram API со следующими параметрами: tg_send_message (platform_id, text,client_message_id, reply_markup, sparse_mode, disable_web_page_preview, protect_content, disable_notification, message_thread_id, entities):

Передайте переменную buttons в функцию в параметре reply_markup:

Ваши кнопки появятся в чате с заданным расположением и стилем.

Как удалить кнопки ответа

Хотя клавиатурные кнопки обычно исчезают автоматически, иногда они могут оставаться видимыми.

Чтобы принудительно очистить оставшиеся кнопки ответа, вставьте следующий код в поле Расширенные настройки:

[{"buttons":[],"one_time":true,"index_in_line":0,"line":0}]

Эта пустая конфигурация кнопок указывает Telegram скрыть пользовательскую клавиатуру.

Кнопки меню клавиатуры в Telegram

Рекомендуем использовать эту функцию только для продвинутых пользователей!

Клавиатурные кнопки

Чтобы использовать клавиатурные кнопки (ответа) в качестве постоянного меню Telegram, достаточно присвоить любое значение переменной tg_permanent_reply_buttons (переменная объявляется константой проекта).

Переменная: tg_permanent_reply_buttons

Установка переменной tg_permanent_reply_buttons даёт вам полный ручной контроль над видимостью клавиатуры ответа (кнопки под сообщением). Всё автоматическое скрытие платформой отключается.

Область действия: эта настройка применяется ко всем кнопкам ответа, созданным в боте, пока переменная активна.

Возврат к автоматическому поведению

Чтобы восстановить стандартное автоматическое скрытие клавиатуры:

  1. Удалите переменную tg_permanent_reply_buttons из настроек вашего проекта.
  2. Пересоздайте все кнопки ответа, которые были созданы при активной переменной. Кнопки, созданные по «постоянному» правилу, сохраняют это состояние, и их необходимо пересоздать, чтобы они унаследовали новое автоматическое поведение.

Как создать меню в Telegram

Тот, кто создал Telegram-бота, может сделать такое меню.

Для этого напишите Botfather в Telegram.

Введите команду /mybots, и откроется список ваших ботов. Выберите нужного. Откроется меню. Здесь нужно выбрать Edit Bot, а затем Edit Commands.

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

Теперь вы можете видеть и использовать меню в вашем чате Telegram с ботом.

При нажатии на кнопку меню откроется список команд, которые были ранее зарегистрированы в BotFather:

Затем перейдите в Mavibot, откройте проект, к которому подключён этот Telegram-бот.

Создайте блоки Start или Trigger, напишите команды в условиях, а в поле «Текст сообщения» — тексты, которые будут получены в ответ.

Пример:

Как объединить два типа кнопок

Создайте блок с кнопкой ответа (клавиатура), которую нужно визуализировать.

Создайте следующий блок (таймер на 0 секунд) с inline-кнопками (кнопки в тексте), которые должны быть размещены без удаления кнопок ответа. Например: [{"type": "inline", "text": "ИМЯ КНОПКИ", "line": 0, "index_in_line": 0}]

Вот результат:

Важно: при добавлении кнопок в одном блоке необходимо соблюдать следующий порядок:

  1. Сначала добавьте все кнопки ответа (клавиатуры).
  2. Затем добавьте любые Inline-кнопки.

Если этот порядок нарушен, кнопки ответа будут удалены при отправке следующего блока сообщения.