Тап-бар
Разберём, как создать и настроить тап-бар-виджет в Touch Me: от структуры и дизайна до интерактивности.
5 мин. на чтение
Содержание инструкции
Введение
Для создания виджета есть 3 шага:
- Содержание — наполнение текстом и добавление необходимых ссылок для виджета;
- Дизайн — выбор расцветки виджета, его расположения на странице, корректировка отступов;
- Размещение —название виджета в списке виджетов в Touch_me, на каких страницах будет показан/не показан виджет и пр.
Шаг 1. Содержание
В данном шаге нужно заполнить виджет названиями и ссылками. Каждая ссылка содержит следующие пункты в меню:
- Название — поле для ввода названия раздела (по умолчанию там указаны Каталог, Услуги, Корзина, Избранное и Контакты);
- Ссылка — поле для ввода ссылки, на которую будет переводить данный раздел;
- Иконка — по умолчанию используется иконка со знаком вопроса. Чтобы выбрать другую, нажмите кнопку «Библиотека иконок» и выберите нужную иконку из списка (или воспользуйтесь поиском). Если подходящей иконки нет, ее можно загрузить самостоятельно с помощью кнопки «Загрузить SVG».
В тап-баре может быть максимально 5 ссылок (разделов), которые необходимо заполнить. Если нужно менее 5 разделов, то удаляем ненужный раздел при помощи кнопки «Удалить ссылку».
При удалении ссылки (раздела) появляется кнопка «Добавить еще ссылку», которая располагается ниже всех ссылок. Она появляется только если разделов меньше 5, если хотите 6 и более, то кнопка не появится, т.к. для удобства пользователя вашего сайта нашей программой предусмотрено только 5 разделов.
Шаг 2. Дизайн
В шаге 2 располагаются разделы меню.
Меню расположения
В меню Расположения всего одно поле z-index - если вы хотите чем-то перекрыть наш виджет, то можете редактировать это поле. Но как правило, это поле стандартное и вносить изменения туда не требуется.
Меню Дизайна
- Шрифт — поле для правки шрифта в виджете.
- Размер текста — поле для правки размера текста виджета. В поле можно самостоятельно ввести нужное число размера шрифта или прибавить/убавить при помощи кнопок выше/ниже.
- Чекбокс «Тень» — чекбокс для добавления или удаления тени у виджета. Если требуется добавить тень, нужно поставить галочку, а чтобы убрать тень — нужно убрать галочку.
- Неактивное состояние — раздел для выбора цветов в тап-баре:
- Цвет фона — цвет самого тап-бара (автоматически выбран черный цвет);
- Цвет иконки — цвет выбранной иконки (автоматически выбран белый);
- Цвет текста — цвет названия раздела в тап-баре (автоматически выбран белый цвет);
- Активное состояние — раздел для выбора цветов в тап-баре:
- Цвет фона — цвет самого тап-бара (автоматически выбран фиолетовый цвет);
- Цвет иконки — цвет выбранной иконки (автоматически выбран белый);
- Цвет текста — цвет названия раздела в тап-баре (автоматически выбран белый).
Шаг 3. Размещение
После создания виджета откроется страница «Размещение», где необходимо настроить параметры его отображения.
Доступны следующие разделы:
- Название виджета — поле для ввода названия виджета во внутренней системе Touch_me;
- Сайт — выпадающий список для выбора сайта, на котором будет размещен виджет;
- Базовые настройки показа — настройка показа виджета на странице сайта;
Расширенные настройки показа — дополнительная настройка виджета.
Базовые настройки сайта
- Где показывать — настройка страниц, на которых будет отображаться виджет. Доступны четыре варианта:
- На всех страницах указанного сайта — виджет будет отображаться на всех страницах выбранного сайта;
- На всех страницах, кроме — виджет будет отображаться на всех страницах, кроме указанных. Вставьте ссылки на страницы, где виджет не должен отображаться. Каждую ссылку необходимо добавлять с новой строки (нажимая Enter);
- Только на этих страницах — виджет будет отображаться только на указанных страницах. Вставьте ссылки на нужные страницы, добавляя каждую с новой строки (нажимая Enter);
- Внутри разделов — виджет будет отображаться только в указанных разделах;
- URL-адреса соответствующие регулярному выражению — виджет будет отображаться на страницах, URL-адреса которых соответствуют заданному условию (например, содержат определенную часть адреса, начинаются или заканчиваются указанным значением).
Расширенные настройки показа
- Источники трафика — настройка показа виджета для посетителей, пришедших по определенным UTM-меткам. В соответствующие поля можно указать:
- utm_source — источник кампании, например google, yandex, vk. Заполняется самым первым. Без него невозможно заполнять другие поля;
- utm_medium — тип трафика, например cpc, email, banner;
- utm_campaign — название рекламной кампании;
- utm_content — идентификатор объявления или дополнительный параметр;
- utm_term — ключевое слово.
Если показывать виджет независимо от UTM-меток не требуется, оставьте этот раздел без ограничений.
Связанные инструкции и гайды
Содержание инструкции
Попробуйте все возможности touch_me бесплатно! Триал - 14 дней
Попробовать бесплатноИзучите инструкции и гайды
Начните повышать
конверсию уже сегодня
Подключите touch_me и превратите трафик
в реальные заявки