> For the complete documentation index, see [llms.txt](https://vitrina-blogerov.gitbook.io/bloggers-showcase/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vitrina-blogerov.gitbook.io/bloggers-showcase/prilozheniya/primer-oformleniya-telegram-bota.md).

# Пример оформления Telegram бота

Можете ознакомиться с оформлением демоверсии:

<p align="center"><a href="https://t.me/showcase_demo_ru_bot" class="button primary">Перейти к ДЕМО</a></p>

{% hint style="info" %}
Подробные рекоммендации описаны в разделе "Рекоммендации по оформлению. Telegram бот".
{% endhint %}

Большая часть оформления реализована с помощью нативных возможностей Telegram и настраивается через BotFather. Отдельные элементы, связанные с работой самой витрины, создаются автоматически при подключении бота или управляются через административную панель.

Все фотографии, видео, обложки и служебные изображения демоверсии подготовлены в той же тёмно-синей цветовой схеме, что и интерфейс витрины. Благодаря этому бот воспринимается не как отдельный технический посредник, а как полноценная часть продукта.

{% hint style="info" %}
Приветственный блок What can this bot do?, настраиваемый через BotFather, и сообщение, которое бот отправляет после запуска, — разные элементы. В демоверсии оформлены оба.
{% endhint %}

### Профиль бота

Для демоверсии подготовлена отдельная аватарка в цветовой схеме витрины. Она используется в профиле, списке чатов и уведомлениях, поэтому бот остаётся узнаваемым даже за пределами мини-приложения.

Через BotFather также заполнены основные сведения о боте:

* название;
* краткая информация профиля — About;
* описание возможностей — Description;
* медиа для приветственного блока;
* локализованные тексты для выбранной языковой версии.

Поле About отображается в профиле и кратко объясняет назначение бота. Description показывается новым пользователям в блоке What can this bot do? до начала диалога.

Тексты в демоверсии не перегружены техническими подробностями. Они коротко объясняют назначение продукта и направляют пользователя к просмотру возможностей витрины.

### Приветственный блок Telegram

До запуска бота пользователь видит оформленный Telegram блок What can this bot do?. В интерфейсе BotFather его настройки объединены в разделе Welcome message.

<div data-with-frame="true"><figure><img src="https://2999607467-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuwCSpQuu1p5soxSClCET%2Fuploads%2FwXVhROHJl2iI2dDSivX8%2F%D0%B0%D0%B2%D0%B0%D1%82%D0%B0%D1%80%D0%BA%D0%B0%20%D0%B8%20%D1%87%D1%82%D0%BE%20%D1%83%D0%BC%D0%B5%D0%B5%D1%82%20%D1%8D%D1%82%D0%BE%D1%82%20%D0%B1%D0%BE%D1%82.png?alt=media&amp;token=b92aca06-2d53-4486-88b1-be5737475b5e" alt=""><figcaption></figcaption></figure></div>

В демоверсии этот блок содержит:

* фирменное изображение;
* короткий заголовок;
* описание назначения бота;
* призыв ознакомиться с пользовательской частью витрины.

Изображение оформлено в той же цветовой схеме, что и карточки блогеров, фон мини-приложения и остальные материалы. За счёт этого фирменный стиль появляется ещё до отправки пользователем первого сообщения.

Этот блок является нативной частью профиля Telegram. Он настраивается через BotFather и не зависит от приветственного сообщения, отправляемого самим ботом.

### Приветственное сообщение бота

После запуска бот отправляет собственное приветственное сообщение. Его текст и медиафайл настраиваются через административную панель витрины.

{% file src="/files/2Ao53Nz3ra13uBrbdu6W" %}

К сообщению можно прикрепить фотографию или видео. В демоверсии используется небольшой анимированный постер с карточкой и надписью. Он продолжает визуальный стиль профиля и мини-приложения, но уже является частью обычного диалога с ботом.

Администратор может заменить текст или медиа приветствия без изменения исходного кода и повторной настройки бота через BotFather. Это позволяет использовать приветственное сообщение для презентации агентства, объяснения назначения витрины или размещения актуального предложения.

### Кнопка мини-приложения в чате

При установке нового бота или его замене через административную панель система автоматически создаёт кнопку запуска мини-приложения рядом с полем ввода сообщения.

<div data-with-frame="true"><figure><img src="https://2999607467-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuwCSpQuu1p5soxSClCET%2Fuploads%2FONBXlsCSuXMUSzuiBu2Y%2F%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B0%20%D0%BC%D0%B8%D0%BD%D0%B8-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F%20%D0%BD%D0%B0%20%D1%87%D0%B0%D1%82%D0%B5%20%D0%B1%D0%BE%D1%82%D0%B0%20%D0%B8%20%D1%84%D0%BE%D1%80%D0%BC%D0%B0%D1%82%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%20%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B8.png?alt=media&amp;token=aca1ca96-281f-4a68-9ed0-74afee121408" alt=""><figcaption></figcaption></figure></div>

Для неё автоматически задаются текст и адрес соответствующей версии витрины. После нажатия мини-приложение открывается непосредственно внутри Telegram.

{% hint style="success" %}
Кнопка меню создаётся системой автоматически при подключении бота. Настраивать её вручную через BotFather не требуется.
{% endhint %}

Такая кнопка остаётся доступной в чате постоянно. Пользователю не приходится искать старое сообщение со ссылкой или повторно отправлять команду запуска.

### Основное мини-приложение

Это отдельная нативная интеграция Telegram. Она добавляет возможность открыть витрину непосредственно из профиля бота и использовать прямые ссылки на мини-приложение.

В демонстрационной версии указаны:

* адрес витрины;
* полноэкранный режим запуска;
* параметры прямой ссылки;
* фирменное превью;
* собственный экран загрузки.

Полноэкранный режим позволяет использовать всю доступную область Telegram. После открытия пользователь сразу попадает в каталог блогеров без промежуточных страниц и перехода во внешний браузер.

Кнопку в профиле и кнопку меню возле поля ввода не следует путать. Первая является частью настроек основного мини-приложения в BotFather. Вторая создаётся системой через Telegram Bot API и обеспечивает постоянный доступ к витрине непосредственно из чата.

### Превью прямой ссылки

Для прямой ссылки на мини-приложение через BotFather настроены отдельные метаданные:

* обложка;
* название;
* краткое описание;
* адрес мини-приложения.

<div data-with-frame="true"><figure><img src="https://2999607467-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuwCSpQuu1p5soxSClCET%2Fuploads%2FKGlrQuEQA1IwDSwzTQo4%2F%D0%BF%D1%80%D0%B5%D0%B2%D1%8C%D1%8E%20%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B8%20%D0%BC%D0%B8%D0%BD%D0%B8-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F.png?alt=media&amp;token=1acc10f6-4194-4d42-90fd-637844fa7256" alt=""><figcaption></figcaption></figure></div>

Когда ссылка отправляется в Telegram, пользователь видит не голый URL, а оформленное превью. В демоверсии для него используется изображение из той же серии, что аватарка, приветственный блок и остальные материалы.

Название сообщает, что по ссылке открывается демонстрационная витрина, а описание кратко объясняет её назначение. Такое превью делает ссылку узнаваемой и сразу показывает пользователю, куда ведёт переход.

### Экран загрузки мини-приложения

Пока интерфейс витрины загружается, Telegram показывает нативный экран запуска — Launch Screen, также называемый Splash Screen.

<div data-with-frame="true"><figure><img src="https://2999607467-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FuwCSpQuu1p5soxSClCET%2Fuploads%2FvbCjYPqTtD7q1hh85wYK%2F%D1%86%D0%B2%D0%B5%D1%82%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%20%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B8%20%D0%B8%20%D0%BB%D0%BE%D0%B3%D0%BE%D1%82%D0%B8%D0%BF%20%D0%BD%D0%B0%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B5%20%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B8.png?alt=media&amp;token=7b500eb7-f29a-4f98-a23e-1eca57624f79" alt=""><figcaption></figcaption></figure></div>

В демоверсии для него настроены:

* фирменная иконка;
* цвет фона;
* цвет верхней области;
* параметры отображения для темы Telegram.

Цвета экрана загрузки совпадают с основной палитрой витрины. Поэтому между нажатием кнопки и появлением интерфейса не возникает резкой смены оформления. Пользователь видит один непрерывный переход: профиль бота, запуск, экран загрузки и каталог воспринимаются как части одного приложения.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://vitrina-blogerov.gitbook.io/bloggers-showcase/prilozheniya/primer-oformleniya-telegram-bota.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.