Первые шаги
Пользовательские данные
- Обзор адаптивного email-редактора
- Создание оформления для письма
- Создание сквозных модулей
- Настройка адаптивности
- Настройка smart-контейнеров
- Оформление промовкладки для Gmail
- Добавление Ролловера
- Добавление анкорных ссылок
- Библиотека модулей
- Добавление таблицы в письмо
- Работа с блоком "Баннер"
- Добавление пользовательских шрифтов
- Создание кнопки CTA
- Работа с блоком "Картинка"
- Работа с блоком “Таймер"
- Использование ИИ в email-редакторе
Омниканальность
- SDK для мобильных приложений
- Управление ключами доступа к мобильному SDK
- Подключение мобильного приложения
- Создание и загрузка ключа Firebase
- Создание мобильных push-сообщений
- Настройка аналитики доставляемости и кликов
- Планирование мобильных push-уведомлений
- Типы диплинков
- Отправка тестовых сообщений из отладки запросов
- Настройка виджетов для сайта
- Вызов виджета
- Настройка геоданных для правил вызова виджетов
- Сохранение данных из виджетов в поля контактов
- Защита от раздражения
- Действия после заполнения формы
- Замена системного сценария Double Opt-In
- Создание pop-up-форм с помощью Google Tag Manager или WordPress
- Отправка событий из форм подписки в Google Analytics
- A/B-тестирование виджетов
- Сбор контактных данных с помощью форм запросов
Автоматизация
- Настройка и редактирование сценариев
- Настройка условий запуска и остановки сценария
- Блок “Старт”
- Группа блоков “Популярные”
- Группа блоков “Сообщения”
- Использование блока сообщений "Одно из многих"
- Группа блоков “Контакт”
- Группа блоков "Условия"
- Группа блоков “Другое”
- Группа блоков “Сообщение на группу”
- Группа блоков “Время”
- Расширенные параметры блоков сценариев
- Разрешенное время отправки
- Вебхуки в сценариях
- Отслеживание истории запусков сценария
- Если сценарий не работает
- Двойное подтверждение подписки
- Приветственная серия
- Приветственная серия с сегментацией по категориям
- Запуск сценария после импорта контактов
- Регулярный сценарий для группы
- Поздравление с днем рождения
- Привязка сценария к кнопке
- Использование переменных из заказа в сценарии
- Сбор отзывов о заказе
- Реактивация клиентов и подписчиков
- Отправка рассылки непрочитавшим
- Настройка дополнительных рассылок
- Отправка напоминаний в заданное пользователем время
- А/B-тестирование в сценариях
Персонализация
- Подстановка промокода из файла
- Подстановка промокода с использованием API
- Принципы генерации промокодов с помощью PHP/JAVA
- Подстановка промокода с помощью персонализации
- Загрузка промокодов для использования в сценарии
- Генерация промокодов в сценарии
- Отправка промокода с помощью препроцессора
- HTTP-запрос для передачи промокода из сообщения в карточку контакта
Аналитика
- Отчёт по email-рассылке
- Отчет по SMS-рассылке
- Отчет по рассылке Web Push
- Отчет по Viber-рассылке
- Отчет по рассылке Mob Push
- Отчет по рассылке App Inbox
- Отчет по Telegram-рассылке
- Отчет по взаимодействию с In-App
- Отчет по взаимодействию с виджетами
- Отчет по триггерной рассылке
- Отчет по AMP-рассылке
- Отчет по мультиязычной рассылке
- Настройка передачи UTM-меток
- Визуализация дохода
- Отслеживание эффективности кампаний в Google Analytics 4
- Статистика сообщений
Мультиязычность
Отслеживание событий и поведения
- События для запуска триггерных рассылок
- Именование пользовательских событий
- Валидация параметров события
- Отслеживание активности на сайте при помощи Generate event
- Подстановка данных из событий в сообщения
- Разветвление сценария в зависимости от параметров события
- Отслеживание активности клиентов в мобильных приложениях
- Вебхуки для отслеживания активности
- Аналитика событий
Товарные рекомендации
API
Смена системы
Документы
Интеграция
Создание In-App сообщений
In-App сообщения позволяют доставлять персонализированный контент вашему пользователю прямо в ваше мобильное приложение.
Важно
Установите SDK, чтобы отправлять In-App сообщения через eSputnik.
Создание нового сообщения
-
Перейдите в раздел “Сообщения” → “Сообщения” → “In-App”. Нажмите кнопку “Новый In-App”.
-
Выберите тип создания сообщения.
В eSputnik доступны два типа создания In-App сообщений: с помощью drag-and-drop и HTML редактора
Drag-and-drop редактор
-
Добавьте необходимые компоненты, перетащив их в поле редактора.
Доступны такие компоненты сообщения:
-
Текст,
-
Контейнер,
-
Изображение,
-
Плавающая картинка,
-
Кнопка,
-
Слайдер.
Примечание
Плавающая картинка может накладываться поверх других компонентов сообщения.
Как правило, используется для привлечения дополнительного внимания пользователя или акцента на важной информации.
-
Настройте общие параметры сообщения.
Когда ни один элемент сообщения не выделен, в правой части экрана становятся активные параметры:
-
Расстояние между элементами,
-
Фон сообщения (изображение и цвет),
-
Внутренние отступы.
Настройка компонентов In-App сообщения
Чтобы перейти к редактированию отдельного компонента сообщения, нажмите на него левой кнопкой.
Контейнер
Контейнер может содержать один или несколько компонентов:
-
Изображение,
-
Текст,
-
Кнопку,
-
Слайдер.
При настройке контейнера доступны следующие параметры:
-
Действие по клику,
-
Выравнивание элементов внутри,
-
Размер,
-
Фон,
-
Обводка,
-
Тень,
-
Скругление углов,
-
Внутренние отступы,
-
Наружные отступы.
Текст
-
Панели оформления, выравнивания текста и параметров ссылки расположены в верхней части редактора.
-
Панель основных настроек текста находится в правой части редактора, с такими параметрами:
-
Размер,
-
Фон,
-
Внутренние отступы,
-
Наружные отступы.
Изображение
Для изображения доступны такие настройки:
-
Действие по клику,
-
Размер,
-
Изображение,
-
Скругление углов,
-
Внутренние отступы,
-
Наружные отступы.
Обратите внимание
Если вам не нужно фиксированно ограничивать ширину изображений, лучше размещать их по ширине контейнера, чтобы все элементы находились на одном уровне
Для плавающего изображения вы можете настроить позиционирование.
Примечание
Позиция плавающего изображения рассчитывается от левого верхнего угла сообщения.
Позиция плавающего изображения рассчитывается от левого верхнего угла сообщения.
Чтобы заменить изображение, щелкните его дважды левой кнопкой или используйте кнопку “Изменить” на панели параметров. Вы можете загрузить собственное изображение, выбрать из библиотеки или указать внешнюю ссылку.
Для изображения доступна опции масштабирования:
-
Заполнение,
-
Подгонка,
-
По размеру изображения.
Примечание
Загружайте изображения в форматах PNG, JPEG, SVG, GIF, WebP, AVIF, до 3 МБ.
Кнопка
Для настройки кнопки доступны такие параметры:
-
Действие по клику,
-
Размер,
-
Фон,
-
Иконка,
-
Текст,
-
Обводка,
-
Тень,
-
Скругление углов,
-
Эффекты ховера,
-
Циклическая анимация,
-
Внутренние отступы,
-
Внешние отступы.
Слайдер
Перетащите слайдер из левой панели в шаблон сообщения. На правой боковой панели появятся кнопки “Настройка слайдера” и “Управление слайдами”.
- Настройте кнопки навигации, индикацию, анимацию показа слайдов и общий дизайн слайдера в окне настройки слайдера.
- Управляйте порядком отображения, добавляйте, дублируйте или переименовывайте слайды в окне “Управление слайдами”.
Также вы можете добавить слайд, нажав на значок +.
Чтобы изменить или отредактировать изображение, нажмите на него в шаблоне, после чего оно появится на правой панели настроек. Нажатие на изображение из слайдера в панели настроек открывает окно изменения и редактирования.
Используйте кнопки навигации для переключения между изображениями слайдера.
Установите действие по клику на слайдер:
Контекстное меню
По клику на компонент сообщения правой кнопкой, становится доступным контекстное меню с такими действиями:
-
Копировать,
-
Дублировать,
-
Вырезать,
-
Удалить,
-
Поставить за всеми плавающими изображениями,
-
Поставить перед всеми плавающими изображениями,
-
К контейнеру.
Иконка “Закрыть”
Иконка “Закрыть” в сообщении предоставляет пользователю возможность его закрыть.
Вы можете использовать как стандартные, так и пользовательские иконки с настройкой цвета, размера и позиционирования на экране.
Примечание
Позиция иконки рассчитывается от правого верхнего угла сообщения
Ориентация сообщения
Сообщения могут отображаться в портретном или ландшафтном режиме в зависимости от того, как пользователь держит устройство (вертикально или горизонтально).
Чтобы увидеть, как будет выглядеть сообщение на устройстве, нажмите значок ориентации в верхней части редактора.
После настройки In-App сообщение нажмите кнопку “Сохранить” на верхней панели редактора, чтобы применить изменения.
Заполните поле “Новое сообщение”. Это поле доступно для поиска сообщений в общем списке, пользователи его не увидят.
HTML редактор
Этот метод создания In-App сообщений более трудоемок и требует определенных навыков в работе с HTML и CSS. Однако он предоставляет более гибкий подход для индивидуальной настройки содержания сообщения.
-
Заполните поле “Название In-app”.
HTML настройки
Откройте вкладку HTML.
Вы можете разместить свой HTML или использовать наш базовый код.
Использование базового кода
Скопируйте и вставьте базовый HTML в окно кода. Разместите свой код вместо текста “Your code goes here”.
Обратите внимание
Вы можете использовать персонализацию с переменными и возможности Velocity в HTML-коде сообщений In-App.
Кастомные правила HTML-верстки
-
Используйте кнопки вместо якорей.
Внимание
Использование HTML-якорей запрещено.
-
Установите атрибуты данных для интерактивных элементов.
Каждый интерактивный элемент должен иметь необходимые атрибуты данных.
-
Код кнопки, которая должна открывать URL:
<button
data-target-component-id="1c92f19e-c994-11ed-afa1-0242ac120002"
data-sys-action-type="OPEN_URL"
data-sys-action-params="{"url":"https://google.com"}"
class="button">
</button>
-
Код кнопки, закрывающей виджет:
<button
data-target-component-id="c740db99-cfbb-4857-b790-cb5631c33255"
data-sys-action-type="CLOSE_WIDGET"
class="close-button">
</button>
Название атрибута |
Значение атрибута |
data-sys-action-type |
Одно из действий:
CLICK и OPEN_URL учитываются в статистике как клики, CLOSE_WIDGET — нет. |
data-target-component-id |
|
-
Задавайте отступ сверху приблизительно 50 px, чтобы контент помещался на iOS-устройствах.
CSS-настройки
Откройте вкладку CSS и добавьте CSS-правила в окно кода.
Добавление CSS-кода необязательно, но в большинстве случаев кастомный HTML без CSS может отображаться неправильно.
После добавления кода нажмите кнопку “Сохранить и выйти” на верхней панели редактора, чтобы применить изменения.
Созданные сообщения с помощью HTML редактора обозначаются соответствующей иконкой.
Мультиязычная версия (опционально)
Создайте мультиязычную версию любого сообщения. Нажмите значок “Глобус” на верхней панели, укажите язык по умолчанию и добавьте языковые версии.
Наполните каждую версию контентом на соответствующем языке. Вы можете переключаться между версиями в рамках одного шаблона в один клик.
Примечание
Для рассылок In-App язык определяется по языку устройства, а не по тому, который прописан в карточке контакта.