Размещаем форму подписки (№11)

В прошлый раз речь шла о планировании email маркетинга. Сегодня хочу поговорить о вещах более конкретных и практичных: как добавить форму подписки на ваш сайт.

Ведь в самом деле — без формы подписки зачастую нет подписчиков, а без подписчиков нет и рассылок — что же тогда планировать? ))

Поскольку свою форму я сделал при помощи рассылочного сервиса MailChimp, то буду рассказывать на его примере. Однако, думаю, в других сервисах все эти принципы схожи.

Как добавить форму подписки на сайт: пример

Как добавить форму подписки из MailChimp по шагам

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

1. Заходим в пункт горизонтального меню Lists, где собрано всё, что касается базы подписчиков — в том числе, и создание формы для её пополнения.

2. В созданном Вами списке рассылки выбираете пункт Forms. Он отвечает за все формы, которые можно сконструировать при помощи сервиса: не только для подписки, но и для отписки, обновления профиля и формы “Переслать другу”.

3. Нас интересует первая строка списка форм — Signup Form.

Чуть ниже 4 вкладки:

— build it — непосредственно конструирование формы;

— design it — вкладка оформления (цвет кнопок, цвет фона);

— translate it — автоматический перевода полей формы (в том числе, и на русский язык);

— share it — получение ссылки на готовую форму.

Основное, что нам нужно — build it.

Как добавить форму подписки: создаём код формы в сервисе рассылок

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

Что вы хотите знать о подписчиках? (см. подробнее Первые шаги).

Мне, например, интересны email и имя. Возможно, вам понадобится узнать что-то ещё: город, телефон, дату рождения и т.д.

Если нужно, добавляем эти поля: в меню справа кликаем на вкладку add a field, в списке выбираем нужный нам тип поля. Как правило это Text, но можно задать и другой: число, список, дата рождения, номер телефона и т.д.).

Редактируем поля: во вкладке field settings доступны параметры для редактирования.

Для текстового поля это:

field lable — название поля;

field tag — тег поля, который можно использовать в содержании писем (например, тег FNAME поможет вам обратиться к каждому подписчику по имени);

reqired field — отметка, что данное поле обязательно для заполнения;

field visibility — видимость поля для подписчика:

visible — подписчик видит поле;
hidden — поле от подписчика скрыто.

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

help text — вспомогательный текст к полю, поясняющий, какую информацию и зачем должен предоставить подписчик в форме.

Например: “Оцените свой уровень знаний email маркетинга, и мне будет проще подобрать для вас действительно полезное содержание”.

default merge tag value — тег, который будет по умолчанию присваиваться пользователю, если он не заполнил поле.

Например, подписчик не заполнил поле Имя. Тогда вы можете прописать, чтобы при использовании тега FNAME в текстах ваших рассылок для этого человека использовалось другое обращение: дорогой друг, уважаемый клиент и т.п.

Когда нужные параметры проставлены, нажимаем Save Field и переходим к редактированию следующего поля. Для этого наводимся и кликаем по нему мышью. А дальше выполняем все обычные настройки в меню field settings.

С вкладками Deisign, Translate и Share работаем по желанию, для размещения формы на сайте они не так важны, поэтому не буду на этом останавливаться. Для тех, кто хочет покопаться в настройках, смотрите полезные ссылки в конце статьи.

4. Наводимся мышью на меню For your website сверху и выбираем в выпадающем списке первый подпункт Sign up Embed code. Здесь мы получим код для вставки сконструированной формы на сайт.

На выбор предлагается 3 варианта формы подписки:

Super Slim Form — самая простая форма, с одним полем (email подписчика).

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

Classiс form — форма, в которой можно учесть все те поля, которые мы только что конструировали.

Naked form — форма с тем же набором полей, но упрощённая: её код не содержит CSS и javascript.

Возможно, по техническим причинам вам подойдёт и она.

Однако больше всего внимания заслуживает Classiс form — она основная. С ней и рекомендую работать.

5. Настраиваем Classiс form через кнопку-меню рядом Options. Все вносимые изменения будут отображаться в просмотре формы справа и вноситься в код, который генерируется в окошке снизу.

Как добавить форму подписки: копируем код созданной формы

Здесь возможны следующие настройки:

a title for your form — название формы;

— выбор между only required fields (отображать в форме только обязательные для заполнения поля) и all fields (отображать все поля);

— отображать или не отображать в форме interest group fields (поля интересов подписчиков) и required field indicators (звёздочку с пометкой “Обязательные поля”);

set form width — задать ширину формы в пикселях.

Дополнительная группа настроек — Enhance Your Form:

enable evil popup mode — сделать форму подписки в виде pop-up окна (отношение создателей сервиса к такому способу набора подписчиков однозначное: злой popup режим);

disable all javascript — отключить javascript  в форме (рекомендую поставить галочку, потому что javascript работает здесь довольно непредсказуемо);

include archive link — добавить в форму подписки ссылку на архив ваших рассылок;

include MonkeyRewards link — добавить в форму ссылку на сам сервис MailChimp;

include subscriber count chiclet — добавить в форму блок с количеством ваших подписчиков (если есть, что показывать — то почему бы и нет?).

Для блога я выбрал такую конфигурацию настроек:

Как добавить форму подписки: конфигурация настроек в форме Мэйл Чимп

6. Копируем код созданной формы из поля снизу и вставляем на свой сайт — туда, куда вам угодно: на поля, в подвал сайта, на конкретную страницу.

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

На этом всё. Надеюсь, информация была для вас полезна!

В последующих постах обязательно рассмотрю другие интересные возможности MailChimp — но обо всём по порядку :-).

P.S. Полезное: более подробные статьи самого сервиса MailChimp о форме подписки (на английском):

— Рекомендации по настройке формы

Размещение формы на сайте

В самих статьях есть множество отсылок на другие полезные материалы и обучающие видео — очень советую!

P.P.S. В следующей статье подумываю рассказать о способах сбора email подписчиков в офлайне. Тема в любом случае занятная.

 

P.P.P.S. Если вы ещё не подписались на мою рассылку — самое время это сделать. Я не только анонсирую свежие статьи блога, но и делюсь с подписчиками бонусной информацией, а также показываю отдельные приёмы email маркетинга на практике. До встречи в вашем почтовом ящике! 🙂