Виджет Форма в конструкторе сайтов

Чтобы посмотреть видео, согласитесь на маркетинговые файлы cookie или перейдите на YouTube.

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

Содержание

Добавьте элемент Форма

Добавьте виджет Форма в нужную часть шаблона

Справа откроется панель, в которой можете настраивать виджет.

Выберите, куда сохранять контакты

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

Создание сделки и контактов в CRM

Выберите, какие элементы автоматически создавать в разделе CRM при отправке формы:

Создавать только контакт (Create only contact)

Во вкладку Контакты будет добавлена карточка контакта*.

Создавать контакт и сделку (Create contact and deal)

Во вкладку Сделки будет добавлена карточка сделки*, а также карточка контакта во вкладку Контакты.

Настройте, как сохранять сделки:

В поле Сделка (Deal) укажите название, которое будет присвоено всем сделкам, созданным в результате заполнения формы.
В поле Воронка и статус (Pipeline and deal stage) выберите воронку, в которую будут попадать автоматически созданные сделки, а также статус сделки.

Вы можете настроить соответствие полей в настройках поля формы.

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

Чтобы сохранять контакты с определенными тегами CRM, активируйте опцию Назначать тег контакту (Assign tag to a contact) и выберите теги. В списке доступны уже созданные теги из всех воронок и разделов CRM.

Также вы можете настроить передачу UTM-меток контактам в CRM, если посетитель перешел на сайт по ссылке с меткой и заполнил форму.

Создание контактов в адресной книге

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

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

Добавление подписчиков в чат-бот

Включите опцию Сохранять контакты в аудиторию чат-бота (Add to chatbot audience). Для настройки кнопки нажмите на значок карандаша. Выберите канал — WhatsApp, Telegram, Instagram, Viber или Messenger, и введите название кнопки. В поле Подписывать на (Subscribe to) выберите, на какой бот подписывать и цепочку, которую запускать после подписки.

Вы можете добавить максимум 4 кнопки разных ботов.

Соответствие полей вы можете выбрать в настройках поля формы.

Настройте поля формы

Выберите вид формы

Вы можете выбрать, как форма отображается на странице. В настройках виджета формы выберите вид в разделе Внешний вид (View).

Доступны следующие варианты:

Встроенная форма (Static form)	Все поля формы отображаются непосредственно на странице в одном блоке.
Модальное окно (Modal form)	Все поля формы отображаются в модальном окне. Посетители нажимают кнопку на странице, чтобы открыть модальное окно с формой.

Если выбрать вариант Модальное окно (Modal form), можно включить переключатель Двухэтапная форма (Two-step form). Форма будет разделена на два этапа.

На первом этапе отображается компактный блок с одним полем ввода и кнопкой — например, для ввода адреса электронной почты. На втором этапе открывается модальное окно с остальными полями формы.

После включения Двухэтапной формы (Two-step form) введите заголовок модального окна в поле Заголовок формы (Form title).

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

Добавление полей

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

Обратите внимание, что поле Email обязательное — его нельзя удалить.

Выберите тип поля и введите название.

Вы также можете скрыть названия полей в стилях полей.

Введите подсказку в плейсходлере.

В поле ввода типа Телефон вы можете добавить динамическую маску для номеров. Тогда форма будет определять по IP-адресу страну, где находится посетитель, и будет подставлять ему соответствующий код. Также посетитель сможет выбрать другой код из выпадающего списка.

Перейдите в настройках поля и активируйте переключатель Использовать динамическую маску (Use dynamic mask).

Настройка соотношения полей

За замовчуванням всі контакти зберігаються в CRM. Щоб зберігати дані в змінну іншого сервісу, активуйте відповідні налаштування.

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

CRM для контакту та угод.
Email в адресні книги.
Чат-боти в аудиторію чат-бота.

Якщо у списку немає потрібної змінної, створіть її у відповідній адресній книзі або аудиторії чат-бота. Якщо немає поля в CRM — створіть у налаштуваннях відповідної воронки та контактів.

Значення полів Email та Телефон (Phone) зберігаються у стандартних системних змінних емейла та телефону.

Отметьте, является ли поле обязательным. Если поле обязательное, данные пользователя не отправятся, пока он не заполнит все обязательные поля.

Настройте стиль полей

Чтобы настроить поля формы, в разделе Внешний вид (View) нажмите Стили полей (Field styles).

Встроенная форма

В режиме отображения Встроенная форма (Static form) можно настроить поля формы с помощью следующих параметров:

Названия (Names)	Включите, чтобы показывать названия полей над полями ввода.
Цвет названий (Name color)	Выберите цвет названия поля.
Расположение (Alignment)	Выберите выравнивание поля.
Внешний вид (Appearance)	Выберите стиль поля: заполненное или с рамкой.
Цвет текста в поле (Input field text color)	Выберите цвет текста, который посетители вводят в полях формы.
Цвет фона (Background color)	Выберите цвет заливки полей.
Скругление (Rounding)	Задайте радиус скругления в пикселях. Применимо к полям с рамкой.
Цвет рамки (Border color)	Выберите цвет рамки поля.
Размер (Size)	Выберите размер поля: S, M или L.

Стили полей в режиме отображения Модальное окно (Modal form) включают дополнительные настройки для самого модального окна.

Доступны следующие параметры модального окна:

Фон модального окна (Modal window background)	Выберите цвет фона модального окна.
Скругление (Rounding)	Задайте радиус скругления углов модального окна в пикселях.
Внутренний отступ (Inner padding)	Задайте размер внутреннего отступа модального окна в пикселях.

Настройте поля формы в модальном окне:

Цвет текста в форме (Form texts color)	Выберите цвет заголовка формы и других текстовых элементов в модальном окне.
Названия (Names)	Включите, чтобы показывать названия полей над полями ввода.
Цвет названий (Name color)	Выберите цвет названия поля.
Внешний вид (Appearance)	Выберите стиль поля: заполненное или с рамкой.
Цвет текста в поле (Input field text color)	Выберите цвет текста, который посетители вводят в полях формы.
Цвет фона (Background color)	Выберите цвет заливки полей.
Скругление (Rounding)	Задайте радиус скругления в пикселях.
Цвет рамки (Border color)	Выберите цвет рамки поля.
Размер (Size)	Выберите размер поля: S, M или L.

Если переключатель Двухэтапная форма (Two-step form) включен, стили полей разделяются на два раздела: Встроенная форма (Static form) — для полей на странице и Модальное окно (Modal form) — для полей в модальном окне. Это позволяет настраивать их независимо.

Настройте кнопку

В режиме отображения Встроенная форма (Static form) есть одна кнопка формы. В режиме отображения Модальное окно (Modal form) есть две кнопки:

Кнопка формы	Отображается на странице и открывает модальное окно при нажатии.
Кнопка в модальном окне	Отображается в модальном окне и отправляет форму при нажатии.

В поле Кнопка формы (Form button) нажмите иконку карандаша рядом с названием кнопки, чтобы настроить ее. Доступны следующие параметры:

Текст (Text)	Введите подпись кнопки.
Стиль (Style)	Выберите стиль кнопки: Основной (Primary), Вторичный (Secondary) или Настроенный (Custom). Выберите размер кнопки: S, M или L.
Ширина (Width)	Выберите ширину кнопки: Авто (Auto), На всю ширину контейнера (Full width of the container) или Фиксированная (Fixed).
Добавить иконку (Add icon)	Включите, чтобы добавить иконку к кнопке. Выберите положение иконки: перед текстом, после текста или по центру над текстом.
Дополнительный эффект (Additional effect)	Включите, чтобы добавить анимационный эффект к кнопке. В поле Условие (Condition) выберите, когда срабатывает эффект: По наведению (Hover) или Всегда (Static). В поле Эффект (Effect) выберите тип анимации: Bounce, Shake, Decrease или Increase.
Тень (Shadow)	Включите, чтобы добавить тень к кнопке. Задайте параметры тени: Смещение X (Offset X), Смещение Y (Offset Y), Размытость (Blur), Размер (Spread) в пикселях и Цвет (Color).

Настройте дополнительные возможности

Вы можете управлять поведением формы после отправки, обработкой данных контактов и уровнем защиты от злоупотреблений. Эти опции помогают настроить взаимодействие с посетителями сайта, поддерживать актуальность данных в CRM и повысить безопасность форм. Для этого перейдите в Дополнительные настройки формы (Additional form settings).

Ниже рассмотрим доступные дополнительные возможности и принципы их использования.

Действие после подписки (Action after submitinng)	Используется для настройки страницы после отправки формы. Вы можете показать сообщение или перенаправить посетителя на другую страницу сайта. Читайте подробнее: Настройте страницу после отправки формы.
Перезаписывать данные контакта в CRM при повторной отправке формы (Overwrite CRM contact data after form resubmitting)	Используется для существующих контактов в SendPulse CRM — если контакт отправит форму, его данные будут перезаписаны. Активируйте переключатель.
Разрешать посетителям вводить только корпоративные email адреса (Require visitors to enter corporate email addresses only)	Используется для ограничения ввода email-адресов в формах только корпоративными доменами. Активируйте переключатель. После активации адреса из публичных почтовых сервисов (например, gmail.com, yahoo.com, hotmail.com, outlook.com) не проходят валидацию и не отправляются.
Показывать CAPTCHA (Show CAPTCHA)	Используется для защиты сайта и предотвращения автоматического заполнения форм ботами. Выберите нужный лимит: 10, 100 или 1000. По умолчанию указан лимит 100. Это означает, что CAPTCHA появится, если посетитель отправит 100 форм с одного IP-адреса в течение 10 минут. Читайте подробнее: Как настроить CAPTCHA в форме подписки.

Настройте аналитику

Вы можете настроить передачу целей с формы в события Google Analytics и Facebook Pixel. Нажмите Настроить аналитику (Analytics settings).

Если у вас не активирована аналитика, перейдите по ссылке Как настроить (How to set it up).

Для активации передачи данных, в настройках сайта должны быть добавлены коды пикселя Facebook и Google Analytics. Узнайте больше: Как подключить Google Analytics к сайту и Как подключить пиксель Facebook к сайту.

Если у вас активирована аналитика, вы увидите два переключателя.

Если вы активировали переключатель Передавать цель в Google Analytics, введите данные для полей Категория (Category), Действие (Action), Метка (Label) — эти параметры будут передаваться в аналитику в разделе События.

Если вы активировали переключатель Передавать цель в пиксель Facebook, автоматически будет сформировано событие Complete Registration. Его вы сможете просмотреть в Менеджере событий вашего бизнес-аккаунта Facebook.

Обновлено: 22.12.2025

Оцените, насколько полезна статья "Виджет Форма в конструкторе сайтов"

Оценка: 5 / 5 (1)

Популярное в нашем блоге

Виджет Форма в конструкторе сайтов

Содержание

Добавьте элемент Форма

Выберите, куда сохранять контакты

Создание сделки и контактов в CRM

Создание контактов в адресной книге

Добавление подписчиков в чат-бот

Настройте поля формы

Выберите вид формы

Добавление полей

Настройка соотношения полей

Настройте стиль полей

Встроенная форма

Модальное окно

Настройте кнопку

Настройте дополнительные возможности

Настройте аналитику

Начните пользоваться сервисом SendPulse прямо сегодня