Вставка квізу на сайт – універсальна вставка
Вставка квізу AdsQuiz на сайт
У цьому матеріалі розглянемо, як використовувати квіз AdsQuiz як повноцінний елемент вашого сайту — не лише як стандартну форму, а як віджет, попап або інтерактивний блок на різних сторінках.
Сьогодні квіз можна інтегрувати на сайт у різних форматах, залежно від ваших задач. Він може виступати як повноцінна сторінка для сегментації аудиторії або як окремий елемент інтерфейсу, який допомагає збирати ліди.
Ви можете розмістити квіз у різних частинах сайту:
• як блок на сторінці;
• як попап;
• як чат-форму;
• як бокову панель;
• як інтерактивну підказку або кнопку запуску.
Також доступні різні умови появи квізу:
• через певний час перебування на сайті;
• при кліку на кнопку;
• при спробі закрити сторінку (exit intent);
• автоматично при завантаженні сторінки.
Це дозволяє гнучко налаштовувати поведінку квізу та підвищувати конверсію залежно від сценарію користувача.
Налаштування вставки квізу
Крок 1. Щоб встановити квіз на сайт, перейдіть у налаштування вашого квізу та відкрийте розділ «Встановлення квізу на сайт».
Далі виконайте такі дії:
- Вкажіть домен, на якому буде розміщено квіз.
- Оберіть формат відображення (блок, попап, віджет тощо).
- Налаштуйте розмір квізу або використайте готові варіанти.
- За потреби задайте власні параметри відображення вручну.
- Оберіть пристрої (desktop, mobile або всі).
Також ви можете налаштувати зовнішній вигляд:
• кольори кнопок;
• кольори іконок;
• стилі елементів інтерфейсу.
💡 Порада: Обирайте налаштування зовнішнього вигляду. Це дозволяє повністю адаптувати квіз під дизайн вашого сайту.
Крок 2. Генерація коду та вставка
Після налаштування натисніть «Згенерувати код» — система створить скрипт для вставки.
Вставте його на сайт у відповідний блок або секцію шаблону.
Крок 3. Перевірка роботи
Після публікації перевірте:
• відображення на desktop та mobile;
• роботу сценаріїв появи (клік, час, exit intent);
• коректність збору заявок.
⚠️ Важливо:Перед вставкою переконайтеся, що домен додано в налаштуваннях AdsQuiz.
🧩 WordPress
Як вставити квіз
• відкрийте адмін-панель WordPress
• перейдіть на потрібну сторінку або запис
• додайте блок «Код» або Custom HTML
• вставте JS-скрипт
• збережіть та опублікуйте
🛒 Shopify
Як вставити квіз
• відкрийте адмін-панель Shopify
• перейдіть у Online Store → Themes → Edit code
• відкрийте потрібний шаблон (product, page або 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-скрипт.
Чи працює квіз на мобільних пристроях? Так, квіз адаптивний і автоматично підлаштовується під mobile та desktop.
Чи можна використовувати квіз як попап? Так. Доступні формати: блок, віджет, попап, чат-форма.
Чи можна додати квіз на декілька доменів? Так. У полі «Домен» у розділі «Поширити» є кнопка «Додати домен» — можна вказати кілька адрес. Це зручно, якщо один квіз використовується одночасно на основному сайті та на мікролендингах.