Промокод

Введение

Для создания виджета есть 3 шага: 

1. Содержание — наполнение текстом и добавление необходимых ссылок для виджета;
2. Дизайн — выбор расцветки виджета, его расположения на странице, корректировка отступов;
3. Размещение — название виджета в списке виджетов в Touch_me, на каких страницах будет показан/не показан виджет, код для подключения к Яндекс Метрике. 

Шаг 1. Содержание

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

Доступны следующие поля:

• Содержимое промокода — раздел для работы с текстом в виджете.
  • Заголовок — поле для ввода названия виджета. Необходимо указать текст, который будет отображаться в заголовке.
  • Размер скидки — поле для указания размера скидки. Значение можно указать вручную или изменить с помощью кнопок увеличения/уменьшения. 
  • Промокод — поле для ввода названия промокода, отображаемого в виджете. Описание всегда ограничено 1 строчкой, поэтому много текста вписывать не нужно. Система автоматически ограничит текст многоточием. Кнопка «Скопировать» у названия промокода в виджете предусмотрена автоматически.
• Изображение — пунктирное поле для загрузки изображения. Чтобы добавить изображение, нажмите на поле и выберите нужный файл на компьютере.
  Требования к изображению:
  • формат файла: PNG или JPEG;
  • размер файла: не более 6 МБ.

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

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

• Условия промокода — раздел для указания специальных условий. В единственном поле Условия введите нужный текст. Если никаких условия у промокода нет, то данный раздел можно отключить, перемесив переключатель рядом с названием влево.

Шаг 2. Дизайн

В разделе «Дизайн» можно настроить внешний вид виджета. Тут блоки делятся на два вида: Дизайн, Изображение, Кнопка скопировать, Расположение и Отступы.

Меню дизайна

• Цвет фона — настройка цвета фона модального окна виджета.
• Цвет заголовков — настройка цвета текста заголовка виджета.
• Цвет скидки — настройка цвета текста с цифрами скидки.
• Цвет фона промокода — настройка цвета фона, на котором показывается промокод.
• Цвет текста промокода — настройка цвета текста промокода.
• Цвет разделителя — настройка цвета пунктира в виджете.
• Цвет условия — настройка цвета обозначения текста условий промокода в виджете.
• Закругления — настройка радиуса скругления углов виджета.
  Значение 0 означает, что углы будут прямыми (90°). Чем выше значение, тем более закругленными будут углы виджета. Значение можно ввести вручную или изменить с помощью кнопок увеличения/уменьшения.
• Чекбокс «Тень» — чекбокс для включения или отключения тени у виджета. Чтобы добавить тень, установите галочку. Чтобы убрать тень — снимите галочку.
• Шрифт — поле для выбора и изменения шрифта текста в виджете.
• Размер заголовков — настройка размера текста заголовка виджета. Значение можно указать вручную или изменить с помощью кнопок увеличения/уменьшения.
• Размер промокода — настройка размера цифр скидки в виджете. Значение можно указать вручную или изменить с помощью кнопок увеличения/уменьшения.

Меню изображения

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

• Высота изображения — настройка высоты картинки в виджете. Чем больше число, тем выше картинка.
• Выберите положение — настройка расположения самой картинки в выбранной высоте. То есть в этом поле вы можете передвигать изображение вверх и вниз при помощи стрелок. 

Меню кнопки скопировать

• Цвет фона — настройка цвета фона кнопки копирования.
• Цвет иконки — настройка цвета иконки в кнопке.

Меню расположения

1. Расположение — здесь выбираем 1 из 4х вариантов расположения виджета на странице: нижний левый угол, нижний правый угол, верхний правый угол или по центру. 
2. z-index — если вы хотите чем-то перекрыть наш виджет, то можете редактировать это поле. Но как правило, это поле стандартное и вносить изменения туда не требуется. 

Меню отступов

1.  Отступы — поле для настройки отступов в ручную. В поле можно самостоятельно ввести нужное число размера отступа или прибавить/убавить при помощи кнопок выше/ниже.

При завершении этого шага можно перейти на следующий шаг при помощи кнопки «Следующий шаг» в правом нижнем углу или при перечислении шагов чуть выше поля создания виджета.

Шаг 3. Размещение

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

Доступны следующие разделы:

• Название виджета — поле для ввода названия виджета во внутренней системе touch_me;
• Сайт — выпадающий список для выбора сайта, на котором будет размещен виджет;
• Базовые настройки показа — настройка показа виджета на странице сайта;

• Расширенные настройки показа — дополнительная настройка виджета.

  Базовые настройки сайта

• Устройства на которых показывать — настройка показа виджета на разных устройствах (на всех устройствах, только на десктопе, только на мобильных телефонах).
• Начинать показ — настройка момента, когда виджет будет отображаться пользователю. Доступны следующие варианты:

1. Сразу — виджет появляется сразу после загрузки страницы.
2. Через (сек.) — виджет появляется через указанное количество секунд после открытия страницы. В поле можно указать нужное значение вручную или изменить его с помощью кнопок увеличения/уменьшения.
3. При скролле до (%) — виджет появляется после того, как пользователь прокрутит страницу до указанного процента. Например, при значении 10% виджет будет показан после прокрутки 10% страницы.
4. Когда собирается покинуть страницу — виджет отображается в момент, когда система фиксирует намерение пользователя покинуть страницу (например, при движении курсора к кнопке закрытия вкладки).
5. После посещения кол-ва страниц — виджет появляется после того, как пользователь просмотрит указанное количество страниц сайта. В поле необходимо указать количество страниц.

• Как долго показывать — настройка времени отображения виджета.

1. Все время — виджет остается отображаться без ограничения по времени.
2. Пока не совершит действие — виджет покажется только после взаимодействия пользователя с сайтом.
3. Скрывать через (сек.) — виджет автоматически скрывается через указанное количество секунд. В поле можно указать нужное значение вручную или изменить его с помощью кнопок увеличения/уменьшения.
4. Скрывать через (показов) — виджет автоматически скрывается через указанное количество показов. В поле можно указать нужное значение вручную или изменить его с помощью кнопок увеличения/уменьшения.

• Где показывать — настройка страниц, на которых будет отображаться виджет. Доступны четыре варианта:

1. На всех страницах указанного сайта — виджет будет отображаться на всех страницах выбранного сайта;
2. На всех страницах, кроме — виджет будет отображаться на всех страницах, кроме указанных. Вставьте ссылки на страницы, где виджет не должен отображаться. Каждую ссылку необходимо добавлять с новой строки (нажимая Enter);
3. Только на этих страницах — виджет будет отображаться только на указанных страницах. Вставьте ссылки на нужные страницы, добавляя каждую с новой строки (нажимая Enter);
4. Внутри разделов  — виджет будет отображаться только в указанных разделах;
5. URL-адреса соответствующие регулярному выражению — виджет будет отображаться на страницах, URL-адреса которых соответствуют заданному условию (например, содержат определенную часть адреса, начинаются или заканчиваются указанным значением).

Расширенные настройки показа

• Операционные системы — настройка показа виджета на определенной ОС. При помощи чекбоксов выбирайте показ виджета на нужных операционных системах. Если ограничение по операционным системам не требуется, оставьте настройку выключенной. Если нужно показывать виджет только пользователям определенных устройств, включите настройку при помощи переключателя у названия поля и выберите нужные ОС.
• Источники трафика — настройка показа виджета для посетителей, пришедших по определенным UTM-меткам. В соответствующие поля можно указать:
  • utm_source — источник кампании, например google, yandex, vk. Заполняется самым первым. Без него невозможно заполнять другие поля;
  • utm_medium — тип трафика, например cpc, email, banner;
  • utm_campaign — название рекламной кампании;
  • utm_content — идентификатор объявления или дополнительный параметр;
  • utm_term — ключевое слово.

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

• Интеграция с аналитикой — блок с настройкой интеграций виджета.
  • Цель в Яндекс Метрике — поле для вставки кода для интеграции;
  • Событие в Roistat — поле для вставки кода для события.