Можно ли зафиксировать версию виджета и указать integrity= ?

Да. Строка из инструкций — /widget/ВСТАВЬТЕ_КЛЮЧ_САЙТА.js — «скользящая»: она всегда отдаёт текущий виджет, поэтому хэш Subresource Integrity к ней не приложить (байты меняются). Рядом каждая версия отдаётся ещё и по неизменяемому адресу с хэшем содержимого. Запросите https://tryclew.ru/api/v1/widget-version?site=ВАШ_КЛЮЧ — в ответе будут version, path и integrity; подставьте их в тег: /ВАШ_КЛЮЧ.js" integrity="sha384-…" crossorigin="anonymous" async> . Закреплённый адрес не меняется, поэтому браузер откажется выполнить файл, если отличается хотя бы один байт. Версию вы обновляете тогда, когда сами решите, — тот же запрос можно делать из скрипта деплоя. Больше ничего не меняется: туры по-прежнему публикуются в редакторе Clew без правок сайта.

Поп-апы, туры и чеклисты через Яндекс Тег Менеджер

Автор: Андрей Давыдов · обновлено 26 сентября 2026

Если на сайте уже стоит Метрика, поп-ап, тур по личному кабинету или чеклист можно добавить прямо из её интерфейса — без правок кода и без программиста. Один раз ставите Clew тегом, дальше всё собирается в редакторе Clew.

Время: ● 10 минут
Кто делает: Владелец тега Метрики или сотрудник с доступом к Тег Менеджеру
Шагов: 8

Пошагово

Шаг 01
Скопируйте код из Clew
Зарегистрируйтесь или войдите в Clew и откройте Админка → Обзор. Пока виджет не установлен, там карточка «Виджет пока не подаёт сигналов.» с вашей строкой — нажмите на неё, чтобы скопировать. Выглядит она как код ниже, только с настоящим ключом сайта.
```

<script src="https://tryclew.ru/widget/ВСТАВЬТЕ_КЛЮЧ_САЙТА.js" async></script>
```
Шаг 1 · схема интерфейса
Шаг 02
Включите Тег Менеджер в настройках Метрики
Откройте metrika.yandex.ru, выберите тег своего сайта и перейдите в Настройки. Включите опцию Тег Менеджер и отметьте Пользовательский HTML — без неё произвольный код добавить нельзя. Нажмите Сохранить.
Включить Тег Менеджер может только владелец тега Метрики. Код Метрики на сайте менять не нужно.
Шаг 2 · схема интерфейса
Шаг 03
Создайте новый тег
В меню Метрики откройте раздел Тег Менеджер, вкладку Теги, и нажмите Добавить тег.
Шаг 3 · схема интерфейса
Шаг 04
Выберите «Пользовательский HTML» и вставьте строку
Шаблон тега — Пользовательский HTML. Назовите тег, например Clew, и вставьте в поле кода строку из шага 1.
Шаг 4 · схема интерфейса
Шаг 05
Назначьте триггер «Просмотр страницы»
Привяжите к тегу триггер типа Просмотр страницы, чтобы виджет загружался на всех страницах. Если такого триггера ещё нет, создайте его на вкладке Триггеры кнопкой Добавить триггер. Сохраните тег.
Шаг 5 · схема интерфейса
Шаг 06
Проверьте в режиме предварительного просмотра
Запустите предварительный просмотр и откройте сайт: тег Clew должен быть среди сработавших. Яндекс рекомендует проверять так любые изменения перед публикацией.
Шаг 6 · схема интерфейса
Шаг 07
Опубликуйте изменения
Нажмите Опубликовать и добавьте описание версии, например «Добавлен виджет Clew». Пока изменения не опубликованы, на сайте они не действуют.
Шаг 7 · схема интерфейса
Шаг 08
Убедитесь, что всё работает
Откройте любую страницу сайта в обычном окне браузера и вернитесь в Clew, в раздел Обзор. В течение минуты карточка станет зелёной: «Виджет активен.» Можно создавать первый тур прямо поверх сайта.
Шаг 8 · схема интерфейса

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

Интерфейс обновляется

Тег Менеджер в Метрике активно развивается, и подписи кнопок могут немного отличаться от схем на этой странице. Логика остаётся той же: включить Тег Менеджер и пользовательский HTML, создать тег с кодом, назначить триггер на просмотр страницы, проверить и опубликовать. Актуальное описание — в справке Метрики.

Нет Метрики на сайте

Тег Менеджер работает через установленный тег Метрики. Если Метрики на сайте нет, её установка — такая же вставка кода, как и Clew. Проще сразу воспользоваться инструкцией для Тильды, Битрикса и WordPress или ИИ-ассистентом.

Одностраничные приложения

Если Метрика считает переходы внутри SPA отдельными просмотрами, триггер может срабатывать при каждом переходе. Это безопасно: повторную загрузку виджет игнорирует.

Что можно добавить через Яндекс Тег Менеджер без программиста

После установки строки каждый формат ниже собирается в редакторе Clew. В этих инструкциях установка разобрана вместе с конкретным примером.

Яндекс Тег МенеджерКак добавить поп-ап на сайт через Яндекс Тег Менеджер без программиста

Если что-то не работает

Чем Яндекс Тег Менеджер отличается от Google Tag Manager?

Оба умеют добавлять на сайт произвольный код. Яндекс Тег Менеджер работает через уже установленный тег Метрики и настраивается в её интерфейсе; для Google Tag Manager на сайте должен стоять код его контейнера. Если на сайте есть GTM, подойдёт инструкция для Google Tag Manager.

В настройках нет пункта «Тег Менеджер»

Включить его может только владелец тега Метрики. Попросите владельца включить опцию и выдать вам доступ к Тег Менеджеру — обычного доступа на редактирование Метрики для пользовательского HTML недостаточно.

В админке всё ещё «Виджет пока не подаёт сигналов»

Откройте страницу сайта в обычном окне браузера и через минуту обновите админку. Если не помогло: проверьте, что изменения опубликованы, а не только сохранены; что вместо заглушки стоит ваш ключ; в инструментах разработчика браузера на вкладке Network найдите widget/…js — ответ должен быть 200. Ответ 404 означает ошибку в ключе.

На сайте настроен Content Security Policy

Нужны две директивы и больше ничего: script-src https://tryclew.ru и connect-src https://tryclew.ru. Виджет не использует eval, blob: и воркеры, а свои стили подключает через CSSOM, а не разметкой, — поэтому style-src 'unsafe-inline' не нужен в Chrome, Edge, Firefox 101+ и Safari 16.4+. Более старые браузеры получают запасной элемент <style>: если они вам важны, а в style-src нет 'unsafe-inline', там подсказки покажутся без оформления. Готовая строка: Content-Security-Policy: script-src 'self' https://tryclew.ru; connect-src 'self' https://tryclew.ru;

Можно ли зафиксировать версию виджета и указать <code>integrity=</code>?

Да. Строка из инструкций — /widget/ВСТАВЬТЕ_КЛЮЧ_САЙТА.js — «скользящая»: она всегда отдаёт текущий виджет, поэтому хэш Subresource Integrity к ней не приложить (байты меняются). Рядом каждая версия отдаётся ещё и по неизменяемому адресу с хэшем содержимого. Запросите https://tryclew.ru/api/v1/widget-version?site=ВАШ_КЛЮЧ — в ответе будут version, path и integrity; подставьте их в тег: <script src="https://tryclew.ru/widget/v/<версия>/ВАШ_КЛЮЧ.js" integrity="sha384-…" crossorigin="anonymous" async></script>. Закреплённый адрес не меняется, поэтому браузер откажется выполнить файл, если отличается хотя бы один байт. Версию вы обновляете тогда, когда сами решите, — тот же запрос можно делать из скрипта деплоя. Больше ничего не меняется: туры по-прежнему публикуются в редакторе Clew без правок сайта.

Не съест ли виджет блокировщик рекламы?

Нет. Нашего домена нет ни в одном из больших списков — EasyList, EasyPrivacy, AdGuard, uBlock Origin, — поэтому туры, подсказки и чеклисты видят и те посетители, у кого блокировщик включён. Тоньше со статистикой: EasyPrivacy блокирует любые сторонние запросы типа ping, поэтому виджет отправляет события обычным запросом — его эти списки пропускают. Чтобы выйти из-под любых пользовательских списков совсем, отдавайте виджет со своего домена: направьте https://ваш-сайт/clew/* на https://tryclew.ru/* в CDN или nginx и замените строку на <script src="/clew/widget/ВАШ_КЛЮЧ.js" async></script>. Виджет сам будет обращаться к API по тому же префиксу — всё станет first-party.

Работает ли в SPA (React, Vue, Next.js)?

Да. Подключите строку один раз — в корневом HTML или корневом шаблоне. Смену страниц без перезагрузки виджет отслеживает сам (History API и изменения hash), поэтому не добавляйте его на каждый маршрут. Повторная загрузка игнорируется, но это лишняя работа для браузера.

А что с баннером согласия на cookie?

Clew хранит собственную cookie и записи в localStorage, чтобы помнить, какие туры посетитель уже прошёл, и считать прохождения. В рекламные системы данные не передаются. Можно ли запускать виджет до согласия, решает ваша политика обработки данных; если баннер блокирует его до согласия, туры просто начнутся после него.

Стоит плагин кеширования или оптимизации

После установки очистите кеш, иначе посетители будут получать старые страницы без строки. Если плагин откладывает, объединяет или минифицирует JavaScript (WP Rocket, LiteSpeed Cache, композитный режим Битрикса), исключите tryclew.ru/widget из этих оптимизаций.

Сайт станет медленнее?

Нет. У строки есть атрибут async: браузер загружает виджет параллельно и не блокирует страницу. Зависимостей у виджета нет.

Может ли приложение само сообщить Clew, что шаг онбординга пройден?

Да, это одна строка. У пункта чеклиста может быть правило, которое отмечает его без клика посетителя: страница, на которую он зашёл, клик по элементу с указанным CSS-селектором или событие из вашего кода — Clew.complete('invited'), где invited — ключ, который вы вписали рядом с пунктом в редакторе. Вызывайте в момент, когда дело действительно сделано, например после ответа вашего API. Вызывать безопасно в любой момент: если чеклиста с таким ключом на странице нет, вернётся false. Старое имя TutorKit по-прежнему работает.

Другие способы установки

Менеджер тегов

Поп-апы, туры и чеклисты через Яндекс Тег Менеджер

Пошагово

Скопируйте код из Clew

Включите Тег Менеджер в настройках Метрики

Создайте новый тег

Выберите «Пользовательский HTML» и вставьте строку

Назначьте триггер «Просмотр страницы»

Проверьте в режиме предварительного просмотра

Опубликуйте изменения

Убедитесь, что всё работает