Платформа

Разработчик

приложение

Popup для Webasyst

Окна, баннеры и формы на сайте — без программирования

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

  • Собирайте окно из блоковТекст, картинки, видео, кнопки, форма заявки и HTML без ручной вёрстки.
  • Выбирайте точный момент показаУсловия по странице, времени, прокрутке и другим действиям посетителя.
  • Отдельное оформление для телефонаНастраивайте мобильный вид и включайте нужные окна по готовности.
ДОСТУПЕН

Линейка StartWebSite · Webasyst · 1.1.8

Зачем это сайту

Сообщение появляется, когда посетителю оно нужно

Всплывающее окно не обещает конкретных результатов: они зависят от вашего предложения и аудитории. Popup даёт точный контроль над тем, когда и кому окно показывается, и не требует программирования.

Сообщение в нужный момент

Окно появляется после задержки, при прокрутке, при уходе с сайта или после добавления товара в корзину. Посетитель видит его тогда, когда оно уместно.

Заявки на почту без программиста

Блок «Форма» собирает имя, телефон, email и другие данные и отправляет письмо на указанный адрес. После отправки посетитель видит ответ или переходит по ссылке.

Условия для магазина

Окно можно привязать к сумме и количеству товаров в корзине, добавлению и удалению товара, цене товара. Для Shop-Script подключение автоматическое.

Отдельная версия для телефона

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

Выбор редакции

Какая редакция подойдёт?

Сначала выберите по своей задаче. Полные списки функций — внутри каждой карточки.

База

Окна, уведомления и баннеры

Подойдёт, если Нужно собирать окна из блоков и управлять условиями их показа.

Что входит в Базу
  • Типы Popup, Toast и Banner
  • Блоки: текст, изображение, видео, кнопка, форма, HTML, линия, иконка закрытия
  • Все условия показа

Премиум

Таймер и переходы между окнами

Подойдёт, если В сценарии нужны обратный отсчёт и кнопка, открывающая другой поп-ап.

Что дополнительно в Премиум
  • Блок «Таймер» обратного отсчёта
  • Действие «Открыть другой поп-ап» в кнопке и в форме

В Базовой уже доступны типы Popup, Toast и Banner, блоки содержимого и условия показа. Premium добавляет два специальных инструмента — не отдельный конструктор.

Наличие редакций, актуальные версии и условия покупки уточняйте в Webasyst Store.

Как это работает

Блоки, условия, активация

Всё настраивается в приложении Popup. На сайт нужно один раз подключить служебный код: в Shop-Script это происходит автоматически.

  1. Соберите окно

    Выберите тип и перетащите блоки: текст, изображение, форму, кнопку. Оформление задаётся отдельно для десктопа и телефона.

  2. Задайте условия

    Когда показывать: задержка, прокрутка, страница, устройство, корзина, дата и время. Лишние условия оставьте пустыми.

  3. Активируйте

    Приложение перечислит условия простыми фразами. Включите флажок «Активировать» и сохраните: окно появится на сайте.

Popup на витрине вымышленного магазина «Тропа». Тестовый стенд.
Toast после добавления товара в корзину: страница остаётся доступной.

Popup

Модальное окно: фон затемняется, прокрутка страницы блокируется.

  • Для важных предложений и форм заявок
  • Позиция: центр, края и углы экрана
  • Анимации открытия и закрытия

Toast

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

  • Для уведомлений и напоминаний
  • Не мешает покупке
  • Те же блоки и условия показа

Banner

Блок, встроенный в страницу: над сайтом, под сайтом или в месте, где вы вставили хелпер.

  • Для объявлений и рекламных блоков
  • Вывод в нужном месте шаблона одной строкой
  • Те же блоки и условия показа

Для чего использовать

Пять типичных задач

Примеры показывают, как условия работают вместе. Подставьте свои тексты и пороги.

  • Нужно собрать контактырезультатОкно со скидкой и формой email

    Popup с блоком «Форма»: письмо уходит на ваш адрес, посетитель видит текст благодарности.

    Заявки

  • Идёт акция с дедлайномрезультатОкно с таймером обратного отсчёта

    Блок «Таймер» и период показа по датам: окно исчезнет вместе с акцией. Таймер — в премиум-лицензии.

    Акции

  • Посетитель уходит с товарами в корзинерезультатНапоминание при попытке покинуть сайт

    Условия «Попытка покинуть сайт» и «Товаров в корзине больше» вместе дают окно с кнопкой «Оформить заказ».

    Корзина

  • Сумма заказа близка к порогу доставкирезультатСообщение о бесплатной доставке

    Условие по сумме товаров в корзине показывает Toast, когда посетитель достиг заданного порога.

    Доставка

  • Праздники и изменение графикарезультатБаннер над сайтом на нужные даты

    Тип Banner и период показа: объявление появится и пропадёт само.

    Объявления

Все сценарии с пошаговой настройкой

Возможности

Содержимое, условия и оформление

Всё, что видит посетитель и когда он это видит, настраивается в приложении. Блок «Таймер» и действие «Открыть другой поп-ап» входят в премиум-лицензию.

  • Блоки без программирования

    Текст, изображение, видео, кнопка, форма, таймер, HTML, линия и иконка закрытия собираются перетаскиванием.

  • Условия по поведению

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

  • Ограничения показа

    Число показов за сессию и за всё время, повторный показ через заданное число дней: окно не надоедает.

  • Страница и устройство

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

  • Дата и время

    Период показа, день недели, часы начала и окончания: акция включается и выключается по расписанию.

  • Собственные стили

    Анимации, цвета, размеры и отступы настраиваются в интерфейсе; для тонкой доводки есть поле CSS.

Настоящий интерфейс

Как это выглядит в настройках и на витрине

Снимки сделаны в версии 1.1.8 на тестовом стенде с вымышленными данными. Нажмите на скриншот, чтобы рассмотреть детали.

Первый запуск

От установки до первого окна

Приложение устанавливается через Установщик Webasyst. Дополнительных настроек сервера не требуется.

  1. Установите Popup из магазина Webasyst стандартным установщиком приложений.

  2. Откройте приложение, выберите витрину и подключите Popup к сайту: в Shop-Script это происходит автоматически, в остальных случаях код хелпера показывает само приложение.

  3. Нажмите «Добавить поп-ап», задайте тип и соберите окно из блоков на вкладке «Контент».

  4. На вкладке «Условия показа» настройте нужные условия, затем на вкладке «Активация» включите «Активировать» и сохраните.

Пошаговая инструкция с иллюстрациями

Перед установкой

Что важно знать

Требования

  • Платформа Webasyst: самостоятельное приложение, не привязано к Shop-Script
  • Интерфейс администратора: UI 1.3 и UI 2.0
  • Условия по корзине и товару работают в Shop-Script
  • Приложение «Установщик» Webasyst версии 2.7.0 или новее
  • Для подключения вне Shop-Script нужен доступ к шаблону сайта: хелпер вставляется внутри тега head
  • Блок «Таймер» и действие «Открыть другой поп-ап» требуют премиум-лицензии

Ограничения

  • A/B-тесты находятся в разработке и пока недоступны.
  • Если не задано ни одно условие, окно показывается сразу после загрузки страницы.
  • Блок «Таймер» и действие «Открыть другой поп-ап» доступны только на премиум-лицензии.
  • Условия «Якорь» и «Клики по элементам» работают, только если у нужного элемента страницы есть id, класс или другой атрибут для селектора.
  • Предпросмотр в редакторе совпадает с окном на сайте примерно на 90 %: окончательный вид проверяйте на сайте.
  • Popup и плагин Pop-up notifications PRO — отдельные продукты, настройки одного не переносятся в другой.

Частые вопросы

Коротко о главном

Остальные ответы — в разделе «Вопросы и неполадки» руководства.

Окно не появилось на сайте. Почему?

Проверьте по порядку: на вкладке «Активация» включён флажок «Активировать» и карточка сохранена; выбрана нужная витрина; приложение подключено к сайту; не сработал лимит показов (проверьте в приватном окне браузера); выполнены все заданные условия.

Как подключить Popup к сайту?

В Shop-Script подключение автоматическое, если работает хук frontend_head. В остальных случаях вставьте код хелпера в шаблон сайта внутри тега head. Готовый код для вашей витрины показывает окно «Установка приложения» на главном экране.

Что будет, если не задать ни одного условия?

Окно покажется сразу после загрузки страницы. Задавайте только нужные условия, остальные оставьте пустыми: они работают совместно.

Как вывести баннер в определённом месте страницы?

Выберите тип Banner и позицию «In the helper». Вставьте в шаблон код {$wa->popup->output('ID')} с идентификатором окна из его карточки: готовую строку приложение показывает в поле «Output helper».

Что доступно только в премиум-лицензии?

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

Форма не присылает письма. Что проверить?

Адрес для уведомлений заполнен; письма не попали в «Спам»; если на сайте используется SMTP или Sendmail, адрес отправителя совпадает с настройками Webasyst; в форме есть кнопка, а обязательные поля заполнены.

Видео

Посмотрите приложение в работе

Плеер RUTUBE загрузится после нажатия кнопки.

Открыть на RUTUBE

Popup для Webasyst

Покажите нужное сообщение в нужный момент

Установите приложение, соберите первое окно и включите его одним флажком.

Просмотр изображения
Оригинал