# Botones de Telegram para chatbots

{% hint style="info" %}
Le recomendamos que lea el artículo [Botón](/doc/es/chatbot/builder/botones.md#how-to-create-a-button).
{% endhint %}

Puede usar tanto los botones de respuesta (botones normales o del teclado) como los botones inline (botones en el texto) en Telegram.

{% hint style="info" %}
**Importante: limitaciones de los botones**

Tenga en cuenta las siguientes restricciones de la plataforma al crear botones:

* **Botones de respuesta (teclado):** máximo de **12 botones por fila**.
* **Botones inline:** Máximo de **8 botones por fila**.
* **Texto del botón:** Limitado a **32 caracteres**.
* **Color del botón:** **no se puede personalizar.** Los botones usan el estilo predeterminado de la plataforma.
  {% endhint %}

## Cómo crear un botón en un bloque

Para crear cualquier botón en un chatbot, vaya a la configuración del bloque y haga clic en **"Botones"** :

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

Luego se abrirán las configuraciones para agregar y editar el botón. Después haga clic en **Agregar**:

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

Se abrirá una ventana de configuración que le permitirá definir la etiqueta del botón, la acción y opciones adicionales.

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

Los siguientes tipos de botones **solo están disponibles para el bot de Telegram**:

* **Botón de compartir** – permite a los usuarios compartir contenido.
* **Botón de devolución de llamada** – envía una consulta de devolución de llamada silenciosa a su bot.
* **Telegram WebApp** – abre una miniaplicación (por ejemplo, un widget o un sitio web) dentro de Telegram.
* **Inicio de sesión de Telegram** – autoriza a los usuarios a través de su cuenta de Telegram.

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

También hay otros botones disponibles en Telegram, como pago, solicitar un número de teléfono o geolocalización, y enviar un enlace.

### Botón de compartir

Al crear el botón, seleccione "**Compartir (solo Telegram)"** y complete los campos (campo de texto adicional opcional):

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

Este botón le permite reenviar la información seleccionando un contacto de su lista.

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

Introduzca la URL que desea compartir en el **"Enlace para compartir"** campo.

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

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

del botón. Una vez seleccionado un contacto, se enviará el contenido de los campos **"Enlace para compartir"** y **"Texto adicional"** . Utilícelo para compartir enlaces a publicaciones de canales de Telegram y otros contenidos.

{% hint style="info" %}
¡Atención! Puede que no funcione correctamente en algunos dispositivos iOS.
{% endhint %}

### Botón de inicio de sesión para sitio web

Para que el botón de inicio de sesión funcione, su bot primero debe estar autorizado para el dominio de destino. Esta configuración se realiza a través de **@BotFather**.

**Pasos para configurar:**

1. Abra un chat con [@BotFather](https://t.me/botfather).
2. Seleccione su bot de la lista.
3. Elige **Configuración del bot** > **Dominio** y añada el dominio de su sitio web.

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

A continuación, ve a la **Dominio** botón:

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

**Nota:** El botón dirá **Editar dominio** si existe un dominio, o **Establecer dominio** si hay que añadir uno.

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

Se le pedirá que configure el dominio para su bot:

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

**Formato correcto del dominio:**

Introduzca su dominio como `mavibot.ai` o como `sudominio.com` si tiene un sitio web conectado a MaviBot.

**Siguiente paso:**

Una vez que su dominio esté verificado y configurado, puede proceder a crear el botón de autorización.

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

En la **Texto** campo, introduzca la etiqueta que aparecerá en el botón.

Después, proporcione la URL de la página en el campo **Enlace** donde tendrá lugar la autorización.

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

Los campos restantes serán necesarios si se usa un bot separado para la autorización (debe obtener permiso para enviar mensajes con este bot): en particular, deberá especificar el nombre del bot.

Si necesita poder enviar mensajes desde el bot especificado, asegúrese de marcar la casilla de **"Solicitar permiso al usuario para enviar mensajes desde el bot"**:

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

Botón de inicio de sesión de Telegram

### Botón de devolución de llamada

El botón de callback es un botón de respuesta cuando el cliente ve una cosa, y en el bot obtenemos el callback que necesitamos para lanzar cualquier bloque del embudo.

Es bastante simple crearlo: en el **Botones** campo, haga clic en el botón **Agregar** . En el formulario que se abre, introduzca el texto, especifique el tipo - Botón Callback (Telegram) e introduzca el **Texto del callback** que debe devolverse al hacer clic en el botón:

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

Visualmente, el botón se parece a un botón inline normal:

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

Después de hacer clic en el botón, verá el **Callback** configurado en la tarjeta del cliente:

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

{% hint style="info" %}
¡Es importante!

Telegram no admite botones de teclado Callback.
{% endhint %}

{% hint style="info" %}
¡Ten en cuenta!

Si el **"Callback"** tipo de botón está seleccionado, el botón se mostrará como callback solo si el texto del botón difiere del texto del callback.
{% endhint %}

### Botón de Aplicación Web de Telegram

Este botón le permite abrir el sitio web como una aplicación web en Telegram.

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

Al agregar el botón, especifique su etiqueta, seleccione el tipo de botón Telegram Web App y proporcione el enlace al sitio web que se abrirá como una aplicación web:

* Puede especificar un enlace mediante una variable:

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

Usar una variable para un enlace es muy práctico cuando la página de destino o la dirección del sitio web cambian con frecuencia.

**Cómo funciona:**

1. Defina una variable (por ejemplo, `landing_page_url`) en la configuración de su proyecto.
2. Haga referencia a esta variable (por ejemplo, `#{landing_page_url}`) en todos los botones Web App de sus flujos.

**Beneficio:** en lugar de actualizar manualmente la URL en cada bloque de botón individual, solo necesita cambiar el valor de la variable una vez en la configuración del proyecto, y todos los botones se actualizarán automáticamente.

**Alternativa:** por supuesto, también puede especificar una URL directa y estática directamente en la configuración del botón.

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

## Cómo crear botones para funciones de la API de Telegram

Aunque trabajar directamente con la Telegram Bot API puede ser un desafío, especialmente para principiantes, MaviBot ofrece una alternativa mucho más accesible.

**Método: usar código generado**

Puede utilizar el **código de botón pre-generado** de la configuración avanzada, eliminando la necesidad de escribir llamadas a la API manualmente.

**Pasos:**

1. Vaya a la configuración de su bloque y abra **Botones** sección.
2. Utilice la interfaz para agregar y configurar todos los botones que necesite (texto, enlaces, funciones).
3. El sistema generará automáticamente el código correcto de la API de Telegram en segundo plano.

Este enfoque le permite crear teclados complejos visualmente mientras la plataforma se encarga de la implementación técnica subyacente.

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

Haz clic en **"Configuración avanzada"** para ver el código generado de la API de Telegram para sus botones.

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

Pruebe sus botones y luego copie el código generado de **Configuración avanzada** en una variable como `buttons`.

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

Esta función envía un mensaje a través de la API de Telegram con los siguientes parámetros: 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):

Pase la variable de botones a la función en el parámetro reply\_markup:

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

Sus botones aparecerán en el chat con el diseño y estilo que haya definido.

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

## Cómo eliminar los botones de respuesta

Aunque los botones de teclado suelen desaparecer automáticamente, a veces pueden permanecer visibles.

Para eliminar a la fuerza los botones de respuesta que permanezcan, inserte el siguiente código en el **Configuración avanzada** :

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

Esta configuración vacía de botones indica a Telegram que oculte el teclado personalizado.

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

### Botones de menú del teclado en Telegram

{% hint style="warning" %}
¡Recomendamos usar esta función solo para usuarios avanzados!
{% endhint %}

### Botones de teclado

Para poder usar los botones de teclado (respuesta) como un menú permanente de Telegram, basta con asignar cualquier valor a la variable tg\_permanent\_reply\_buttons (la variable se declara como constante del proyecto).

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

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

#### **Variable: `tg_permanent_reply_buttons`**

Configurar la variable **`tg_permanent_reply_buttons`** le da **control manual total** sobre la visibilidad del teclado de respuesta (botones debajo del mensaje). Todo el comportamiento automático de ocultación de la plataforma queda desactivado.

**Alcance:** esta configuración se aplica a **todos** los botones de respuesta creados en el bot mientras la variable esté activa.

#### **Volver al comportamiento automático**

Para restaurar la ocultación automática estándar del teclado:

1. **Elimine la variable `tg_permanent_reply_buttons`** de la configuración de su proyecto.
2. **Vuelva a crear los botones de respuesta** que se crearon originalmente mientras la variable estaba activa. Los botones creados bajo la regla "permanente" conservan ese estado y deben volver a crearse para heredar el nuevo comportamiento automático.

## Cómo crear un menú en Telegram

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

Quien creó el bot de Telegram puede crear un menú de este tipo.

Para hacerlo, escriba a [Botfather](https://t.me/BotFather) en Telegram.

Introduzca el comando /mybots y se abrirá la lista de sus bots. Elija el que necesite. Se abrirá un menú para usted. Aquí debe seleccionar **Editar bot**y luego **Editar comandos**.

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

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

Introduzca todos los comandos y sus descripciones en un solo mensaje, usando letras minúsculas para los nombres de los comandos. Recibirá una confirmación cuando la lista se actualice.

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

Ahora puede ver y usar el menú en su chat de Telegram con el bot.

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

Cuando haga clic en el botón del menú, se abrirá una lista de comandos que se registraron previamente en BotFather:

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

A continuación, vaya a Mavibot, abra el proyecto al que está conectado este bot de Telegram.

Cree los **Inicio** o **Disparador** bloques, escriba comandos en las condiciones, y en el campo **"Texto del mensaje"** los textos que se recibirán como respuesta.

Ejemplo:

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

## Cómo combinar dos tipos de botones

Cree un bloque con un botón de respuesta (teclado), que necesita visualizar.

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

Cree el siguiente bloque (un temporizador de 0 segundos) con botones inline (botones en el texto), que deben colocarse sin eliminar los botones de respuesta. Por ejemplo: \[{"type": "inline", "text": "NOMBRE DEL BOTÓN", "line": 0, "index\_in\_line": 0}]

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

Aquí está el resultado:

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

{% hint style="success" %}
**Importante:** debe seguir este orden al agregar botones en el mismo bloque:

1. **Primero,** agregue todos los botones de Respuesta (teclado).
2. **Después,** agregue cualquier botón Inline.

Si se invierte esta secuencia, los botones de respuesta se eliminarán cuando se envíe el siguiente bloque de mensaje.
{% 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/es/chatbot/mensajeros/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.