soumyadeepdas/TbhRichBotPublic · Community Store Listing

Rich Message Demo [TBH]

ProfileTelegram
17 commands0 envUpdated 5d agoCreated Jul 16, 2026
Back to folder

commands/_richLayout.js

javascript · 114 lines · click line # to share

1/**#command2name: /richLayout3answer: 4keyboard: 5parse_mode: 6aliases: 7allow_only_group: false8need_reply: false9is_web: 010#command**/11 12const html = `13<h1>Layout Blocks</h1>14 15<p>This page demonstrates layout-related blocks introduced in Bot API 10.1.</p>16 17<hr/>18 19<h3>Navigation Anchors</h3>20<p>Select a section below to jump directly to it.</p>21<p><a href="#section1">Jump to Section 1</a></p>22<p><a href="#section2">Jump to Section 2</a></p>23<p><a href="#section3">Jump to Section 3</a></p>24 25<hr/>26 27<h2>Heading Level 2</h2>28<p>Headings help organize rich messages into logical sections.</p>29 30<h3>Heading Level 3</h3>31<p>Each heading becomes a RichBlockSectionHeading object.</p>32 33<h4>Heading Level 4</h4>34<p>Rich messages support six heading levels.</p>35 36<h5>Heading Level 5</h5>37<p>Useful for deeply structured content.</p>38 39<h6>Heading Level 6</h6>40<p>Smallest available heading size.</p>41 42<hr/>43 44<h3>Paragraph Blocks</h3>45<p>Paragraphs are the most common block type in rich messages.</p>46<p>Each paragraph becomes an individual RichBlockParagraph object.</p>47<p>Paragraphs can contain formatting, links, mentions, references and mathematical expressions.</p>48 49<hr/>50 51<h3>Collapsible Layouts</h3>52 53<details>54<summary>Closed Details Block</summary>55<p>This content is hidden by default and appears only after expanding the block.</p>56</details>57 58<details open>59<summary>Open Details Block</summary>60<p>This details block is expanded by default.</p>61</details>62 63<details>64<summary>Nested Details Example</summary>65<p>This is the parent details block.</p>66<details>67<summary>Nested Details Block</summary>68<p>This content is inside a nested details block.</p>69</details>70</details>71 72<hr/>73 74<a name="section1"></a>75<h3>Section 1</h3>76<p>This section demonstrates how anchors can jump to distant locations inside a rich message.</p>77<p>Anchor links are useful for large documents, guides and reports.</p>78 79<hr/>80 81<a name="section2"></a>82<h3>Section 2</h3>83<p>Anchors create navigation points that users can instantly jump to.</p>84<p>This demonstrates RichBlockAnchor together with RichTextAnchorLink.</p>85 86<hr/>87 88<a name="section3"></a>89<h3>Section 3</h3>90<p>Complex documents can contain multiple sections linked together through anchors.</p>91<p>This makes rich messages behave more like mini web pages.</p>92 93<hr/>94 95<h3>Document Footer</h3>96<p>Footers are commonly used for metadata, credits and document information.</p>97 98<footer>Bot API 10.1 • Layout Blocks Demo</footer>99`;100 101Api.call("editMessageText", {102  chat_id: chat.chatid,103  message_id: update.callback_query.message.message_id,104  rich_message: { html: html },105  reply_markup: {106    inline_keyboard: [107      [108        { text: "« Math", callback_data: "/richMath" },109        { text: "Home", callback_data: "/start" },110        { text: "Lists »", callback_data: "/richLists" }111      ]112    ]113  }114});