Как подключить SendPulse к любой подписной форме

Как подключить SendPulse к любой подписной форме

Метод подключения SendPulse кода относится именно к дизайну моих проектов, где имеется подписная форма. Все формы во всех проектах уже настроены, и лишь остается их подключить. Чтобы подключить, Вам необходимо сгенерировать подписную форму в сервисе, затем скопировать код и поместить в обычный блокнот (NotePad++, или Brackets)

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


Редактор форм в SendPulse немного видоизменился. Картинки в текстовой инструкции уже поправил.


Смотрим ВИДЕОИНСТРУКЦИЮ:


Базовая инструкция SendPulse в картинках:

1. Создаем новый вариант формы подписки

Переходим в раздел «Формы подписки» и жмем «Создать новую форму подписки»:

Создаем новую форму подписки в SendPulse

выбираем «Конструктор форм» и «Встроенная форма».

Создаем новую группу подписчиков в SendPulse

2. Выбираем, или создаем новую адресную книгу (группу) в которые будут добавляться новые подписчики

Рекомендую выбирать или создавать только одну группу для каждой формы подписки, поскольку так Вы точно будете знать, какая форма работает лучше, а какую нужно поправить, или вообще удалить с глаз долой. Далее жмем кнопку «В редактор»

Выбираем, или создаем новую адресную книгу в SendPulse

3. Новое поле для формы подписки + удаляем ненужное

Жмем на плюсик слева сверху, и в открывающем меню выбираем «Имя» — жмем на него и тащим в форму подписки. Отлично! Справа связываем поле с переменной «имя» и делаем поле «обязательным».

Как настроить и подключить подписную форму от SendPulse на своем сайте

После, жмем на поле «текстовой блок», т.е. делаем его активным, и удаляем, нажимая на красную иконку (нам это поле не нужно.)

Как настроить и подключить подписную форму от SendPulse на своем сайте

4. Опции формы | Данные и тип формы

Жмем на кнопку сверху справа «опции формы», и переходим в настройки формы. Здесь достаточно указать домен сайта, где будет размещена форма. Также Вы можете поправить название и указать язык.

Как настроить и подключить подписную форму от SendPulse на своем сайте

Если Вы активируете опцию «GDPR», то под email появятся два чекбокса с условиями:

Как настроить и подключить подписную форму от SendPulse на своем сайте

5. Опции формы | Уведомление о подписке

Это тот текст, который высвечивается сразу же в самой форме подписки, когда человек заполняет данные и нажимает кнопку. Можете поправить текст, если он Вам не нравится.

Как настроить и подключить подписную форму от SendPulse на своем сайте

6. Опции формы | Текст письма подтверждения

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

Как настроить текст письма подтверждения в SendPulse

7. Опции формы | Страница подтверждения

Действие после подписки:
1) «Показать стандартную страницу с сообщением» — стандартный текст от сервиса с текстом о том, что он подтвердил свою подписку успешно. Текст сообщения нельзя поменять, поскольку это страница сервиса.
2) «Перенаправить на страницу на моем сайте» — Страница, на которую перенаправляется УЖЕ новый подписчик после клика в письме на ссылку подтверждения. По сути, это уже вторая страница благодарности. Обычно, первая страница благодарности открывается сразу, после нажатия кнопки в форме подписки, т.е. Вы благодарите за то, что человек решил подписаться, и предлагаете по ходу дела что-то платное, или тупо просто благодарите. Вторая страница «спасибо» — это та же страница подтверждения, только так это звучит формально, а «спасибо» — куда эмоциональнее, т.е. Вы благодарите еще раз за то, что человек решил подтвердить свое желание стать Вашим фанатом, и по ходу дела еще раз предлагаете ему что-то из своей платной коллекции. Конечно, только сейчас, и только для него, как нового участника Вашей группы — 70% скидка.

Как настроить cтраницу подтверждения в SendPulse

8. Опции формы | Аналитика и статистика

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

Как настроить cтраницу подтверждения в SendPulse

9. Результат перед сохранением и копированием HTML кода формы

Конечный результат формы подписки должен выглядеть так:

Как настроить и подключить форму подписки от SendPulse на своем сайте

10. Получаем HTML-код формы подписки

Сохраняем и получаем код для вставки на сайт. Копируем его.

Сохраняем и получаем HTML-код формы в SendPulse

11. Приводим код в порядок

Переходим на сайт htmlformatter.com, вставляем скопированный код, и жмем кнопку «FORMAT».

Приводим HTML-код формы подписки в порядок

12. Удаляем ненужное в коде

Удаляем тег «style» и все, что в нем находится.

Приводим HTML-код формы подписки в порядок


КАК ПОДКЛЮЧИТЬ SendPulse на примере

Для каждого своего проекта я уже предлагаю настроенный код под каждый сервис. В коде SendPulse есть ШЕСТЬ элементов, которые нужно заменить — так мы подключим код к любому моему проекту. Ниже, в шаблоне, я показал, где эти ШЕСТЬ элементов. Т.е. Вы вытягиваете ЭТИ ШЕСТЬ ЭЛЕМЕНТОВ ИЗ СВОЕГО КОДА, и вставляете в настроенный код для определенного проекта.

«Настроенный код формы подписки» — это код, который настроен под дизайн определенного проекта (настроен, НЕ подключен).
«Подключенный код формы подписки» — это код, который Вы сами подключаете, вытягивая ШЕСТЬ элементов из своей формы подписки, которую Вы получили в сервисе, и внедряете эти ШЕСТЬ элементов в настроенный код определенного проекта (не во всех проектах одинаковый код, зато ВО ВСЕХ проектах один принцип: ШЕСТЬ элементов.).

в SendPulse

НИЖЕ, пример уже настроенного кода, но еще не подключенного

Вы вытягиваете шесть элементов, и заменяете ими нули:

в SendPulse

На этом все!


Поделиться или сохранить:
  • 25
    Поделились

Также интересно…

2 комментария

  1. Raf:

    Здравствуйте! А можете объяснить предназначение этих 6-ти элементов?

    Просто мне нужен pop-up от sendpulse, куда я хочу встроить другую форму. Какой элемент отвечает за сам попап?

    • Здравствуйте, Raf!

      Все немного сложнее, чем Вы думаете. Тут целая история как настроить SendPulse под свою форму.

      Попробуйте настроить, и энциклопедии мата не хватит описать, что вы думаете через пару часов танцев под бубнами.

      Я потратил много времени, чтобы настроить под свои новые проекты, да еще таким образом, что можно свободно менять код SendPulse на код GetResponse, при этом стили править не нужно — все уже настроено.

      P.S. Эти 6 элементов — простые ID, только сендпулс решил все усложнить, и присвоил id не только инпутам, но еще и тегам, в которые обрамлены инпуты. Это маразм 80 уровня. Уровень «космос» был еще до этого, когда они еще не попытались хоть как-то упростить код при генерации.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *