Встроенные виджеты: как встроить формы и призывы к действию в страницу сайта с LeadPlan

Email-маркетинг | LeadPlan | Лидогенерация | Маркетинг — читать 10 мин.

Встроенные виджеты — эффективный способ сбора контактов и призыва к действию. Если этот термин звучит для вас в новинку, после этой статьи вы точно будете знать, что это такое. Подробно расскажем, чем встроенные inline виджеты отличаются от обычных и как встроить виджет на сайт с сервисом LeadPlan.

Команда LeadPlan

1 ноября 2025 г.

Что такое встроенные виджеты и чем они отличаются от обычных?

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

Встроенный виджет в блоге DashaMail

В чём преимущества встроенных виджетов?

Нативное дополнение контента без отвлекающих деталей. Виджет не мешает пользователю перемещаться по странице, не раздражает и не препятствует выполнению цели визита.
Бесшовное встраивание. Нет необходимости перехода на другие ресурсы, конфликтов со стилями и скриптами.
Загрузка вместе с сайтом. Элемент интерфейса не загружается раньше или позже основной страницы, а делает это вместе с ней, как часть сайта.
Размещение на любых страницах и сайтах. Один виджет можно легко встроить на разные страницы или даже на разные сайты без изменения кода.

Какие механики можно использовать: 5 примеров встроенных виджетов

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

Встроенные виджеты для сбора контактов

Виджет подписки на рассылку

Ведёте свою рассылку и собираете данные подписчиков? Настройте встроенный виджет подписки и разместите на всех или на нескольких страницах сайта.
Он будет ненавязчиво собирать контактные данные для будущего прогрева потенциальных клиентов. Главное, сделайте его выделяющимся и продумайте полезный лид-магнит для подписки.

Встроенный виджет подписки на сайте «Оксфордстрит»

Если вы ещё не запустили рассылку и теряете возможность общаться со своей аудиторией прямо сейчас, запустите этот канал с сервисом DashaMail.

В DashaMail есть всё, чтобы начать email-маркетинг:

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

Регистрируйтесь в сервисе DashaMail и отправляйте бесплатно до 2000 писем.

Сбор контактов

Встроенный виджет можно также использовать для сбора контактов или заявок.
Например, виджет-бар:

Встроенная форма сбора контактов на сайте «Единого центра услуг»

Или виджет с формой:

Встроенная форма сбора контактов

Настройте в LeadPlan нужное количество полей и собирайте все полезные данные: номер телефона, email, имя. Цвет и стиль самого виджета и кнопки также легко кастомизируются.

Создание дизайна виджета в LeadPlan

Квиз-виджет в кнопке или баннере

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

Шаг 1. Баннер с предложением пройти опрос

Шаг 2. Квиз-опрос

Как сделать виджет, который будет появляться по клику на кнопку, читайте в Базе знаний.

Встроенные виджеты-уведомления

Уведомление об акции

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

Виджет в карточках товара

Ещё один вариант — контент, органично встроенный среди товарных карточек. Это не только привлекает внимание пользователей сайта, но и свежо выглядит.

Такой формат ещё не заезжен и не так много используется, поэтому вы можете привлечь много внимания.

Как создать этот виджет? Для этого понадобится кастомная настройка в LeadPlan.

Как создать встроенный виджет в LeadPlan?

Теперь вы знаете, что такое инлайн-виджет. Перейдем к процессу создания и кратко опишем, как создать встроенный виджет в LeadPlan. Более подробная инструкция уже ждёт вас в Базе знаний.

Шаг 1. Регистрируемся в LeadPlan

Если у вас ещё нет личного кабинета, зарегистрируйтесь в LeadPlan. Это бесплатно и займет всего пару минут — понадобится только пароль, почта и ваш сайт. После этого вы сможете создать виджет и тестировать бесплатно до 10 000 показов.

Шаг 2. Установка кода

После регистрации нужно подключить сайт к LeadPlan. Для этого вам просто понадобится вставить HTML-код на ваш сайт.

Подробная инструкция по установке кода уже в Базе знаний

Шаг 3. Создаём встроенный инлайн-виджет

Первым делом выберите формат. В LeadPlan представлены уже готовые решения, которые вам нужно только адаптировать под свой дизайн. Например, изменить цвета, логотип, картинки или поля в форме.

Перейдите на вкладку «Виджеты» — «Встроенные в контент» и выберите подходящий шаблон.

Если вы хотите создать виджет, шаблона которого нет в LeadPlan, вам понадобится кастомная разработка и навыки работы с кодом.

Шаг 4. Настраиваем содержимое инлайн-виджета

Перейдите к блоку «Параметры», выберите параметр «Расположение» и, если нужно разместить виджет в определённом месте на сайте, заполните поле «Селектор».

Селектор элемента — это уникальный код того блока, перед, после или внутри которого вы хотите встроить виджет на странице.

Если вы разбираетесь в CSS, вам будет полезна статья о селекторах. Если нет — установите в браузере любое расширение для поиска CSS-селекторов, например Get Unique CSS Selector.

Шаг 5. Выбираем условия показа

Настройте поведение виджета. В зависимости от ваших задач он может:

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

Настройка условий показа встроенного виджета в LeadPlan

Шаг 6. Настраиваем таргетинг

В настройках встроенных виджетов LeadPlan доступны следующие типы таргетинга:

по целевым страницам на сайте;
URL параметрам;
наличию / отсутствию произвольного CSS (JavaScript) селектора DOM элемента;
по фразе в коде страницы;
по типу устройства;
по ОС устройства посетителя;
по типу браузера.

Пример готового встроенного виджета в LeadPlan

Готово! Теперь на вашем сайте есть красивый встроенный виджет.

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

Начните прямо сейчас. Регистрируйтесь в LeadPlan и создавайте 20 виджетов до 10 000 просмотров бесплатно.