PopUp-формат — это способ показать квиз поверх страницы сайта, не уводя пользователя с неё. Посетитель нажимает на кнопку или видит баннер, а квиз открывается во всплывающем окне. Такой формат не ломает дизайн сайта и не заставляет пользователя переходить на другую страницу: он остаётся там же, но получает доступ к квизу.
Что можно настроить в PopUp
- Дизайн кнопки: внешний вид, цвет, шрифт, положение на странице.
- Баннер: массивная плашка с текстом, которую можно растянуть во весь экран или разместить в углу.
- Автосоздание кнопки: кнопка создаётся автоматически при загрузке страницы с фиксацией положения.
- Показ по устройствам: иконки устройств позволяют выбрать, где показывать кнопки, а где скрывать.
- Отступы от границ: чтобы кнопка не перекрывала другие виджеты сайта.
- Задержка появления: баннер плавно появляется спустя указанное время.
- Затемнение фона: по умолчанию фон затемняется, но это можно отключить.
Квиз можно добавить на сайт поверх всех окон, с открытием по клику на кнопку. Наш редактор даёт возможность настроить дизайн кнопки или баннера и установить их на сайт в нужное место, либо создавать автоматически при загрузке страницы с фиксацией положения на странице.
Шрифт текстов на кнопке подчиняется CSS-правилам вашего сайта, и вы можете поменять его через собственные файлы стилей.Размещение SCRIPT на сайте
Чтобы PopUp-окно заработало, в любой части вашего сайта должен быть размещён SCRIPT. Размещайте его на всех страницах сайта, где хотите увидеть квиз. Если скрипт добавлен только на одну страницу — PopUp сработает только там.
Настройка автоматических кнопок
Иконки устройств позволяют выбрать, где показывать автоматические кнопки, а где скрывать. Также вы можете настроить внешний вид, положение на странице и отступы от границ экрана, чтобы кнопка не перекрывала другие виджеты на вашем сайте.
Если отключена опция «Создавать кнопку», вам придётся вставить её DIV-код вручную. Это удобно, если вы хотите использовать свою кнопку, а не автоматическую.
Настройка баннера
Баннер — это более массивная плашка, содержащая дополнительный текст. Вы можете растянуть её во весь экран снизу или сверху либо разместить в одном из углов сайта. Если указана задержка, баннер будет плавно появляться спустя указанное время.
Задержка появления и затемнение фона
По умолчанию на больших экранах фон позади квиза затемняется, но вы можете отключить это поведение. В любом случае клик по фону будет закрывать PopUp-окно. Задержка появления работает для баннера: он появится не сразу, а спустя указанное время, плавно.
DIV-код: когда нужен вручную
Если вы отключили опцию «Создавать кнопку», автоматическая кнопка не появится. В этом случае вставьте DIV-код вручную в нужное место сайта. Это может быть полезно, когда вы хотите использовать собственную кнопку в дизайне или разместить её в конкретном блоке, а не в фиксированном положении.
Как проверить, что PopUp работает
- Откройте сайт в режиме инкогнито — так вы увидите страницу без кэша.
- Нажмите на кнопку или баннер и проверьте, открывается ли PopUp.
- Проверьте, что отступы и положение кнопки не перекрывают другие виджеты.
- Убедитесь, что кнопка не появляется на устройствах, где вы её скрыли.
- Проверьте работу на мобильных — PopUp должен открываться корректно.
- Проверьте, что клик по фону закрывает PopUp.
Частые ошибки при установке через PopUp
- Забывают разместить SCRIPT — PopUp не срабатывает.
- Не настраивают отступы и положение кнопки — она перекрывает другие виджеты.
- Не выбирают устройства для показа — кнопка появляется там, где не нужна.
- Забывают про DIV-код при отключённой опции «Создавать кнопку».
- Не проверяют, как баннер выглядит на мобильных.
- Оставляют затемнение фона включённым там, где оно мешает.
Коротко: что делать при установке через PopUp
- Разместите SCRIPT на всех страницах, где должен появляться квиз.
- Настройте дизайн кнопки или баннера: цвет, шрифт, положение.
- Выберите устройства для показа и настройте отступы от границ.
- Если отключили «Создавать кнопку» — вставьте DIV-код вручную.
- Настройте задержку появления баннера и затемнение фона.
- Проверьте работу в инкогнито, на мобильных и в разных браузерах.
