Nous vous recommandons de lire l'article Bouton.

Vous pouvez utiliser à la fois les boutons de réponse (boutons standard ou de clavier) et les boutons Inline (boutons dans le texte) dans Telegram.

Important : limitations des boutons

Veuillez prendre en compte les restrictions de plateforme suivantes lors de la création de boutons :

  • Boutons de réponse (clavier) : maximum de 12 boutons par ligne.
  • Boutons Inline : maximum de 8 boutons par ligne.
  • Texte du bouton : limité à 32 caractères.
  • Couleur du bouton : ne peut pas être personnalisée. Les boutons utilisent le style par défaut de la plateforme.

Comment créer un bouton dans un bloc

Pour créer un bouton dans un chatbot, allez dans les paramètres du bloc et cliquez sur l'onglet "Boutons" :

Ensuite, les paramètres d'ajout et de modification du bouton s'ouvriront. Cliquez ensuite sur Ajouter :

Une fenêtre de paramètres s'ouvrira, vous permettant de définir le libellé, l'action et les options supplémentaires du bouton.

Les types de boutons suivants sont uniquement disponibles pour le bot Telegram :

  • Bouton Partager – permet aux utilisateurs de partager du contenu.
  • Bouton Callback – envoie une requête de rappel silencieuse à votre bot.
  • Telegram WebApp – ouvre une mini-application (par exemple, un widget ou un site web) dans Telegram.
  • Connexion Telegram – autorise les utilisateurs via leur compte Telegram.

Il existe également d'autres boutons disponibles dans Telegram, tels que le paiement, la demande de numéro de téléphone ou de géolocalisation, et l'envoi d'un lien.

Bouton Partager

Lors de la création du bouton, sélectionnez "Partager (Telegram uniquement)" et remplissez les champs (champ de texte supplémentaire facultatif) :

Ce bouton vous permet de transférer les informations en sélectionnant un contact dans votre liste.

Saisissez l'URL que vous souhaitez partager dans le champ "Lien de partage" du bouton.

Une fois un contact sélectionné, le contenu des champs "Lien de partage" et "Texte supplémentaire" sera envoyé. Utilisez-le pour partager des liens vers des publications de chaînes Telegram et d'autres contenus.

Attention ! Cela peut ne pas fonctionner correctement sur certains appareils iOS.

Bouton de connexion au site web

Pour que le bouton de connexion fonctionne, votre bot doit d'abord être autorisé pour le domaine cible. Cette configuration se fait via @BotFather.

Étapes de configuration :

  1. Ouvrez une conversation avec @BotFather.
  2. Sélectionnez votre bot dans la liste.
  3. Choisissez Paramètres du bot > Domaine et ajoutez le domaine de votre site web.

Ensuite, allez sur le bouton Domaine :

Remarque : Le bouton indiquera Modifier le domaine si un domaine existe, ou Définir le domaine si un domaine doit être ajouté.

Il vous sera demandé de configurer le domaine pour votre bot :

Format de domaine correct :

Saisissez votre domaine comme mavibot.ai ou comme votredomaine.com si vous avez un site web connecté à MaviBot.

Étape suivante :

Une fois votre domaine vérifié et configuré, vous pouvez procéder à la création du bouton d'autorisation.

Dans le champ Texte, saisissez le libellé qui apparaîtra sur le bouton.

Ensuite, fournissez l'URL de la page dans le champ Lien où l'autorisation aura lieu.

Les champs restants seront nécessaires si un bot séparé est utilisé pour l'autorisation (vous devez obtenir l'autorisation d'envoyer des messages pour ce bot) : en particulier, vous devrez spécifier le nom du bot.

Si vous avez besoin de pouvoir envoyer des messages depuis le bot spécifié, assurez-vous de cocher la case "Demander l'autorisation à l'utilisateur pour envoyer des messages depuis le bot" :

Bouton de connexion Telegram

Bouton Callback

Le bouton Callback est un bouton de retour où le client voit une chose, et dans le bot nous obtenons le callback nécessaire pour lancer n'importe quel bloc de l'entonnoir.

C'est assez simple à créer : dans le champ Boutons, cliquez sur le bouton Ajouter. Dans le formulaire qui s'ouvre, saisissez le texte, spécifiez le type - Bouton Callback (Telegram) et saisissez le Texte du callback qui doit être renvoyé lorsque vous cliquez sur le bouton :

Visuellement, le bouton ressemble à un bouton inline standard :

Après avoir cliqué sur le bouton, vous verrez le Callback configuré dans la fiche du client :

C'est important !

Telegram ne prend pas en charge les boutons de clavier Callback.

Veuillez noter !

Si le type de bouton "Callback" est sélectionné, le bouton s'affichera comme un callback uniquement si le texte du bouton diffère du texte du callback.

Bouton d'application Web Telegram

Ce bouton permet d'ouvrir le site web en tant qu'application web dans Telegram.

Lors de l'ajout du bouton, spécifiez son libellé, sélectionnez le type de bouton d'application Web Telegram et fournissez le lien vers le site web qui s'ouvrira en tant qu'application web :

  • Vous pouvez spécifier un lien via une variable :

L'utilisation d'une variable pour un lien est très pratique lorsque la page cible ou l'adresse du site web change fréquemment.

Comment cela fonctionne :

  1. Définissez une variable (par exemple, landing_page_url) dans les paramètres de votre projet.
  2. Référencez cette variable (par exemple, #{landing_page_url}) dans tous les boutons d'application Web de vos flux.

Avantage : au lieu de mettre à jour manuellement l'URL dans chaque bloc de bouton individuel, vous devez seulement modifier la valeur de la variable une fois dans les paramètres du projet, et tous les boutons se mettront à jour automatiquement.

Alternative : vous pouvez bien sûr toujours spécifier une URL directe et statique directement dans les paramètres du bouton.

Comment créer des boutons pour les fonctions de l'API Telegram

Bien que travailler directement avec l'API du bot Telegram puisse être difficile, surtout pour les débutants, MaviBot offre une alternative beaucoup plus accessible.

Méthode : utiliser le code généré

Vous pouvez utiliser le code de bouton pré-généré à partir des paramètres avancés, éliminant ainsi le besoin d'écrire manuellement des appels API.

Étapes :

  1. Accédez aux paramètres de votre bloc et ouvrez la section Boutons.
  2. Utilisez l'interface pour ajouter et configurer tous vos boutons requis (texte, liens, fonctions).
  3. Le système générera automatiquement le code API Telegram correct en arrière-plan.

Cette approche vous permet de créer des claviers complexes visuellement tandis que la plateforme gère l'implémentation technique sous-jacente.

Cliquez sur "Paramètres avancés" pour voir le code API Telegram généré pour vos boutons.

Testez vos boutons, puis copiez le code généré depuis Paramètres avancés dans une variable comme buttons.

Cette fonction envoie un message via l'API Telegram avec les paramètres suivants : 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) :

Passez la variable buttons à la fonction dans le paramètre reply_markup :

Vos boutons apparaîtront dans la conversation avec la disposition et le style que vous avez définis.

Comment supprimer les boutons de réponse

Bien que les boutons du clavier disparaissent généralement automatiquement, ils peuvent parfois rester visibles.

Pour effacer de force les boutons de réponse persistants, insérez le code suivant dans le champ Paramètres avancés :

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

Cette configuration de bouton vide indique à Telegram de masquer le clavier personnalisé.

Boutons du menu clavier dans Telegram

Nous recommandons d'utiliser cette fonctionnalité uniquement pour les utilisateurs avancés !

Boutons du clavier

Pour pouvoir utiliser les boutons du clavier (réponse) comme menu Telegram permanent, il suffit d'attribuer n'importe quelle valeur à la variable tg_permanent_reply_buttons (la variable est déclarée comme constante du projet).

Variable : tg_permanent_reply_buttons

Définir la variable tg_permanent_reply_buttons vous donne un contrôle manuel complet sur la visibilité du clavier de réponse (boutons sous le message). Tout comportement de masquage automatique par la plateforme est désactivé.

Portée : ce paramètre s'applique à tous les boutons de réponse créés dans le bot pendant que la variable est active.

Revenir au comportement automatique

Pour restaurer le masquage automatique standard du clavier :

  1. Supprimez la variable tg_permanent_reply_buttons des paramètres de votre projet.
  2. Recréez les boutons de réponse qui ont été créés initialement pendant que la variable était active. Les boutons créés sous la règle "permanente" conservent cet état et doivent être recréés pour hériter du nouveau comportement automatique.

Comment créer un menu dans Telegram

Celui qui a créé le bot Telegram peut créer un tel menu.

Pour ce faire, écrivez à Botfather dans Telegram.

Entrez la commande /mybots, et la liste de vos bots s'ouvre. Choisissez celui dont vous avez besoin. Un menu s'ouvre pour vous. Ici, vous devez sélectionner Modifier le bot, puis Modifier les commandes.

Saisissez toutes les commandes et leurs descriptions dans un seul message, en utilisant des lettres minuscules pour les noms de commandes. Vous recevrez une confirmation lorsque la liste sera mise à jour.

Vous pouvez maintenant voir et utiliser le menu dans votre conversation Telegram avec le bot.

Lorsque vous cliquez sur le bouton du menu, une liste des commandes précédemment enregistrées dans BotFather s'ouvrira :

Ensuite, allez dans Mavibot, ouvrez le projet auquel ce bot Telegram est connecté.

Créez les blocs Démarrer ou Déclencheur, écrivez les commandes dans les conditions, et dans le champ "Texte du message" — les textes qui seront reçus en réponse.

Exemple :

Comment combiner deux types de boutons

Créez un bloc avec un bouton de réponse (clavier), que vous devez visualiser.

Créez le bloc suivant (un minuteur de 0 seconde) avec des boutons inline (boutons dans le texte), qui doivent être placés sans supprimer les boutons de réponse. Par exemple : [{"type": "inline", "text": "NOM DU BOUTON", "line": 0, "index_in_line": 0}]

Voici le résultat :

Important : vous devez suivre cet ordre lors de l'ajout de boutons dans le même bloc :

  1. D'abord, ajoutez tous les boutons de réponse (clavier).
  2. Ensuite, ajoutez les boutons Inline.

Si cette séquence est inversée, les boutons de réponse seront supprimés lors de l'envoi du bloc de message suivant.