Telegram Mini App — Қадамдық нұсқаулық

Бұл не?#

Telegram Mini App сіздің клиенттеріңізге мейрамхананың сандық мәзірін Telegram ішінде ашуға мүмкіндік береді — қолданбаларды орнатпай және браузерге өтпей. Мәзір Telegram-ның табиғи бөлігі сияқты көрінеді: пайдаланушының тақырыбына бейімделеді, «Артқа» батырмасын және қимылдарды қолдайды.

Артықшылықтары#

• 📱 Telegram ішінде — клиентке браузерге ауысудың қажеті жоқ
• 🎨 Табиғи көрініс — түстер, қаріптер және тақырып Telegram-ға бейімделеді
• 🔗 Deep Links — нақты мейрамхананың мәзіріне тікелей сілтеме
• 🌍 Авто тіл — тіл пайдаланушының Telegram баптауларынан алынады
• 🍪 Cookies жоқ — cookie баннері Telegram ішінде көрсетілмейді

Жылдам бастау#

Қадам 1 — Бот жасаңыз#

Telegram-да @BotFather ашып, келесі команданы жіберіңіз:

/newbot

1. Боттың атын енгізіңіз (мысалы, Cenaly Menu Bot)
2. Пайдаланушы атын енгізіңіз (мысалы, MeniMenuBot) — Bot сөзімен аяқталуы керек
3. Алынған Bot Token сақтаңыз (формат: 123456789:ABCdefGHI...)

Bot Token не үшін қажет?#

Bot Token — бұл Telegram Bot API арқылы ботты бағдарламалық басқаруға арналған құпия кілт. Mini App-ты негізгі баптау үшін (2–4 қадамдар) ол қажет емес — бәрі BotFather арқылы жасалады. Бірақ егер сіз келесілерді жасағыңыз келсе, қажет болады:

• Клиенттерге хабарламалар жіберу — тапсырыс күйі туралы хабарламалар, акциялар, қарсы алу хабарламалары
• Бот хабарламаларына inline-кнопкалар қосу (мысалы, «📋 Мәзірді ашу» батырмасы — төмендегі бөлімді қараңыз)
• Тапсырыстарды қабылдау үшін Telegram-бот жасау — бот тапсырыстарды қабылдап, өңдей алады
• Webhook баптау — Telegram-дан оқиғаларды алу (батырмаларды басу, пайдаланушы командалары)
• CRM немесе POS жүйесімен интеграциялау — бот арқылы тапсырыстарды автоматты түрде өңдеу

Қадам 2 — Mini App жасаңыз#

BotFather-ға келесі команданы жіберіңіз:

/newapp

1. Тізімнен ботты таңдаңыз
2. Title — қолданбаның атауы (мысалы, Cenaly)
3. Description — сипаттама (мысалы, Digital restaurant menu)
4. Photo — 640×640 px суретін жүктеңіз (қолданба белгішесі)
5. GIF — анимация (міндетті емес). Өткізіп жіберу үшін /empty жіберіңіз
6. Web App URL — клиенттік қолданбаңыздың мекенжайын көрсетіңіз:

https://cenaly.com

7. Short Name — сілтеме үшін қысқа атау (мысалы, menu)

Осыдан кейін сізде келесі форматтағы жұмыс сілтемесі пайда болады:

https://t.me/YourBot/menu

Қадам 3 — Бот чатына «Мәзір» батырмасын қосыңыз#

BotFather-ға келесі команданы жіберіңіз:

/setmenubutton

1. Ботты таңдаңыз
2. URL жіберіңіз:

https://cenaly.com

3. Батырма мәтінін енгізіңіз (мысалы, Open Menu немесе 📋 Мәзір)

Енді ботпен чат ашқанда экранның төменгі жағында сіздің қолданбаңызды ашатын батырма пайда болады.

Қадам 4 — Доменді рұқсат етіңіз#

BotFather-ға келесі команданы жіберіңіз:

/setdomain

Ботты таңдаңыз және доменді көрсетіңіз:

cenaly.com

Бұл Telegram Web App-қа сіздің доменіңізде және оның барлық қосалқы домендерінде (мысалы, locationid.cenaly.com) жұмыс істеуге мүмкіндік береді.

Deep Links — нақты мейрамханаға сілтемелер#

Telegram startapp параметрін қолдайды, ол қолданба ашылғанда беріледі. Оны нақты мейрамханаға сілтемелер үшін пайдаланыңыз:

Мысалдар#

Егер сіздің мейрамханаңыздың LOCATION_ID — lnc2w74z болса:

https://t.me/YourBot/menu?startapp=lnc2w74z
https://t.me/YourBot/menu?startapp=lnc2w74z__ru
https://t.me/YourBot/menu?startapp=lnc2w74z__en

Боттан inline-кнопкалар#

Егер сіздің ботыңыз клиенттерге хабарламалар жіберсе, мәзірді ашатын inline-кнопканы қосуға болады:

Нұсқа 1 — Web App батырмасы (бірден ашылады)#

{
  "inline_keyboard": [[{
    "text": "📋 Мәзірді ашу",
    "web_app": {
      "url": "https://LOCATION_ID.cenaly.com/ru"
    }
  }]]
}

Нұсқа 2 — Deep Link батырмасы#

{
  "inline_keyboard": [[{
    "text": "📋 Мәзірді ашу",
    "url": "https://t.me/YourBot/menu?startapp=LOCATION_ID__ru"
  }]]
}

Автоматты түрде жұмыс істейтін функциялар#

Telegram ішінде қосылғаннан кейін автоматты түрде қосылады:

Мейрамханалар үшін QR-кодтар#

https://lnc2w74z.cenaly.com түріндегі URL-мен бар QR-кодтар әдеттегідей жұмыс істей береді — браузер арқылы.

Telegram-мен қосымша интеграция үшін үстелдерге ботқа сілтемесі бар екінші QR-кодты орналастыруға болады:

https://t.me/YourBot/menu?startapp=lnc2w74z

Жұмыс істеуін тексеру#

1. Телефонда https://t.me/YourBot/menu сілтемесін ашыңыз
2. Start батырмасын басыңыз (егер ботты алғаш рет ашсаңыз)
3. Чаттың төменгі панеліндегі 📋 Мәзір батырмасын басыңыз
4. Қолданба ашылып, мәзірді жүктегеніне көз жеткізіңіз
5. Deep link ашып көріңіз: https://t.me/YourBot/menu?startapp=LOCATION_ID

Жиі кездесетін мәселелер#

Пайдалы сілтемелер#

• Telegram Mini Apps құжаттамасы
• BotFather
• Telegram Bot API — Web App батырмалары