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

1. Дизайн - выбор расцветки виджета, его расположения на странице, корректировка отступов;

2. Содержание - наполнение текстом и добавление необходимых ссылок для виджета;

3. Размещение - название виджета в списке виджетов в touch_me,
   на каких страницах будет показан/не показан виджет, код для подключения к Яндекс Метрике. 

Шаг 1 - Дизайн.

В открывшейся странице открылось поле с виджетом и меню для дизайна (см. скриншот 12).
То, что выделено красной рамкой - это поле для более наглядного размещения виджета
на вашем сайте (оно всегда серых цветов), а стрелкой показан сам виджет. 

Меню дизайна:

1. Цвет фона - цвет самого модального окна (на примере зеленый цвет);

2. Цвет заголовков - цвет текста темы виджета (на примере красный цвет);

3. Цвет текста - цвет внутреннего текста-описания, раскрывающего заголовок (на примере фиолетовый цвет).

4. Закругления: поле для определения углов виджета. Значение 0 - значит углы будут прямые углы в 90 градусов.
   Чем выше число, тем больше закругления у виджета. В поле можно самостоятельно ввести
   нужное число или прибавить/убавить при помощи кнопок выше/ниже. 

5. Тень: чек-бокс для добавления или удаления тени у виджета.
   Если требуется добавить тень, нужно поставить галочку, а чтобы убрать тень - нужно убрать галочку. 

6. Шрифт: поле для правки шрифта в виджете (см. скриншот). 

7. Размер заголовков: поле для правки размера темы виджета.
   В поле можно самостоятельно ввести нужное число размера шрифта или прибавить/убавить при помощи кнопок выше/ниже. 

8. Размер текста: поле для правки размера описания виджета.
   В поле можно самостоятельно ввести нужное число размера шрифта или прибавить/убавить при помощи кнопок выше/ниже. 

9. Отступы внутри: поле для регулировки отступов в случае, если в виджете будет 2 и более окон (см. скриншот 13).

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

1. Расположение: здесь выбираем 1 из 3х вариантов расположения виджета на странице: нижний левый угол,
   нижний правый угол или верхний правый угол. 

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

3. Чек-бокс “Показывать только на первом экране” - возможность показа виджета только на первом экране,
   не затрагивая другие страницы.

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

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

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

В открывшейся странице открылось поле с виджетом (как в шаге 1) и меню для содержания ссылки:

1. Заголовок - поле для ввода темы виджета, здесь просто требуется ввести текст;

2. Описание - поле для ввода текста-описания виджета, здесь просто требуется ввести текст;

3. Ссылка - поле, куда нужно вставить ссылку, куда ведет виджет;

4. Пунктирное поле - поле для загрузки файла изображения. Чтобы загрузить изображение нужно нажать
   на пунктирное поле и найти нужное изображение в вашем компьютере.
   Изображение должно быть в формате png или jpeg, весить не более 200 KB, пропорции 1 к 1; 

5. Кнопка Удалить - появляется только тогда, когда добавлено несколько ссылок в виджет.

Пример полностью заполненного шага 2 на скриншоте ниже.

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

Как добавить дополнительную ссылку: 

1. В меню найти кнопку “Добавить еще ссылку” (скриншот)

2. В появившихся полях также заполнить поля как заполняли ранее для первой ссылки.
   При добавлении новой ссылки во всех ссылках появляется кнопка Удалить.
   На скриншоте показано как будет выглядеть страница при добавлении дополнительной ссылки.
   Дополнительное окно можно скрыть и раскрыть, нажав на кнопку Скрыть/Раскрыть внизу виджета.

Шаг 3 - Размещение.
В открывшейся странице открылась страница уже без поля для создания виджета, а просто меню.
Здесь следующие поля для заполнения: 

1. Название виджета - поле для названия виджета во внутренней системе touch_me;

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

3. Начинать показ - здесь выбираете время для показа;

4. Как долго показывать - здесь выбираете время показа;

5. Где показывать - выбираете на каких страницах показывать или не показывать данный виджет: 

• На всех страницах указанного сайта;

•  На всех страницах, кроме и поле для вставки ссылок страниц, где виджета не должно быть (сюда вставляем ссылки страниц через ENTER);

• Только на этих страницах и поле для вставки ссылок страниц, где виджет должен быть (сюда вставляем ссылки страниц через ENTER);

• URL-адреса соответствующие.

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

6. Цель в Яндекс Метрике - поле для ввода кода для интеграции (получать в Яндекс Метрике).

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

Когда виджет полностью создан, то нужно нажать на кнопку “Сохранить изменения”
слева в самом низу страницы (отмечено стрелкой на скриншоте).