Bots can offer their users HTML5 games to play solo or to compete against each other in groups and one-on-one chats. Games are a new type of content on Telegram that your bot can send to users.
Check out the Web App Manual for details.
To get started, send the
/newgame command to @BotFather.You will be prompted for a description text and a photo. You can also upload an optional GIF animation that demostrates your game to the users to make messages with the game more attractive (check out Lumberjack or Corsairs for examples).
When this button is pressed, your bot gets a callback query that indicates the requested game. You provide the correct URL for this particular user and the app automatically opens the game in the in-app browser.
If you send the game message without any buttons, it will automatically have a 'Play GameName' button. You can manually add multiple buttons to your game message. Please note that the first button in the first row must always be the one that launches the game. You can add more buttons: e.g., for a description of the rules, or a button that links to the game's official community.
The message with your game will also display high scores for the current chat. When a new high score is set, a service message will be sent to the chat and the message with the current scoreboard will be updated. You can also request the necessary data for building in-game high score tables.
There are many way for users to spread your game virally if they like it. The interface will always have the standard system button for sharing the game in the top right corner:
You can also create an additional Share button inside your HTML page. Pressing this button will send the game to a desired chat along with the user's best score in the game.
<a href="/file/811140189/2/SLwHmToemfg.91233/a242854be2b500b4cb" target="_blank"><img src="/file/811140189/2/SLwHmToemfg.91233/a242854be2b500b4cb" title="Gamee: share button" style="width: 295px; padding: 15px 20px;" /></a>
To add the sharing button, include this script at the end of the
<body> tag on your page:
Then use the method
TelegramGameProxy.shareScore() to call the sharing option.
Warning: Do not call this method without consent and direct action from the user.
<button onclick="TelegramGameProxy.shareScore()">Share score</button>
This library will only work when launched from inside Telegram, so please don't use it on ordinary web pages.
If your URL is using a fragment identifier, please note that Telegram Apps could add certain service parameters to the fragment id. The names for such parameters will start in
tg (you can check the code that adds them here). Use the
TelegramGameProxy.initParams object if you need to read your own parameters from the fragment id.
Please make sure that your HTML5 page is responsive and works well on all Telegram apps and supported platforms. If you find it impossible to support certain conditions or platforms, don't leave your users hanging and at least provide a notification.
See the Bot API Manual for the relevant methods and objects.