Шаблон для In-App

Шаблон для In-App — это контент, который показывается внутри мобильного приложения через размещения. Шаблон настраивается для In-App-канала и создаётся в блочном редакторе. Контент шаблона также можно задать вручную: в виде пользовательского HTML или в формате JSON.

Блочный редактор

Шаблон собирается визуально из готовых элементов: содержимое переносится в область редактирования и настраивается без написания кода.

Типы размещений

При создании шаблона нужно выбрать тип In-App — формат, в котором контент отображается в приложении:

• Fullscreen — полноэкранный показ.
• Modal — модальное окно.
• Slideup — панель, выезжающая снизу.
• Floating bar — плавающая полоса.
• Редактор кода — откроется редактор кода, в котором доступны варианты HTML, CSS и JS.

Для типов Fullscreen, Modal, Slideup и Floating bar в редакторе доступны готовые шаблоны-заготовки, которые можно использовать как основу.

После выбора типа размещения откроется блочный редактор.

Страницы и блоки

Шаблон In-App может состоять из одной или нескольких страниц, между которыми пользователь переключается в приложении. Скопировать или добавить пустую страницу, а также переключить страницы можно, нажав на кнопки в правой нижней части редактора. Каждая страница делится на блоки и колонки, внутри которых размещаются элементы контента.

Блоки и элементы

Блок

Для блока с контентом настраиваются следующие параметры:

• Выравнивание — выравнивание блока по правому, левому краю или по середине шаблона.
• Колонки — здесь настраивается количество колонок, их ширина, а также отступы между ними.
• Направление перестроения — порядок колонок, если выбран режим перестроения в прошлом параметре.
• Отступы — отступы контента блока от его границ.
• Внешние отступы — отступы границ блока от границ шаблона.
• Скругления контейнера — настройка скругления углов.
• Фон контейнера — здесь можно либо указать цвет фона, либо загрузить фоновое изображение.
• Рамка контейнера — цвет, толщина и стиль границ контейнера блока.

Вы можете добавить контент в пустой блок, нажав соответствующие иконки внутри элемента:

Свойства колонок блоков также кастомизируются:

• Выравнивание;
• Отступы;
• Фон колонки;
• Скругления колонки;
• Рамка колонки;
• Размеры колонки.

Для полосы, содержащей блок, можно настроить параметры:

• Выравнивание;
• Фон;
• Ширина контента;
• Скругление контента;
• Рамки контента;
• Отступы.

Некоторые параметры полосы влияют на вид всего шаблона.

Текст

Для текстового блока настраиваются следующие свойства:

• Выравнивание текста внутри контейнера;
• Шрифт, его размеры, свойства и цвет;
• Вставка смайликов и переменных;
• Вставка ссылок в текст;
• Отступы внутри блока;
• Размер, скругление, фон и рамка контейнера;

Изображение

Для блока с изображением настраиваются следующие свойства:

• Выравнивание изображения внутри контейнера;
• Размер изображения;
• Отступы внутри блока;
• Закругление контейнера и его рамки;

Кнопка

Для кнопок настраиваются следующие свойства:

• Выравнивание кнопки внутри контейнера;
• Ссылка для перехода по клику;
• Шрифт текста, его размер и цвет;
• Фон кнопки. Можно загрузить изображение;
• Размер кнопки, стиль и закругление её рамок, а также отступы внутри контейнера;

Разделитель

Разделитель представляет собой пустой блок с горизонтальной полосой внутри. Для него настраиваются:

• Цвет и толщина разделителя;
• Отступы внутри контейнера;

Социальные сети

Соц.сети — блок с кликабельными иконками основных социальных сетей. Для блока можно настроить:

• Выравнивание внутри контейнера;
• Настройки соц.сетей — здесь можно добавить или убрать иконки, изменить порядок их отображения и настроить ссылки для перехода по клику. Вы также можете перейти к любой иконке и настроить для неё отдельный цвет фона и логотипа;
• Расстояние между логотипами, размер логотипов;
• Цвет логотипа, а также цвет фона. Их можно также настроить отдельно для каждой соц.сети, для этого кликните на нужную иконку в блоке;
• Отступы внутри контейнера, скругления и рамки логотипов;

Список

Для списков настраиваются следующие свойства:

• Выравнивание внутри контейнера;
• Стиль маркера, а также размер, цвет и шрифт (если выбран цифровой маркер);
• Размер и фон контейнера, стиль и скругление его рамок, а также отступы внутри контейнера;
• Свойства текста — размер, цвет, шрифт, стиль, а также вставка переменных и смайликов. Здесь же можно вставить ссылки в текст;

Готовые блоки

Набор заготовленных блоков, подобранных под самые разные цели. С их помощью вы сможете за одну минуту собрать базовый вариант шаблона, который подойдёт именно вам.

Избранные блоки

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

Чтобы сохранить блок, нажмите на значок «звёздочки».

В дальнейшем он будет всегда доступен в редакторе на соответствующей вкладке (справа от раздела «Готовые блоки»).

Стили

В разделе Стили можно настроить фон In-App'а, а также стиль кнопки закрытия.

Настройки

В разделе Настройки можно изменить тип In-App — выбранный при создании шаблона формат отображения (Fullscreen, Modal, Slideup, Floating bar).

Параметры

В этом разделе вы можете настроить внешний вид и расположение элементов редактора под себя.

• Тема интерфейса позволяет выбрать визуальное оформление редактора (светлая или тёмная тема).
• Положение панели свойств определяет, где будет располагаться панель свойств. Панель можно разместить слева или справа — в зависимости от ваших предпочтений.

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

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

Сохранение и использование

После настройки шаблона сохраните его. Сохранённый шаблон можно использовать в размещении для запуска In-App-контента.

к сведению

In-App-шаблон используется только в размещениях. Он не применяется в броадкастах, регулярных, триггерных рассылках и A/B/n-тестах.