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

Авторы: Андрей Давыдов · жаңартылды 2026 ж. 29 қыркүйек

Сайтта Метрика тұрса, поп-апты, жеке кабинет бойынша турды немесе чек-парақты кодқа тиіспей, әзірлеушісіз тікелей оның интерфейсінен қосуға болады. Clew бір рет тег ретінде қойылады, қалғаны Clew редакторында жасалады.

Уақыты: ● 10 минут
Кім орындайды: Метрика тегінің иесі немесе Тег Менеджерге қолжетімділігі бар қызметкер
Қадам саны: 8

Қадам-қадаммен

Қадам 01
Clew-ден кодты көшіріңіз
Clew-ге тіркеліңіз немесе кіріңіз де, Admin → Шолу бөлімін ашыңыз. Виджет орнатылмайынша онда «Виджеттен әлі сигнал келген жоқ.» карточкасы сіздің жолыңызбен тұрады — көшіру үшін басыңыз. Ол төмендегі кодқа ұқсайды, тек нақты сайт кілтімен.
```

<script src="https://tryclew.io/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 ішіндегі ауысуларды жеке қаралым ретінде санаса, триггер әр ауысуда іске қосылуы мүмкін. Бұл қауіпсіз: виджет қайта жүктеуді елемейді.

Бірдеңе жұмыс істемесе

Яндекс Тег Менеджердің Google Tag Manager-ден айырмашылығы қандай?

Екеуі де сайтқа еркін код қоса алады. Яндекс Тег Менеджер орнатылған Метрика тегі арқылы жұмыс істейді және оның интерфейсінде бапталады; Google Tag Manager үшін сайтта оның контейнер коды тұруы керек. Сайтта GTM болса, Google Tag Manager нұсқаулығы сәйкес келеді.

Баптауларда «Тег Менеджер» тармағы жоқ

Оны тек Метрика тегінің иесі қоса алады. Иесінен опцияны қосып, сізге Тег Менеджерге қолжетімділік беруін сұраңыз — пайдаланушы HTML үшін Метриканы өңдеудің қарапайым құқығы жеткіліксіз.

Админкада әлі «Виджеттен әлі сигнал келген жоқ» деп тұр

Сайттың бір бетін браузердің қарапайым терезесінде ашып, бір минуттан кейін админканы жаңартыңыз. Көмектеспесе: өзгерістер жай сақталып қана қоймай, жарияланғанын; белгінің орнына өз кілтіңізді қойғаныңызды тексеріңіз; браузердің әзірлеуші құралдарындағы Network қойындысынан widget/…js сұрауын тауып, жауабы 200 екенін қараңыз. 404 жауабы кілттің қате екенін білдіреді.

Сайтта Content Security Policy бапталған

Екі директива, одан басқа ештеңе қажет емес: script-src https://tryclew.io және connect-src https://tryclew.io. Виджет eval, blob: және воркерлерді пайдаланбайды, ал стильдерін таңбалау арқылы емес, CSSOM арқылы қосады — сондықтан Chrome, Edge, Firefox 101+ және Safari 16.4+ браузерлерінде style-src 'unsafe-inline' керек емес. Ескілеу браузерлер қосалқы <style> элементін алады: егер олар сізге маңызды болса және style-src ішінде 'unsafe-inline' болмаса, онда турлар безендірусіз көрінеді. Дайын жол: Content-Security-Policy: script-src 'self' https://tryclew.io; connect-src 'self' https://tryclew.io;

Виджет нұсқасын бекітіп, <code>integrity=</code> қосуға бола ма?

Болады. Нұсқаулықтардағы жол — /widget/САЙТ_КІЛТІН_ҚОЙЫҢЫЗ.js — «жылжымалы»: ол әрқашан ағымдағы виджетті береді, сондықтан оған Subresource Integrity хэшін қосу мүмкін емес (байттар өзгереді). Оның қатарында әр нұсқа мазмұн хэші бар өзгермейтін мекенжай бойынша да беріледі. https://tryclew.io/api/v1/widget-version?site=СІЗДІҢ_КІЛТІҢІЗ сұрауын жіберіңіз — жауапта version, path және integrity болады; екеуін тегке қойыңыз: <script src="https://tryclew.io/widget/v/<нұсқа>/СІЗДІҢ_КІЛТІҢІЗ.js" integrity="sha384-…" crossorigin="anonymous" async></script>. Бекітілген мекенжай өзгермейді, сондықтан бір байт бөлек болса, браузер файлды орындамайды. Нұсқаны қашан жаңартуды өзіңіз шешесіз — сол сұрауды деплой скриптінен жіберуге болады. Қалғаны бұрынғыдай: турлар сайтты түзетпей-ақ Clew редакторында жарияланады.

Жарнама бөгегіші виджетті жасырып қоя ма?

Жоқ. Біздің домен ірі тізімдердің ешқайсысында жоқ — EasyList, EasyPrivacy, AdGuard, uBlock Origin, — сондықтан турлар, қалқымалы кеңестер мен чеклистер бөгегіші қосулы келушілерге де көрінеді. Нәзігірегі — статистика: EasyPrivacy кез келген сыртқы ping сұрауын бөгейді, сол себепті виджет оқиғаларын кәдімгі сұраумен жібереді — оны бұл тізімдер өткізеді. Кез келген жеке тізімнен мүлде тыс қалу үшін виджетті өз доменіңізден таратыңыз: CDN немесе nginx ішінде https://сіздің-сайт/clew/* мекенжайын https://tryclew.io/* дегенге бағыттап, жолды <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.io/widget мекенжайын бұл оңтайландырулардан шығарыңыз.

Сайт баяулап кете ме?

Жоқ. Жолда async атрибуты бар: браузер виджетті параллель жүктейді және бетті бұғаттамайды. Виджеттің тәуелділіктері жоқ.

Қолданбам онбординг қадамының бітгенін Clew-ге өзі айта ала ма?

Иә, бұл бір жол. Чек-парақ тармағында келуші ештеңе баспай-ақ оны белгілейтін ереже болуы мүмкін: ол кірген бет, CSS селектормен көрсеткен элементті басу немесе өз кодыңыз жіберетін оқиға — Clew.complete('invited'), мұндағы invited — редакторда тармақтың қасына жазған кілт. Іс шынымен біткен сәтте шақырыңыз, мысалы API жауап бергеннен кейін. Кез келген уақытта шақыруға қауіпсіз: бетте сондай кілті бар чек-парақ болмаса, false қайтады. Ескі TutorKit атауы әлі де жұмыс істейді.

Орнатудың басқа тәсілдері

Тег менеджері

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

Қадам-қадаммен

Clew-ден кодты көшіріңіз

Метрика баптауларында Тег Менеджерді қосыңыз

Жаңа тег жасаңыз

«Пользовательский HTML» шаблонын таңдап, жолды қойыңыз

«Просмотр страницы» триггерін тағайындаңыз

Алдын ала қарау режимінде тексеріңіз

Өзгерістерді жариялаңыз

Бәрі жұмыс істейтініне көз жеткізіңіз