Botones de Telegram para chatbots

circle-info

Le recomendamos que lea el artículo Botón.

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

circle-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.

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" :

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

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

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.

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):

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

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

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.

circle-info

¡Atención! Puede que no funcione correctamente en algunos dispositivos iOS.

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 @BotFatherarrow-up-right.

  2. Seleccione su bot de la lista.

  3. Elige Configuración del bot > Dominio y añada el dominio de su sitio web.

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

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

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

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.

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.

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":

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:

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

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

circle-info

¡Es importante!

Telegram no admite botones de teclado Callback.

circle-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.

Botón de Aplicación Web de Telegram

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

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:

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.

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.

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

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

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:

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

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 :

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

Botones de menú del teclado en Telegram

circle-exclamation

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).

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

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

Para hacerlo, escriba a Botfatherarrow-up-right 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 boty luego Editar comandos.

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.

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

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

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:

Cómo combinar dos tipos de botones

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

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}]

Aquí está el resultado:

circle-check

Última actualización