Создание мини-приложения в WinWinBot

Мини-приложения — это встроенные веб-приложения, которые работают внутри Telegram без установки дополнительных программ. Подписчики открывают мини-приложение прямо в мессенджере через кнопку в сообщении или меню бота.

Типы мини-приложений в WinWinBot

В WinWinBot доступно два типа мини-приложений. Они отличаются назначением и внешним видом.

Навигационное меню

Структурированное меню с разделами для доступа к контенту бота. Подписчики видят список секций (разделы), нажимают на интересующий раздел и переходят к контенту.

Примеры использования:

каталог курсов с разделами по темам;
библиотека материалов (статьи, видео, документы);
меню услуг с описанием и записью;
база знаний с категориями вопросов.

Интернет-магазин

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

Примеры использования:

онлайн-магазин с одеждой, аксессуарами, техникой;
продажа цифровых продуктов (курсы, шаблоны, доступы);
доставка еды с меню и корзиной;
продажа билетов на мероприятия.

Создание мини-приложения

Открываем раздел Контент → Мини-приложения.
Нажимаем кнопку Создать мини-приложение в правом верхнем углу.
Выбираем тип мини-приложения.
Нажимаем Продолжить.

Создание навигационного меню

После выбора типа Навигационное меню переходим к настройке приложения.

Основные параметры

Имя Вводим название мини-приложения для внутреннего использования. Это имя отображается в списке мини-приложений в личном кабинете.

Секции навигации

Секции — это разделы меню, которые видит подписчик. Каждая секция содержит список элементов (лонгриды, курсы, товары, ссылки).

Нажимаем Добавить секцию.
Заполняем Название секции — имя раздела, которое увидит пользователь (например, «О нас», «Материалы», «Курсы»).
В поле Введите описание секции добавляем краткое пояснение (опционально).
Выбираем Тип элемента, который будет в секции.

Секции отображаются в приложении в порядке добавления. Для изменения порядка зажимаем кнопку мыши на трёх полосках и перетаскиваем секции.

Дополнительные поля

Раздел Дополнительные поля содержит два блока: Изображение и Описание.

Изображение мини-приложения Загружаем обложку, которая отображается в верхней части мини-приложения.

Нажимаем Выберите файл.
Выбираем изображение с компьютера.

Описание мини-приложения Добавляем текстовое описание с форматированием. Используем редактор для оформления текста: полужирный, курсив, списки, ссылки.

Настройки доступа

Ограничиваем доступ к мини-приложению для определённых групп подписчиков.

Сегмент Выбираем сегмент пользователей, которым доступно мини-приложение. Если сегмент не выбран, приложение доступно всем.

Лонгрид Связываем мини-приложение с лонгридом.

Если подписчик откроет ссылку мини-приложения, но не входит в выбранный сегмент (например, не имеет оплаченного доступа), приложение не отобразится. Вместо него пользователь увидит указанный лонгрид.

Настройки отображения

Управляем видимостью элементов интерфейса мини-приложения.

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

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

Сохраняем настройки.

Создание интернет-магазина

После выбора типа Интернет-магазин переходим к настройке приложения.

Основные параметры

Имя — водим название мини-приложения.

Настройки магазина

Платежная интеграция Выбираем платёжную систему для приёма оплаты.

Товары магазина

Добавляем товары и категории для каталога.

Нажимаем Добавить категорию.
Вводим Название категории.
Включаем переключатель Показывать категорию, чтобы покупатели видели эту категорию в каталоге. Скрытые категории не отображаются.
Нажимаем Сохранить.

Нажимаем +Добавить товар внутри категории.
Выбираем товар из списка созданных продуктов.
Повторяем процесс для каждой категории и товара.

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

Юридическая информация

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

Доступные чек-боксы:

Пользовательское соглашение — покупатель принимает условия соглашения перед покупкой.
Политика обработки персональных данных — подтверждение согласия с политикой конфиденциальности.
Согласие на рассылку — подписчик соглашается получать информационные и рекламные сообщения.
Согласие на обработку персональных данных — отдельное согласие на обработку ПД.

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

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

Когда использовать:

если ваш бизнес работает с персональными данными и требует явного согласия по закону;
если хотите подключить email-рассылки и нужно зафиксировать согласие пользователя.

Дополнительные поля

Настраиваем изображение и описание аналогично навигационному меню.

Изображение мини-приложения Загружаем обложку магазина (логотип, баннер с акцией, изображение товаров).

Описание мини-приложения Добавляем текст с описанием магазина, условий доставки или акций.

Настройки доступа

Ограничиваем доступ к магазину для определённых сегментов (например, только для VIP-клиентов или участников закрытой распродажи).

Настройки отображения

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

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

Сохраняем настройки.

Следующие шаги

После создания мини-приложения в WinWinBot:

добавляем кнопку мини-приложения в бот через @BotFather;
регистрируем приложение через /newapp для получения короткой ссылки с автоподпиской;
добавляем мини-приложение в сообщения через кнопки в рассылках и сценариях.