Google Tag Manager арқылы поп-ап, тур және чек-парақ

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

Сайтта Google Tag Manager бар болса, маркетолог поп-апты, өнім турын немесе онбординг чек-парағын бірде-бір релизсіз қосады: Clew бір рет тег ретінде қойылады, қалғаны Clew редакторында жасалады.

Уақыты: ● 10 минут
Кім орындайды: GTM контейнерінде жариялау құқығы бар қызметкер
Қадам саны: 8

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

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

<script src="https://tryclew.io/widget/САЙТ_КІЛТІН_ҚОЙЫҢЫЗ.js" async></script>
```
Қадам 1 · интерфейс сызбасы
Қадам 02
Контейнерді ашып, тег жасаңыз
tagmanager.google.com сайтына кіріп, сайтта орнатылған контейнерді ашыңыз да, Теги → Создать батырмасын басыңыз (ағылшын интерфейсінде: Tags → New). Контейнер атауын тексеріңіз: көп командада тесттік және жұмыс сайтына бөлек контейнерлер бар.
Қадам 2 · интерфейс сызбасы
Қадам 03
«Пользовательский HTML» түрін таңдаңыз
Жоғарыда тегке ат беріңіз, мысалы Clew widget. Конфигурация тега батырмасын басып, Пользовательский HTML (Custom HTML) түрін таңдаңыз.
Қадам 3 · интерфейс сызбасы
Қадам 04
Жолды қойыңыз
1-қадамдағы жолды HTML өрісіне қойыңыз. Поддержка document.write жалаушасын өшірулі қалдырыңыз — Clew-ге ол керек емес.
Қадам 4 · интерфейс сызбасы
Қадам 05
Барлық бетте іске қосыңыз
Триггеры батырмасын басып, кірістірілген All Pages триггерін («Просмотр страницы» түрі) таңдаңыз да, Сохранить батырмасын басыңыз. Тег барлық жерде жүктелуі керек: турды қай бетте және кімге көрсетуді Clew өзі шешеді.
Қадам 5 · интерфейс сызбасы
Қадам 06
Алдын ала қарауда тексеріңіз
Предварительный просмотр батырмасын басып, сайт мекенжайын енгізіп, қосылыңыз. Tag Assistant-та Clew widget тегі іске қосылғандар тізімінде (Tags Fired) болуы керек. Ол іске қосылмағандар арасында болса, триггерді тексеріңіз.
Қадам 6 · интерфейс сызбасы
Қадам 07
Жіберіп, жариялаңыз
Жұмыс аймағында Отправить батырмасын басып, нұсқаға ат беріңіз, мысалы «Clew виджеті қосылды», және Опубликовать батырмасын басыңыз. Жарияламайынша сайтта ештеңе өзгермейді.
Қадам 7 · интерфейс сызбасы
Қадам 08
Бәрі жұмыс істейтініне көз жеткізіңіз
Сайттың кез келген бетін браузердің қарапайым терезесінде ашып, Clew-дегі Шолу бөліміне оралыңыз. Бір минут ішінде карточка жасылға айналады: «Виджет жұмыс істеп тұр.»
Қадам 8 · интерфейс сызбасы

GTM туралы нені білу маңызды

Келісім режимі

Контейнерде келісім режимі (Consent Mode) бапталса, тегтің Расширенные настройки бөлімін ашып, келісім тексерулерін деректерді өңдеу саясатыңыз талап ететіндей етіп орнатыңыз.

Бір контейнерде бірнеше сайт

Clew-дегі әр сайттың өз кілті бар. Бір контейнер бірнеше доменге қызмет етсе, әр сайтқа бір тег жасап, All Pages орнына Page Hostname шарты бар бетті қарау триггерін қолданыңыз.

Сайтта GTM әлі жоқ

GTM-нің өзін орнату — оның кодын барлық бетке қою, яғни Clew-ді тікелей орнатумен бірдей жұмыс. Конструкторлар мен CMS нұсқаулығын, ал сайтта Метрика болса, Яндекс Тег Менеджерді қолданыңыз.

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

Пайдаланушы HTML ме, әлде галереядағы шаблон ба?

Пайдаланушы HTML. Ол Clew-дің ресми жолын сол күйінде орындайды және кейін оны жаңартудың қажеті болмайды.

GTM арқылы Clew тікелей орнатқандағыдай жұмыс істей ме?

Иә. Виджет контейнердің өзінен сәл кейін жүктеледі, одан әрі таргетинг, аналитика және визуалды редактор еш айырмашылықсыз жұмыс істейді.

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

Сайттың бір бетін браузердің қарапайым терезесінде ашып, бір минуттан кейін админканы жаңартыңыз. Көмектеспесе: өзгерістер жай сақталып қана қоймай, жарияланғанын; белгінің орнына өз кілтіңізді қойғаныңызды тексеріңіз; браузердің әзірлеуші құралдарындағы 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 атауы әлі де жұмыс істейді.

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

Метрика

Google Tag Manager арқылы поп-ап, тур және чек-парақ

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

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

Контейнерді ашып, тег жасаңыз

«Пользовательский HTML» түрін таңдаңыз

Жолды қойыңыз

Барлық бетте іске қосыңыз

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

Жіберіп, жариялаңыз

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