poptimizer Docs

Установка и Подключение

Быстрый Старт

Для подключения попапов на ваш сайт достаточно добавить один скрипт перед закрывающим тегом </body>:
<script
  id="pop-script"
  data-id="ВАШ_DOMAIN_ID"
  src="https://poptimizer.ru/popup/script.min.js"
></script>
Domain ID вы можете найти в панели управления в разделе "Интеграция".

Характеристики Скрипта

  • Размер: ~20-25 КБ (после сжатия)
  • Загрузка: Асинхронная, не блокирует отображение страницы
  • Поддержка: Все современные браузеры (Chrome, Firefox, Safari, Edge)
  • Совместимость: Работает с любыми CMS и фреймворками (WordPress, Shopify, React, Vue и др.)

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

После загрузки скрипт:
  1. Запрашивает настройки попапов для вашего домена
  2. Определяет, какие попапы показывать на текущей странице
  3. Отображает попапы в соответствии с заданными триггерами
  4. Собирает анонимную статистику просмотров
Все это происходит незаметно для пользователя и не влияет на скорость загрузки сайта.

Безопасность

Мы серьезно относимся к безопасности вашего сайта:
  • Изоляция кода: Скрипт работает в изолированном контексте и не конфликтует с кодом вашего сайта
  • Защита данных: Передача данных происходит по защищенному HTTPS протоколу
  • Без сторонних зависимостей: Все необходимое включено в один файл
  • Проверенный код: Регулярный аудит безопасности и обновления

Совместимость со Стилями

Скрипт создает изолированное пространство для попапов:
  • Собственные стили: Попапы используют собственную таблицу стилей, которая не влияет на ваш сайт
  • Уникальные классы: Все CSS-классы имеют префикс для предотвращения конфликтов
  • Z-index контроль: Попапы отображаются поверх всех элементов (z-index: 2147483647)
  • Сброс стилей: Встроенная нормализация защищает от наследования стилей вашего сайта
Если вы используете сильно кастомизированные стили или CSS-in-JS решения, попапы все равно будут отображаться корректно.

Single Page Applications (SPA)

Скрипт автоматически определяет изменения маршрутов в SPA:
  • Работает с React Router, Vue Router, Next.js
  • Автоматически проверяет таргетинг при переходе между страницами
  • Очищает старые попапы при навигации
Никакой дополнительной настройки не требуется.

Производительность

Мы оптимизировали скрипт для минимального влияния на производительность:
  • Легкий вес: ~20 КБ (меньше, чем одно изображение)
  • Быстрая загрузка: ~100-200 мс до полной готовности
  • Ленивый рендеринг: Попапы создаются только при необходимости
  • Эффективный таргетинг: Проверка страниц происходит мгновенно
Скрипт не замедлит ваш сайт и не повлияет на показатели Core Web Vitals.

Отладка

Для проверки работы скрипта откройте консоль браузера (F12):
// Проверить загрузку скрипта
window.__poptimizer;

// Просмотреть активные попапы
window.__poptimizer.state.popups;

// Очистить историю показов (для тестирования)
localStorage.clear();

Удаление

Если вы решите отключить попапы, просто удалите строку со скриптом из вашего сайта. Никаких следов или cookies не останется.
Возникли вопросы? Свяжитесь с нами через чат поддержки poptimizer в телеграм или email: js@asychev.ru.
    Поптимайзер