Home / API / Telegram Bot API – Keyboards and Callbacks

Telegram Bot API – Keyboards and Callbacks

Telegram Bot Api provides a nice feature to display Keyboards and process callbacks. In this tutorial we will see how to add Keyboard and Callback functionality replacing the basic text response. Check out the Getting started with Telegram BOT if you are yet to get started. This is the continuation of the Getting started article so make sure you have gone through it.

Before proceeding with the code update we need to upgrade the SDK version of telegram bot.

SDK Upgrade

Upgrade to SDK version 3.0

In you composer.json file just replace the line “irazasyed/telegram-bot-sdk”: “2.0” with the following package,

"irazasyed/telegram-bot-sdk": "dev-master"

and then run

composer update

Now we have the latest version of the SDK available installed in our laravel project. We are now good to use the Keyboard feature.

Include the Keyboard and Telegram classes in ApiController

app/Http/Controller/ApiController.php

Send message

use Telegram\Bot\Keyboard\Keyboard;
use Telegram;

I have also change the way the Telegram class is instantiated. As we have published the Telegram vendor file we do not have use the Api class anymore. The instantiation method has been changed from

$telegram = new Api(env('TELEGRAM_BOT_TOKEN'));
$telegram->sendMessage();

To

Telegram::sendMessage()

I have used keyboard only to display the menu. So showMenu() method has been modified to,

Keyboard

Keyboards are of two type One time keyboard and permanent keyboard. I have used the later. To use the One time keyboard check out this Documentation. Simply set the parameter ‘one_time_keyboard’ to true in the replyKeyboardMarkup method to use One Time Keyboard.

Hint: inline_keyboard shows keyboard in the chat screen itself where as keyboard will show keyboard beneath the typing area

Now when you send a command /start or menu Telegram will respond with a nice looking set of buttons as menu options instead of plain text commands

Now when a user clicks on a button a nice looking progress circle will be visible on the button until the command is served. This is similar to sending an Asynchronous HTTP request over the web.

Callback

Asynchronous request mean waiting for a callback! Your application must inform telegram that the request has been processed so that the user is notified and the progress circle will hide. For this we should use the answerCallbackQuery method. So when the data sent to the webhook URL the structure of the response changes and we have to handle this

So if the request from a user expects a callback query all your data is set under the callback_query parameter. So the webhook method put together looks like this

You should answer the callback only when $cbid is greater than 0 which hold the callback id. The text parameter in the answerCallbackQuery will show a message on top of Telegram application for a short span of time as an acknowledgement of completed callback query.

And that’s it!

Preview

About Ashik

I am a Full Stack Developer and love to work on APIs and Apps. Hardcore lover of Ionic and Laravel <3

Check Also

Private chatroom using socket.io, NodeJS and MySQL

As I promised to write a tutorial on Private chatroom with MySQL DB in the …

  • Junior Claudio Zavaleta

    Thanks!

Do you wan't to get notified?

I will not spam your inbox. I will only send email whenever I publish a new article or to share information about technology

You have Successfully Subscribed!