Вставить встроенную форму подписки в сайт

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

В UniSender есть два вида форм:

  • встроенная (статичная);
  • всплывающая (pop-up).

Если хотите использовать всплывающую форму, читайте статью «Как установить код всплывающей формы».

В этой статье расскажем, как добавить встроенную форму подписки на сайт.

Создаём форму в UniSender

Подробнее о том, как создать форму подписки, читайте в статье «Форма подписки UniSender».

После того как вы сделали и сохранили форму, нажмите «Получить HTML» в правом верхнему углу.

Как получить HTML-код формы.

Есть три варианта кода:

  • JavaScript. Форма будет выглядеть так же, как в редакторе UniSender. Выбирайте этот вариант, если в форме не нужно ничего менять.
  • HTML. Здесь можно редактировать код. Выбирайте HTML, если хотите изменить какую-то часть кода, например, шрифт и его цвет.
  • Код формы для веб-разработчика. Это «чистый» код формы без оформления и стилей. Выбирайте этот вариант, если хотите сделать своё оформление формы подписки.

Нажмите «Скопировать» напротив нужного варианта.

Выбираем нужный вариант кода.

Вставляем форму на сайт

Рассмотрим на примере популярной CMS WordPress, как добавить полученный код на сайт.

Внешний вид некоторых элементов в админ-панели может отличаться из-за другой версии WordPress или установленных плагинов, но общий принцип создания страницы тот же.

Зайдите в консоль администрирования WordPress, далее в раздел «Страницы» — «Все страницы».

Интерфейс WordPress.

Если нужно создать новую страницу, кликните «Добавить новую». Если страница, куда вы хотите вставить форму, уже есть, найдите её в списке страниц ниже. Наведите курсор на страницу и нажмите «Изменить».

Как изменить страницу в WordPress.

Теперь перейдите к редактору кода. Кликните на кнопку с тремя точками справа вверху, в меню выберите «Редактор кода» или нажмите горячие клавиши Ctrl+Shift+Alt+M.

Как войти в редактор кода.

Если это новая страница, введите заголовок в поле сверху, а ниже вставьте код, который вы скопировали из UniSender.

Если страница существующая, поставьте курсор в то место кода, куда нужно вставить форму подписки, и вставьте код.

Редактор кода в WordPress.

Чтобы посмотреть, что получилось в итоге, кликните «Просмотреть», отметьте «Настольный ПК» и кликните «Предпросмотр в новой вкладке».

Предпросмотр формы.

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

Готовая форма подписки, добавленная на сайт.

Если всё в порядке, нажмите «Опубликовать».

Как опубликовать страницу с формой.

Выберите настройки видимости, дату публикации и нажмите «Опубликовать».

Настройки публикации страницы с формой.

Чтобы проверить страницу после публикации, нажмите «Просмотреть страницу».

готовая страница подписки.

Страница с формой подписки готова.

Полезные ссылки

Форма подписки UniSender
Как сделать конверсионную форму подписки своими руками
Куда поставить форму подписки, чтобы наращивать базу и не сливать трафик
Как сделать классную форму подписки на рассылку: 25+ примеров

Вы нашли ответ?

5
9

Помогите улучшить статью

Unisender
Unisender

Маркетологи — о том, что их волнует прямо сейчас.

Подпишитесь на авторскую рассылку от редакции Unisender.
Спасибо, ждите письмо. Проверяйте почту - письмо придет в течение 5 минут (обычно мгновенно).
Наш юрист будет ругаться, если вы не примете :(