# Кнопки Telegram для чат-ботов

{% hint style="info" %}
Мы рекомендуем вам прочитать статью [Кнопка](/doc/ru/chatbot/builder/knopki.md#how-to-create-a-button).
{% endhint %}

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

{% hint style="info" %}
**Важно: ограничения на кнопки**

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

* **Кнопки ответа (клавиатура):** максимум **12 кнопок в строке**.
* **Встроенные кнопки:** Максимум **8 кнопок в строке**.
* **Текст кнопки:** Ограничено **32 символами**.
* **Цвет кнопки:** **не может быть изменена.** Кнопки используют стиль платформы по умолчанию.
  {% endhint %}

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

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

<div data-with-frame="true"><figure><img src="/files/f4de7bf79fee5a66d6e1650867c51691e86c6ef4" alt=""><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/954ba3f2f5d47fe2cc678c3c8cb030b19e8e9af3" alt=""><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/11ca668d9b234a9770d52b5cb571f3b55bf50ad6" alt="" width="563"><figcaption></figcaption></figure></div>

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

* **кнопка «Поделиться»** — позволяет пользователям делиться контентом.
* **кнопка обратного звонка** — отправляет боту тихий callback-запрос.
* **Telegram WebApp** — открывает мини-приложение (например, виджет или сайт) внутри Telegram.
* **Telegram login** — авторизует пользователей через их аккаунт Telegram.

<div data-with-frame="true"><figure><img src="/files/ff70e16ac4ac5c20c4d4c17ae89c0005f87fa718" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

При создании кнопки выберите "**Share (только Telegram)"** и заполните поля (необязательное дополнительное текстовое поле):

<div data-with-frame="true"><figure><img src="/files/5bd6ac9a4cf5178f6d6642732a705c7dfa909c97" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/fdc311e5d2fca634b28bcf901631627f8f2837ba" alt="" width="563"><figcaption></figcaption></figure></div>

Введите URL, которым вы хотите поделиться, в поле кнопки **"Share link"** .

<div data-with-frame="true"><figure><img src="/files/740b36288b29c5ba2486f3605dcef6f0aa9d5dbe" alt="" width="563"><figcaption></figcaption></figure></div>

<div data-with-frame="true"><figure><img src="/files/f41f119669c28c2e439748e606975874d27c1807" alt="" width="563"><figcaption></figcaption></figure></div>

После выбора контакта будет отправлено содержимое полей **"Share link"** и **"Additional text"** Используйте это, чтобы делиться ссылками на посты Telegram-каналов и другим контентом.

{% hint style="info" %}
Внимание! На некоторых устройствах iOS это может работать некорректно.
{% endhint %}

### Кнопка входа на сайт

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

**Шаги по настройке:**

1. Откройте чат с [@BotFather](https://t.me/botfather).
2. Выберите вашего бота из списка.
3. Выберите **Bot Settings** > **домен** и добавьте домен вашего сайта.

<div data-with-frame="true"><figure><img src="/files/874bd8c584561d3710e2130ee3435b8aa86db7b2" alt="" width="563"><figcaption></figcaption></figure></div>

Далее перейдите в **домен** :

<div data-with-frame="true"><figure><img src="/files/47f42a8ecb52e2aa42b0c9e4e7b0563d37f5269e" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/032744b4f8163b19bb6d9284001b1eb836c40ef8" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/c93f6e34941ec5f696c67e4845201885b6cb2a7b" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

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

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

<div data-with-frame="true"><figure><img src="/files/10218ef06d557ed0c23e1ce7bb6b33bb340bca15" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

<div data-with-frame="true"><figure><img src="/files/970228d1e00c73bdf875df21dfa4622f632eef9d" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

<div data-with-frame="true"><figure><img src="/files/4ab2c0edbec193ddc156ad6f14c6c7e3284869b3" alt="" width="563"><figcaption></figcaption></figure></div>

Кнопка Telegram login

### кнопка обратного звонка

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

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

<div data-with-frame="true"><figure><img src="/files/cf50950fd3f7a76ca3f9f57144897a4eac30a667" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/95b524cb23dcc6141d025935eb36b6894274d377" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/a64348a56adaa5f656ef24d78444ae29cf58fd34" alt="" width="563"><figcaption></figcaption></figure></div>

{% hint style="info" %}
Важно!

Telegram не поддерживает callback-кнопки клавиатуры.
{% endhint %}

{% hint style="info" %}
Обратите внимание!

Если **Если выбран тип кнопки "** Callback"
{% endhint %}

### Кнопка Telegram Web Application

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

<div data-with-frame="true"><figure><img src="/files/2a930eff93b5869b1279acbb2d25398fe501e52b" alt="" width="375"><figcaption></figcaption></figure></div>

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

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

<div data-with-frame="true"><figure><img src="/files/ad9544b2eaa635fff041accc61f1bfcda080c4ec" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

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

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

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

<div data-with-frame="true"><figure><img src="/files/8559a78f0e586dd8f8b45ffee5f394cf691315aa" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

**Способ: используйте сгенерированный код**

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

**Шаги:**

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

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

<div data-with-frame="true"><figure><img src="/files/dd3454579b4ba3c84262db4a58c83d84b6398400" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/0c60cffe930862acf1c36baf10945a475963370f" alt="" width="375"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/1fb5491f0892a996a3d3f154e69bc86c43c816f8" alt="" width="375"><figcaption></figcaption></figure></div>

Эта функция отправляет сообщение через 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):

Передайте переменную с кнопками в функцию в параметре reply\_markup:

<div data-with-frame="true"><figure><img src="/files/0d8decdaf11c3df94e2408f93af46c5f9eb9f893" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/42f1e8dbae7b5d5627bd222352b55bb3b7f79fc3" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

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

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

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

<div data-with-frame="true"><figure><img src="/files/2a87cfdc7680fdbecaf0a2eaf57818401e2672c1" alt="" width="563"><figcaption></figcaption></figure></div>

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

{% hint style="warning" %}
Мы рекомендуем использовать эту функцию только опытным пользователям!
{% endhint %}

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

Чтобы можно было использовать кнопки клавиатуры (reply) как постоянное меню Telegram, достаточно присвоить любое значение переменной tg\_permanent\_reply\_buttons (переменная объявлена как константа проекта).

<div data-with-frame="true"><figure><img src="/files/3d8e06e5c7d0f4a63329a543a23760d22b96aae7" alt="" width="370"><figcaption></figcaption></figure></div>

<div data-with-frame="true"><figure><img src="/files/be679a0d35e9609807ecad4b6d8c10394d480063" alt="" width="563"><figcaption></figcaption></figure></div>

#### **Переменная: `tg_permanent_reply_buttons`**

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

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

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

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

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

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

<div data-with-frame="true"><figure><img src="/files/0ad66f3bf0ceffbd159456111280ba0a214404eb" alt="" width="563"><figcaption></figcaption></figure></div>

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

Для этого напишите в [Botfather](https://t.me/BotFather) в Telegram.

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

<div data-with-frame="true"><figure><img src="/files/9affd5b62dfde7f31890ae94afb4f713d1c32c8a" alt="" width="563"><figcaption></figcaption></figure></div>

<div data-with-frame="true"><figure><img src="/files/19c11b3c461bb0ef11715fcee42d0bf8b85d48e9" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/b9fd5f644344a9527da1536a6a3971287438557e" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/1620ed29c3999d0c56e40d908d9ca3b7a9e18b97" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/95d573f5b7efa22dc8517e1f5246ff1ed867a751" alt="" width="563"><figcaption></figcaption></figure></div>

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

Создайте **Start** или **Trigger** блоки, пропишите команды в условиях, и в поле **"Message text"** — тексты, которые будут получены в ответ.

Пример:

<div data-with-frame="true"><figure><img src="/files/6b136977049c5d7636479d1198199956336b49c0" alt="" width="563"><figcaption></figcaption></figure></div>

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

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

<div data-with-frame="true"><figure><img src="/files/b4b584de03c76110f12f6826e5b36429ba1ea34e" alt="" width="563"><figcaption></figcaption></figure></div>

Создайте следующий блок (таймер 0 секунд) с inline-кнопками (кнопками в тексте), которые должны быть размещены без удаления кнопок ответа. Например: \[{"type": "inline", "text": "BUTTON NAME", "line": 0, "index\_in\_line": 0}]

<div data-with-frame="true"><figure><img src="/files/28d1e60151290707128dab83a380f1dbf98e3c71" alt="" width="563"><figcaption></figcaption></figure></div>

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

<div data-with-frame="true"><figure><img src="/files/0a7a8860015d1e9ae5d363f8f60b422f84ff662a" alt="" width="563"><figcaption></figcaption></figure></div>

{% hint style="success" %}
**Важно:** при добавлении кнопок в одном и том же блоке необходимо соблюдать такой порядок:

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

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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mavibot.ai/doc/ru/chatbot/messendzhery/telegram/buttons.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.