На примере UniSender, PopMechanic и плагина для WordPress
Форма подписки собирает данные пользователей на сайте (email, имя, телефон) и передаёт их в сервис рассылки. Далее мы можем отправить этим контактам приветственное письмо, настроить автоматическую серию писем или сразу запустить регулярные рассылки. |
Привяжите форму подписки к своему сервису рассылки. Я выбираю интеграцию с UniSender.
Пример обычной формы рассылки с сайта Т—Ж
А в блоге EmailSoldiers появляется такая всплывающая форма
Чтобы создать красивую форму подписки, совсем не обязательно знать HTML, CSS или какие-то языки программирования. Существуют сервисы, в которых любой человек может быстро создать и настроить разные формы.
Рассказываю о 4 простых способах, как создать форму подписки и сделать так, чтобы контакты с неё автоматически попадали в сервис рассылки.
Редактор сервиса рассылки
Сервис для создания форм подписки
Готовый плагин для CMS-систем (WordPress, Joomla, Drupal)
Заказать у фрилансеров или в агентстве
Редактор сервиса рассылки
Плюсы
Минусы
|
Пожалуй, это самый простой способ. Знать HTML и CSS не нужно, мы просто вставляем готовый код на страницу. Расскажу, как создать форму на примере редактора сервиса рассылки UniSender.
В UniSender есть конструктор статических и всплывающих форм. Первые закрепляются в какой-то части сайта, вторые — появляются поверх всего контента страницы. Я буду создавать всплывающую форму.
Шаг 1. Заходим в личный кабинет. Переходим в «Инструменты» → «Всплывающие формы». Нажимаем «Создать форму» и выбираем шаблон.
Шаг 2. Кастомизируем текст и дизайн формы.
Шаг 3. Когда дизайн будет готов, нажимаем «Продолжить» и настраиваем условия показа.
Если нужно, можно зайти в «Дополнительные настройки» и установить таргетинг: в каких странах показывать форму, на каких страницах и по каким дням
Шаг 4. Жмём «Продолжить», выбираем список контактов, адрес отправителя и письмо-подтверждение.
Когда всё будет готово, нажимаем «Продолжить»
Шаг 5. Переходим в раздел «Активация». Копируем код и вставляем его перед </body> на сайте.
У меня нет Google Tag Manager, поэтому я буду вставлять код вручную
Шаг 6. Я хочу поставить форму на сайт под управлением WordPress. Для этого захожу в меню WordPress → «Внешний вид» → «Редактор тем» → «Подвал». В вёрстке нахожу закрывающий тег </body> и вставляю скрипт.
Когда скрипт на месте, жму «Обновить»
Шаг 7. Проверяем работоспособность формы. Заходим на любую страницу и выполняем условие, которое задали для появления формы. В моём случае всплывающее окно появится, если просматривать страницу 5 секунд или пролистать её на 20%.
Всё ок, форма работает
Сервис для создания форм подписки
Плюсы
Минусы
|
Сделать красивую форму подписки можно не только в сервисах рассылки, но и на платформах, которые на этом специализируются. Их много: FormDesigner, Tilda, PopMechanic, LeadGenic. Когда форма будет готова, мы привяжем её по API к сервису рассылки. В некоторых платформах есть готовые интеграции с сервисами рассылки.
Для примера я создам форму в PopMechanic и объединю её с UniSender.
Шаг 1. Заходим в PopMechanic. Переходим в раздел «Собрать email» и выбираем подходящую форму.
Шаг 2. Настраиваем форму: меняем текст, картинки, выбираем, как разные элементы будут отображаться на компьютере и мобильном.
Шаг 3. Когда всё будет готово, сохраняем форму и переходим к настройке кнопки для вызова формы.
Если хотим, чтобы форма появлялась без нажатия на кнопку, просто пропускаем этот шаг. Переходим к настройкам таргетинга и условий показа.
Шаг 4. На этих двух вкладках можно выбрать, кто из посетителей будет видеть форму и при каких условиях она будет всплывать. Когда всё будет готово, переходите в раздел «Добавить интеграцию».
Шаг 5. Привяжите форму подписки к своему сервису рассылки. Я выбираю интеграцию с UniSender.
Чтобы связать UniSender и PopMechanic, нужен API-ключ. Он работает как дорога между двумя городами — контакты из формы подписки будут автоматически попадать в сервис рассылки. Получить API-ключ можно в личном кабинете UniSender в разделе «Настройки» → «Интеграции и API». В PopMechanic для каждого сервиса добавлена инструкция, как получить API-ключ.
Шаг 6. Вставляем API-ключ, выбираем список контактов и способ подтверждения подписки. Жмём «Отправить».
Шаг 7. Переходим в раздел «Установка кода». Копируем скрипт, переходим на сайт и вставляем код в конце закрывающего тега </body>. Например, в WordPress я захожу во «Внешний вид» → «Редактор тем» и нахожу файл footer.php.
Если вы работаете с Google Tag Manager, то добавить скрипт можно и через него.
Шаг 8. Возвращаемся в PopMechanic. Переходим в раздел «Запуск», активируем форму.
Шаг 9. Проверяем, работает ли форма.
Всё ок — форма появляется, когда ей и положено .
Готовый плагин для CMS-систем (WordPress, Joomla, Drupal)
Плюсы
Минусы
|
Многие сервисы рассылки предлагают готовый инструмент — формы подписки, которые можно установить на CMS-систему (WordPress, Joomla, Drupal). Рассказываю, как настроить такую форму подписки на рассылку на примере плагина UniSender для WordPress.
Шаг 1. Заходим в админку WordPress, выбираем «Плагины» → «Добавить новый».
Шаг 2. Ищем «UniSender Integration» — это специальный WordPress-плагин для сбора email.
Шаг 3. Заходим в плагин. Чтобы он работал в связке с нашим аккаунтом UniSender, нужно ввести API-ключ.
Шаг 4. Привязываем плагин к своей учётной записи UniSender. Заходим в аккаунт UniSender, переходим в «Настройки аккаунта» → «Интеграция и API».
Копируем API-ключ. Возвращаемся в плагин WordPress, вставляем API-ключ в форму.
Шаг 5. Кастомизируем форму: задаём количество полей и их содержимое, выбираем в какой список контактов будут попадать адреса.
Шаг 6. Добавляем форму на сайт. Это можно сделать практически в любом блочном редакторе или через раздел «Внешний вид» → «Виджеты» в админке WordPress. Я буду добавлять форму через блочный редактор Visual Composer.
Шаг 7. Настраиваем дизайн. Добавляем свои CSS, если нужно.
Заменил заголовок, добавил текст, подключил свои шрифты и цвета
Шаг 8. Проверяем, как работает форма.
Всё ок, контакты попадают в сервис рассылки
Заказать у фрилансеров или в агентстве
Плюсы
Минусы
|
К фрилансерам и агентствам редко обращаются только за формами подписки. Обычно их делают в процессе комплексных работ по настройке email-маркетинга, сбору базы или реализации брошенных корзин. Но если вам нужна необычная форма, а дизайнера и верстальщика под рукой нет, аутсорс — лучший вариант.
Что нужно прописать в ТЗ к форме:
- Какой это вид формы: статическая или всплывающая.
- Общие пожелания по дизайну: цвета, шрифты.
- Какие поля должны быть в форме.
- На каких страницах и в каком месте эта форма будет стоять.
- С каким сервисом рассылки её нужно объединить.
- Условия показа для всплывающих форм: когда она появляется, какие пользователи будут её видеть, как часто показывать одному и тому же пользователю.
- Общие пожелания для мобильной версии формы.
- Что написать в тексте.
Если заказываете форму подписки под ключ, то исполнителю нужно дать доступы к сервису рассылки и админке сайта.
Найти исполнителей можно на сайтах фриланса (freelance.ru, fl.ru) или обратиться в маркетинговое агентство.
Чтобы создать форму подписки, не обязательно обращаться к дизайнерам или программистам — в большинстве ситуаций хватит готовых решений.
- Чем меньше полей в форме — тем выше её конверсия.
- Настройте в сервисе рассылки письмо-подтверждение для новых пользователей, в котором они ещё раз подтвердят желание получать рассылку. Так вы избавитесь от незаинтересованных клиентов и недействительных адресов в базе.
- Попробуйте создать несколько форм и проверить, какая работает лучше. Когда выберите победителя, меняйте текст, цвет кнопки и количество полей. Возможно, какое-то из этих изменений увеличит конверсию формы.
- Для всплывающих форм пробуйте разные условия показа — например, через 5 и 10 секунд или только тем, кто посетил 2 и более страниц. Смотрите, какое условие работает лучше.
Источник: hostenko.com/wpcafe