В этой статье мы рассмотрим конструктор форм подписок в NotiSend. Добавьте форму на сайт и собирайте новых подписчиков в группы получателей для рассылок
Как сделать форму подписки на сайте
1. Зайдите в личный кабинет Notisend или зарегистрируйтесь.
2. Войдите во вкладку «Получатели» и выберите группу получателей, в которую в дальнейшем будут попадать новые подписчики, либо создайте новую группу:
![Выбор группы получателей среди подписчиков](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-12-17-1024x390.png)
3. Нажмите на кнопку «Форма подписки»:
Теперь вы попали в интерфейс форм подписок. Рассмотрим функционал.
1. Всплывающее окно. Этот pop-up окно, которое появляется при совершении пользователем тех или иных действий на сайте (прокрутка до определённого места на сайте, провождение на сайте N секунд, попытка выхода с сайта и пр.).
2. Ссылка на форму подписки. Вы можете создать простую форму подписки, в которой будет располагаться заголовок, описание и форма подписки с необходимым количеством полей. Эту форму вы можете отправить своей аудитории в виде ссылки, перейдя на которую пользователь попадёт на пустую страницу, на которой будет располагаться только эта форма, заполнив которую, он автоматически попадёт в ту группу получателей, в которой вы настроили данную форму.
3. HTML код. Вы можете создать форму подписки в нашем конструкторе форм, скопировать html код формы без стилей и вставить на свой сайт.
![Генерация кода формы подписки для внешнего сайта](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-14-11-1024x666.png)
В нижней части страницы у вас есть возможность добавлять поля форм подписок, которые будут автоматически вставлены в вашу созданную форму подписки, а при заполнении формы, введённые данные будут автоматически заполняться в профиле подписчика, которые вы можете посмотреть в той группе получателей, в которой вы создали форму.
![Выбор полей с данными, которые интересуют вас](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-25-41-1024x445.png)
Помимо этого, создавайте дизайн и настраивайте double opt-in письмо (письмо о подтверждении подписки) для своих пользователей:
![Дизайн-концепт будущего письма](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-26-04-1024x330.png)
Подробный функционал конструктора форм подписки
Выбираем пункт «Всплывающее окно» и нажимаем на кнопку «Редактировать форму» — чтобы отредактировать уже существующую форму или создать форму самостоятельно. Либо, кнопку «Выбрать другой шаблон» и на основе выбранного шаблона уже редактировать форму. Создавать форму подписки по шаблону намного легче и удобнее, поэтому рекомендуем вам пользоваться именно шаблонами:
![Смена шаблона для письма в рассылке](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-29-29-1024x561.png)
Если вы выбрали пункт «Выбрать другой шаблон», то не обязательно копировать весь дизайн формы из понравившегося шаблона, можно скопировать только стили формы подписки. Для этого, необходимо включить эту функцию:
![Выбор стиля других шаблонов для своего письма в редакторе Notisend](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-30-30-1024x440.png)
После выбора шаблона, нажмите на него и вы попадёте в конструктор форм. Рассмотрим более подробно по пунктам:
- Основные пункты настроек форм;
- Настройки выбранного пункта;
- Возможность посмотреть как отображается ваша форма на десктопных и мобильных устройствах;
- Отображение созданной формы подписки;
- Возможность вернуться назад или выбрать другой шаблон;
- Завершение и сохранение созданной формы подписки.
![Поля и возможности настройки шаблона рассылки](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-33-00-1024x414.png)
Разберём каждый пункт настроек:
1. Текст
В этом пункте вы можете отредактировать:
- заголовок;
- содержание;
- текст кнопки подписки;
- изображение.
![Редактирование пунктов на экране рассылки](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-51-56-1024x466.png)
2. Стили
В этом пункте вы можете отредактировать:
- вид формы (горизонтальный или вертикальный);
- горизонтальное выравнивание содержимого формы;
- вертикальное выравнивание содержимого формы;
- расположение изображения;
- горизонтальное выравнивание изображения;
- вертикальное выравнивание изображения;
- размер формы;
- цвет фона формы;
- фон перекрытия сайта (background);
- цвет и стиль границы формы;
- толщину границ;
- скругление углов формы.
![Редактирование стилей в кабинете рассылок Notisend](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-53-11-1024x585.png)
3. Поведение
В этом пункте вы можете отредактировать:
- событие, при котором будет всплывать форма;
- через какое время будет появляться форма;
- эффект появления;
- положение диалога (расположение формы по центру, внизу, вверху, в углу и пр.);
- также вы можете растянуть форму во весь экран.
![Применение паттернов поведения в качестве настроек письма](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_10-57-50-1024x467.png)
По завершению редактирования формы подписки, нажмите на кнопку «Сохранить и выйти» в правом верхнем углу экрана:
![Сохранение настроек рассылки в кабинете Notisend](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_11-03-08-1024x430.png)
Добавление дополнительных полей для заполнения
После завершения редактирования формы подписки, добавьте необходимые поля для заполнения, перед подпиской на вашу рассылку. Для этого, нажмите на кнопку «+Добавить поле»:
![Дополнительные поля формы подписки](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_11-04-45-1024x429.png)
Затем, задайте название поля и выберите тип заполнения:
- строка;
- число;
- дата;
- логический;
- местоположение.
После этого, нажмите сохранить:
![Выбор параметров для формы подписки](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_11-05-46-1024x549.png)
Активируйте созданные поля для вашей формы:
![Активация полей для формы подписки](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_11-07-54-1024x490.png)
Как вставить форму email подписки на сайт
Для того, чтобы вставить созданную форму на сайт, просто скопируйте готовый код формы и вставьте его к себе на сайт. Если у вас нет знаний, как это сделать, наша техническая поддержка может в этом помочь:
![Добавление формы email-подписки на сайт](https://blog.notisend.ru/wp-content/uploads/2023/05/2019-08-28_11-10-00-1024x530.png)
Подборка идей форм подписок на сайт
Ранее, мы писали для вас отдельную статью, в которой подробно показали идеи форм подписок.
Создавайте уникальные формы email подписок, эффективно собирайте подписчиков и делайте качественные email рассылки!