Создание in-app сообщений во встроенном редакторе

Создайте шаблон in-app сообщения во встроенном редакторе Pushwoosh без написания кода. Вы получите многоразовый макет с блоками контента, изображениями, кнопками и персонализированным текстом, который можно будет показывать в Customer Journey, в виде разового in-app сообщения или из push-уведомления.

Создание нового шаблона in-app сообщения

Шаблон in-app сообщения — это многоразовый дизайн, который вы создаете один раз, а затем показываете пользователям в кампаниях. Вы можете создать его во встроенном редакторе, загрузить собственный HTML ZIP-архив или создать нативный шаблон rich media. В этой статье рассматривается создание шаблона с нуля во встроенном редакторе. Следуйте тем же шагам для настройки существующего шаблона.

Перейдите в Контент → In-apps.
Нажмите Создать in-app. Встроенный редактор откроется сразу.

Страница «Контент → In-apps» с кнопкой «Создать in-app» в правом верхнем углу списка шаблонов

Нажмите стрелку рядом с Создать in-app, чтобы создать шаблон другим способом:

Загрузить ZIP: загрузить ZIP-файл с вашим HTML in-app сообщением.
Нативный in-app: создать сообщение, отображаемое SDK, с использованием готовых макетов. Узнать больше

Обзор интерфейса редактора

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

Верхняя панель

На верхней панели вы управляете шаблоном в целом: его названием, историей отмен, статусом сохранения, внешним видом на устройстве (Настройки in-app), языками (Автоперевод и переключатель языков), шириной предпросмотра для телефона или десктопа (для телефона доступны 360, 390, 393 или 430 px, что соответствует ширине распространенных устройств) и переключателем светлой/темной темы холста (иконка солнца/луны). См. Настройка внешнего вида in-app сообщения на устройстве и Локализация шаблона.

Откройте меню ⋮ на верхней панели для доступа к дополнительным действиям:

Предпросмотр

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

Что работает в режиме предпросмотра:

Кнопки и многоэкранные сценарии работают по-настоящему.
Ссылки и диплинки регистрируются, но не открываются.
Вызовы SDK и сбор статистики по открытиям/кликам отключены.
Язык соответствует выбранному в переключателе языков. Merge Tags остаются в виде плейсхолдеров.

В заголовке предпросмотра переключайтесь между телефоном и десктопом, а также между светлой и темной темами, чтобы увидеть все итоговые макеты. Нажмите Перезапустить, чтобы снова показать сообщение с самого начала. Чтобы выйти из предпросмотра, нажмите Esc или кликните за пределами панели.

Проверка

Проверка открывает Умную проверку и сканирует шаблон на наличие распространенных проблем.

Умная проверка ищет:

Кнопки, пункты меню и ссылки на изображениях без URL или с URL, который не является адресом http(s), mailto:, tel: или диплинком (например, myapp://promo)
Незавершенные блоки-плейсхолдеры от AI
Пустые слоты для изображений или видео и отсутствующий alt-текст
Карточки товаров с отсутствующей или недействительной ссылкой
Контрастность текста, не соответствующая стандарту WCAG AA
Непереведенный контент
Таймер обратного отсчета, дата окончания которого уже прошла
Условие отображения с неработающим или пустым правилом, ветка, потерявшая блок, к которому она вела, или условие, которое не будет применяться, потому что динамический контент отключен для аккаунта

Панель умной проверки, отображающая ошибку отсутствия ссылки у кнопки и предупреждение о пустом слоте для изображения

Нажмите на найденную проблему, чтобы перейти прямо к соответствующему элементу на холсте. Если все в порядке, панель покажет Все проверки пройдены — контент готов к сохранению.

Brand book

Brand book: открыть Brand book этого приложения.
Применить стили brand book: изменить стиль шаблона в соответствии с вашим Brand book (после его настройки).
Сбросить пользовательские стили: удалить переопределения стилей в шаблоне и вернуться к значениям по умолчанию.

Скачать .zip

Скачать .zip сохраняет шаблон в виде ZIP-файла. Загружается последняя сохраненная версия, поэтому сначала сохраните изменения. Этот пункт меню появляется только после того, как шаблон был сохранен хотя бы один раз — для новых, несохраненных шаблонов он не отображается.

Холст

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

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

Слои

Панель «Слои» отображает все блоки вашего шаблона в виде дерева, в том же порядке, что и на холсте. Откройте ее с левого края, чтобы выбрать вложенный блок (например, кнопку внутри группы) или перетаскивайте строки, чтобы изменить порядок контента.

Правая панель

Переключайтесь между тремя вкладками:

Блоки: добавление контента в сообщение. См. Справочник по блокам редактора in-app сообщений.
Настройки: применение стилей ко всему шаблону сразу. См. Настройка параметров шаблона in-app сообщения.
AI: чат с AI-ассистентом для генерации или редактирования контента по запросу.

Вкладка «Блоки» на правой панели с блоками «Заголовок», «Текст», «Кнопка», «Изображение» и другими

Добавление блоков контента

Откройте вкладку Блоки на правой панели.
Перетащите блок на холст или нажмите на блок, чтобы добавить его в конец шаблона.
Продолжайте добавлять блоки, пока макет не будет готов.

Пустой редактор in-app сообщений с надписью «Начните с блока» на холсте и открытой панелью «Блоки»

Каждый тип блока служит своей цели в сообщении:

Заголовок: названия и короткие заголовки
Текст: основной текст и длинные описания
Кнопка: кликабельный призыв к действию
Изображение: картинки из Медиахранилища, загруженные или по URL
Видео: кликабельная миниатюра видео, открывающая ролик на YouTube или Vimeo
Карточка: изображение с заголовком, текстом и кнопкой в одном макете
Разделитель: линия, разделяющая секции
Колонки: макеты с расположением бок о бок (2, 3 или 4 равные колонки, или разделение 33/67 и 67/33)
Таймер: таймер обратного отсчета для предложений и сроков
Меню: строка или столбец навигационных или контактных ссылок
Соцсети: иконки со ссылками на ваши профили в социальных сетях
HTML: пользовательский HTML, например, форма, опрос или встроенное видео
Товары: сетка карточек товаров из вашего Каталога товаров или из брошенной корзины пользователя

См. Справочник по блокам редактора in-app сообщений для получения информации о настройках каждого блока и о том, как сохранять и повторно использовать блоки.

Отображение блоков для определенных пользователей

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

Выберите блок на холсте, откройте Условие отображения на правой панели и включите Показывать этот блок по условию. Узнать больше

Локализация шаблона

Многоязычный шаблон хранит локализованный текст для каждого языка в одном дизайне in-app сообщения. О том, как работают многоязычные сообщения в разных каналах, см. в статье Многоязычные сообщения.

Чтобы настроить многоязычный контент:

Нажмите на переключатель языков на верхней панели, чтобы открыть список языков.
Выберите языки, которые хотите добавить, затем нажмите Применить.
Используйте переключатель языков для переключения между языками и редактирования контента каждого блока для выбранного языка.
Нажмите Автоперевод, чтобы автоматически заполнить недостающие переводы — проверьте сгенерированный AI текст перед сохранением.

Настройка параметров шаблона

Используйте два места для стилизации и размещения сообщения:

Вкладка Настройки (правая панель): размер документа, цвета, типографика и стили по умолчанию для блоков.
Настройки in-app (верхняя панель): положение на экране, анимация и кнопка закрытия.

Узнать больше

Сохранение шаблона

Нажмите Сохранить на верхней панели, чтобы сохранить изменения. Используйте Отменить/Повторить на верхней панели, чтобы перемещаться вперед и назад по вашим правкам.

Обновление переводов из ваших собственных систем

Ваша команда разработчиков может обновлять переводы сохраненного шаблона через Pushwoosh API или AI-клиент, подключенный к серверу ManyMoney AI MCP, без повторной отправки HTML или дизайна шаблона.

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

Обновление объединяет только языки и текстовые ключи, отправленные в поле localization. Все остальные языки, ключи и визуальный дизайн остаются без изменений.

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

Для этого вам понадобится помощь вашей команды разработчиков.