СОЗДАНИЕ МЕХАНИК ДЛЯ САЙТА:
простая форма подписки

Шаг 1. Выбор текста формы
Определите с клиентом что предлагать за подписку или предложите свой вариант.
Если нет идей, посмотрите
60+ заголовков для форм подписки.

Шаг 2. Проверьте наличие скрипта сервиса
Для этого войдите в аккаунт клиента
Перейдите на страницу установки скрипта
Там внизу должны быть указаны домены, где установлен скрипт.
В случае их отсутствия обратитесь к клиенту для установки скрипта.


Шаг 3. Адаптируйте шаблон под сайт
Возьмите вот этот универсальный шаблон email подписки.

В нем в меню слева пройдитесь по всем вкладкам:
1. Подставьте нужные тексты
Тексты утвердите с клиентом или сделайте форму со своим предложением
Если в тексте нужен перенос строки используйте тег в поле ввода на месте переноса <br>:

2. Загрузите картинки на вкладке КАРТИНКИ И ИКОНКИ.
В вашем случае можно загрузить Картинка верхняя и Картинка на экране благодарности (покажется после подписки)

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


3. Вставьте ссылку на политику конфиденциальности
Во вкладке ПОЛИТИКА КОНФИДЕНЦИАЛЬНОСТИ.
Найдите на сайте клиента эту страницу.
Эту настройку не рекомендуем отключать, потому как по законодательству России такая ссылка должна быть в формах сбора данных.

4. Оставьте только нужные поля ввода
Во вкладке ПОЛЯ ВВОДА
Выключите те поля, которые не нужны
Можно оставить или убрать поле имени:

5. Откорректируйте размеры и отступы элементов
Во вкладках РАЗМЕРЫ (DESKTOP), РАЗМЕРЫ (MOBILE), ОТСТУПЫ (DESKTOP), ОТСТУПЫ (MOBILE) откорректируйте размеры формы и отступы между элементами.
При выборе размеров рекомендуем ставить масштаб 100%.
При корректировке размеров обращайте особое внимание на мобильную версию формы:

6. Подберите шрифты для формы
Во вкладе ШРИФТЫ: НАСТРОЙКИ ОБЩИЕ (1) вы можете выбрать шрифт из предложенных или использовать свой с сайта.
(2) Шрифт формы из списка предложенных, будет сразу отображаться в превью и на сайте.
(3) Если на вашем сайте используется уникальный шрифт и вы бы хотели его же использовать, поставьте галочку "Использовать свой шрифт?"
(4) В поле "Свой шрифт" вы можете ввести шрифт, точно так же, как он прописан на вашем сайте, где будет показываться форма.
Зайдите на свой сайт, нажмите правой кнопкой мыши на текстовом поле – Посмотреть код
Копируйте его полностью в это поле.

Обратите внимание!
Шрифт в форме будет подгружаться с сайта, но в превью может отображаться некорректно, из-за того, что на сайте самого личного кабинета этого уникального шрифта может не быть. Поэтому тестируйте отображение шрифта по тестовой ссылке
7. Подберите цвета для формы
Во вкладе ЦВЕТА ФОРМЫ выберите подходящие цвета.
Рекомендуем для подбора цвета с формы использовать расширение для браузера Eye Dropper
Или же использовать номер цвета с брендбука компании.

8. Определите расположение формы на экране
По умолчанию форма показывается посредине экрана и фон вокруг затемняется (на вкладке Поведение есть уровень затемнения формы)
Но вы можете изменить место расположения формы на экране настройками, которые находятся под превью формы.

Обратите внимание на чекер устройств.
По умолчанию на мобайле и планшете применяются такие же условия, как и на десктопе.
Но измените настройки, особенно, если вы используете отступы на десктопе (чтобы на мобайле форма не улетела за края экрана из-за отступов)

Шаг 4. Создайте тестовую ссылку и проверьте форму

Сохраните форму.
Нажмите "Проверить форму на сайте".
Введите или выберите домен, где будет показываться форма.
Сервис автоматически сгенерирует тестовую ссылку, по которой будет показываться форма на вашем сайте только для вас.
Ссылка формата: http://faq.popmechanic.io?pm-test-form=47ea86ccbf3dd61076ae652dc06e5b30df59dffc45ddb176c02075bbfc4d7a17
Скопируйте эту ссылку и проверьте отображение формы на сайте.
Рекомендуем отправить её себе и проверить так же на мобильных устройствах.
Отправьте эту тестовую ссылку клиенту, коллегам для проверки внешнего вида формы.
Шаг 5. Кнопка вызова формы

При желании вы можете под форму создать небольшой ярлык сбоку экрана, который будет открывать форму.
Нажмите "Пропустить", если этот пункт не нужен
Детальнее о кнопке вызова по ссылке

Шаг 6. Настройки таргетинга: кому показывать форму

1) Если вы используете сервис Mindbox – исключите сегмент подписчиков
Сразу рекомендуем переключится на Расширенный режим настроек:
Добавьте условие - Сегмент Mindbox.
Это нужно для того, чтобы исключить показ формы тем, кто уже ранее был подписан и, например, зайдет с нового устройства.

В Mindbox создайте операцию проверки сегмента (разово на аккаунт) и сегмент тех, кто имеет емейл или тех, кто подписан на емейл рассылку.
Чтобы исключить им показ формы.
Детальнее о настройках показа формы по сегментам.
(1) Название операции проверки сегмента
(2) ID сегментации тех, у кого есть емейл и которым форму показывать не нужно
(3) Не показываем форму сегменту
(4) При ошибке - считаем, что в сегменте, чтобы не показывать форму:
2) Настройте любые другие исключения показа, которые необходимы на вашем сайте:

- страницы показа
- устройства
- география
- дата и время: день недели, время показа, период показа
- трафик на сайт: источники трафика, utm-метки, переход с сайта
- действия: форма показана/закрыта/заполнена- js-сужение
- сегмент Mindbox
- ветка эксперимента Google Optimize

Обратите внимание на вложенность условий в расширенном Pro-таргетинге

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



Шаг 7. Условия показа формы

Условия показа – настройка, чтобы не раздражать посетителей сайта показом сразу же.
Можете на старте работы оставить условие 2 страницы сайта, а со временем пробовать другие условия и комбинировать их.

Детальнее об условиях показа
Шаг 8. Настройка интеграции

Настройте передачу данных с формы на сайте автоматически в ваш сервис рассылок.
Выберите тот сервис, куда вы хотите передавать данные.
Для некоторых из сервисов есть подсказки интеграции при выборе сервиса.

Как настроить интеграцию с Mindbox?
Как настроить интеграцию с Mailchimp?
Как настроить интеграцию с помощью HTTP-запроса?
Для настройки интеграции с Mindbox выберите в разделе интеграции для формы - MindBox:
Настройка для этой формы будет такой:
Шаг 9. Тест перед запуском
После всех настроек, проверьте еще раз форму на сайте по тестовой ссылке (См. шаг 4)
Заполните форму по тестовой ссылке.
Если вы всё настроили правильно - данные с формы должны прийти в сервис рассылок
Шаг 10. Запуск формы подписки

Включите форму с помощью переключателя активности формы:
Если у вас возникли сложности на любом шаге настройки – напишите в нашу поддержку.
Чат с поддержкой есть справа внизу в личном кабинете.

Вам была полезна эта статья?