Размещение квиза на сайте – универсальный код
Размещение квиза AdsQuiz на сайте
В этой инструкции разберём, как использовать квиз AdsQuiz как полноценную часть сайта – не только как стандартную форму, но и как виджет, попап или интерактивный блок на разных страницах.
Сегодня квиз можно добавить на сайт в разных форматах в зависимости от целей. Он может работать как полноценная страница для сегментации аудитории или как отдельный элемент интерфейса, который помогает собирать заявки.
Квиз можно разместить в разных частях сайта:
• как блок на странице;
• как попап;
• как чат-форму;
• как боковую панель;
• как интерактивную подсказку или кнопку запуска.
Также доступны разные триггеры показа:
• через определённое время на сайте;
• по клику на кнопку;
• при попытке уйти со страницы (exit intent);
• автоматически при загрузке страницы.
Так можно точно настроить поведение квиза и повысить конверсию для каждого сценария.
Настройка размещения квиза
Шаг 1. Чтобы установить квиз на сайт, перейдите в настройки квиза и откройте раздел «Установка квиза на сайт».
Затем:
- Укажите домен, на котором будет размещён квиз.
- Выберите формат отображения (блок, попап, виджет и т. д.).
- Задайте размер квиза или используйте один из готовых вариантов.
- При необходимости задайте свои параметры отображения вручную.
- Выберите устройства (десктоп, мобильные или все).
Также можно настроить внешний вид:
• цвета кнопок;
• цвета иконок;
• стили элементов интерфейса.
💡 Совет: используйте настройки внешнего вида – они позволяют полностью адаптировать квиз под дизайн сайта.
Шаг 2. Генерация и вставка кода
После настройки нажмите «Сгенерировать код» – система создаст скрипт для вставки.
Вставьте его в нужный блок или раздел шаблона сайта.
Шаг 3. Проверка работы
После публикации проверьте:
• как квиз выглядит на десктопе и мобильных;
• работают ли триггеры показа (клик, время, exit intent);
• корректно ли собираются заявки.
⚠️ Важно:Перед размещением убедитесь, что домен добавлен в настройках AdsQuiz.
🧩 WordPress
Как разместить квиз
• откройте админ-панель WordPress
• перейдите на нужную страницу или запись
• добавьте блок «Код» или Custom HTML
• вставьте JS-скрипт
• сохраните и опубликуйте
🛒 Shopify
Как разместить квиз
• откройте админ-панель Shopify
• перейдите в Online Store → Themes → Edit code
• откройте нужный шаблон (товар, страница или theme.liquid)
• вставьте скрипт перед </body> или в нужный блок
• сохраните изменения
🎯 Wix
Как разместить квиз
• откройте редактор Wix
• нажмите Add → Embed → Custom Embeds
• выберите HTML iframe / Embed Code
• вставьте скрипт AdsQuiz
• разместите блок на странице
• опубликуйте сайт
🧩 Webflow
Как разместить квиз
• откройте проект в Webflow
• перейдите в Page Settings или Project Settings
• найдите раздел Custom Code
• вставьте скрипт в Before tag
• сохраните и опубликуйте сайт
⚡ Lovable
Как разместить квиз
• откройте редактор Lovable
• перейдите в раздел пользовательского кода или интеграций
• вставьте JS-скрипт AdsQuiz
• сохраните изменения
• опубликуйте страницу
⚛️ Next.js
Как разместить квиз
• откройте проект Next.js
• добавьте скрипт в компонент _app.js или layout.js
• сохраните и запустите проект
▶️ Рекомендуемое видео
Чтобы лучше разобраться в процессе настройки, рекомендуем посмотреть видеоинструкцию:
❓ Часто задаваемые вопросы
Можно ли разместить квиз без кода? Нет. Для размещения используется сгенерированный JS-скрипт.
Работает ли квиз на мобильных устройствах? Да, квиз адаптивный и автоматически подстраивается под мобильные и десктоп.
Можно ли использовать квиз как попап? Да. Доступные форматы: блок, виджет, попап, чат-форма.
Можно ли добавить квиз на несколько доменов? Да. В поле «Домен» раздела «Поделиться» есть кнопка «Добавить домен» – можно добавить несколько адресов. Это удобно, если один квиз используется одновременно на основном сайте и на микролендингах.