GTM advanced tracking: scroll, click, visibility, and data layer

Əsas quraşdırmalar bitəndən sonra əlinizdə səhifə baxışları və konversiyalar olur. Bu, faydalıdır — amma natamamdır. Səhifə baxışı sizə istifadəçinin gəldiyini deyir, konversiya isə getdiyini. Aralıqda nə baş verdiyi hələ görünmür.

Halbuki optimallaşdırma məhz o aralıqda olur. Məqaləni sona qədər oxuyurlarmı? Kampaniya bannerinizi ümumiyyətlə görürlərmi? Hansı düymələr işləyir, hansılar toxunulmamış qalır? Saytınızda səssizcə baş verən JavaScript xətaları varmı?

Bu yazıda həmin davranış qatını qururuq və sonda GTM-in ən güclü, amma ən az başa düşülən konsepsiyasına — data layer-ə keçirik.

👉 GA4 və Google Ads quraşdırması

Scroll izləməsi: məzmununuz həqiqətən oxunurmu?

Ən çox dəyər verən və ən asan qurulan izləmədir. Xüsusilə bloq, xəbər və uzun landing səhifələri üçün.

Qurulma addımları

1. Variables → Configure → `Scroll Depth Threshold`, `Scroll Depth Units` və `Scroll Direction` dəyişənlərini aktivləşdirin.
2. Triggers → New → Scroll Depth. Şaquli scroll seçin və faiz həddlərini yazın: `25, 50, 75, 90`.
3. Triggeri daraldın. Bütün saytda deyil, yalnız məzmun səhifələrində lazımdırsa: `Page Path contains /blog`.
4. Tags → New → GA4 Event. Ölçmə ID üçün `constant` dəyişəninizi seçin, hadisə adı `scroll_depth`.
5. Parametr əlavə edin: ad `percent`, dəyər — `Scroll Depth Threshold` dəyişəni.
6. Preview ilə test edin: səhifəni aşağı sürüşdürdükcə tag 25, 50, 75 və 90 faizdə ardıcıl işə düşməlidir.

Vacib təkmilləşdirmə: vaxt şərti əlavə edin

Yalnız scroll faizinə baxmaq yanıldıcı ola bilər. İstifadəçi səhifəni üç saniyəyə sona qədər sürüşdürübsə, o, məzmunu oxumayıb — sadəcə səhifəni gözdən keçirib və çıxıb. Bu, «oxundu» kimi qeydə düşməməlidir.

Həlli sadədir: triggerə əlavə şərt qoyun ki, tag yalnız istifadəçi səhifədə minimum müəyyən vaxt keçirəndən sonra işə düşsün — məsələn 10 saniyə. Beləliklə həm nə qədər aşağı endiklərini, həm də orada nə qədər qaldıqlarını birlikdə ölçürsünüz.

Nəticə fərqi əhəmiyyətlidir: «məqalələrimin 60%-i sona qədər scroll olunur» ilə «məqalələrimin 22%-i həqiqətən oxunur» arasında tamamilə fərqli məzmun strategiyaları dayanır.

Timer triggerləri: saytda keçirilən vaxt

Timer triggeri müəyyən müddət keçdikdən sonra işə düşür. İki tipik istifadə halı var.

Hal 1 — GA4-ə vaxt hadisəsi göndərmək

Trigger yaradın: tip Timer, interval `20000` (20 saniyə), limit `1`. Şərt olaraq bütün sayt üçün `Page URL matches RegEx .*` yazın.

Sonra GA4 Event tagı qurun, hadisə adı `time_on_site`. Parametr üçün keçən vaxtı ölçən bir dəyişən lazımdır — GTM-in standart siyahısında belə dəyişən yoxdur, ona görə Templates qalereyasında «elapsed time» axtarıb hazır şablonu əlavə edin.

Hal 2 — vaxta bağlı remarketinq auditoriyası

Bu daha maraqlı ssenaridir. Saytda 30 saniyədən çox qalan istifadəçilər — yəni həqiqətən maraqlananlar — üçün ayrıca remarketinq auditoriyası qura bilərsiniz.

Trigger: Timer, `30000` millisaniyə, limit `1`. Tag: Meta üçün Custom HTML ilə xüsusi hadisə göndərilir. Meta Events Manager-də standart hadisə kodunu götürüb sadələşdirir və hadisəyə aydın ad verirsiniz — məsələn «30 saniyədən çox qaldı».

Nəticədə Meta-da bu hadisəyə əsaslanan auditoriya yaradıb yalnız real maraq göstərənləri hədəfləyirsiniz. Bütün ziyarətçiləri hədəfləməkdənsə bu, xeyli səmərəlidir.

Klik izləməsi: genişdən dara

Kliklərin izlənməsində əsas prinsip belədir: əvvəlcə geniş, sonra dar.

Bütün kliklər

Trigger: Click — All Elements, şərtsiz. Tag: GA4 Event, hadisə adı `all_clicks`. Bu, saytdakı hər klikləməni göndərir.

Bunu daimi olaraq saxlamayın — bir-iki gün açıb datanı toplayın, hansı elementlərin həqiqətən kliklənildiyini görün, sonra söndürün. Daimi işlədilsə, GA4 hesabınızı mənasız hadisələrlə doldurar.

Yalnız düymələr

İndi daraldırıq. Saytda düyməyə sağ klikləyib «Inspect» seçin və elementin CSS sinfinə baxın — məsələn `btn-primary` və ya sadəcə `button`.

Trigger: Click — All Elements, şərt `Click Classes contains btn-primary`. Tag: GA4 Event, hadisə adı `button_click`, parametr olaraq `Click Text` göndərin — beləliklə hansı düymənin kliklənildiyi də görünəcək.

Preview-də test edəndə fərqi aydın görürsünüz: düyməyə klikləyəndə `button_click` işə düşür, səhifənin boş yerinə klikləyəndə isə yalnız ümumi klik hadisəsi qeydə alınır.

Xarici linklər

İstifadəçilərin saytınızı hansı linklərlə tərk etdiyini bilmək faydalıdır — xüsusilə partnyor linkləri və ya sosial media profillərinə keçidlər üçün.

Bunun üçün Auto-Event Variable tipli dəyişən yaradırsınız və kliklənən linkin hostname-ini oxuyursunuz. Trigger: Click — Just Links, şərt: həmin dəyişən sizin domeninizi ehtiva etmir. Yəni link başqa sayta aparırsa, tag işə düşür.

Element görünürlüyü: banner həqiqətən görülürmü?

Bu izləmə tipi az istifadə olunur, amma çox dəyərlidir. Səhifədə vacib bir bölmə var — əlaqə forması, kampaniya banneri, qiymət cədvəli — və siz istifadəçilərin ora çatıb-çatmadığını bilmək istəyirsiniz.

Scroll izləməsi bunu tam cavablandırmır, çünki səhifə uzunluğu dəyişəndə faizlər də sürüşür. Element Visibility triggeri isə konkret elementi izləyir.

Qurulma

1. Variables → Configure → `Percent Visible` və `On-Screen Duration` dəyişənlərini aktivləşdirin.
2. Saytda hədəf bölməyə sağ klikləyib «Inspect» seçin və elementin `id` atributunu tapın.
3. Triggers → New → Element Visibility. Seçim metodu: ID. Həmin ID-ni yazın.
4. «Fire this trigger» seçimini Once per page qoyun.
5. Advanced Settings-də minimum görünmə müddətini təyin edin — məsələn `10000` millisaniyə. Beləliklə tag yalnız element ekranda 10 saniyə qalanda işə düşür, sadəcə sürətlə keçəndə yox.
6. GA4 Event tagı qurun, hadisə adı `section_view`, parametrlər olaraq `Percent Visible` və `On-Screen Duration` göndərin.

Nəticədə iki sual cavab tapır: bölmə ümumiyyətlə görülürmü, və görülürsə nə qədər müddət diqqətdə qalır. Əlaqə formanız səhifənin sonundadırsa və ziyarətçilərin yalnız 8%-i onu görürsə, problem formanın özündə deyil — yerləşdiyi yerdədir.

JavaScript xətalarını tutmaq

Bu, marketinq izləməsi deyil, amma marketinq nəticələrinə birbaşa təsir edir. Saytda JavaScript xətası varsa, forma göndərilmir, düymə işləmir, səbət açılmır — və heç kim bundan xəbər tutmur, çünki istifadəçi sadəcə çıxıb gedir.

GTM bunu ölçə bilər:

1. Variables → Configure → `Error Message`, `Error URL` və `Error Line` dəyişənlərini aktivləşdirin.
2. Triggers → New → JavaScript Error, bütün xətalar üçün.
3. GA4 Event tagı: hadisə adı `js_error`. Üç parametr əlavə edin — `error_message`, `error_url`, `error_line` — və hər birinə müvafiq dəyişəni təyin edin.

Bu tagı Preview rejimində test etmək çətindir, çünki süni xəta yaratmaq lazımdır. Amma dərc etdikdən sonra GA4 → Realtime → Events bölməsində `js_error` hadisəsinin gəlib-gəlmədiyini izləyə bilərsiniz.

Toplanmış xəta mesajlarını developer komandası ilə paylaşın: hansı səhifədə, hansı kod sətrində problem var — hamısı hazır şəkildə əlinizdə olur.

Video baxışlarının izlənməsi

Saytınızda YouTube videoları varsa, GTM onları hazır şəkildə izləyə bilir — əlavə kod lazım deyil.

1. Variables → Configure → `Video Title`, `Video Percent`, `Video Provider` və `Video Status` dəyişənlərini aktivləşdirin.
2. Triggers → New → YouTube Video. Hansı mərhələləri ölçmək istədiyinizi seçin: başlama, bitmə, dayandırma və faiz həddləri (10, 25, 50, 75, 100).
3. «Add JavaScript API support to all videos» seçimini aktivləşdirin — bu, plagin olmadan da izləmənin işləməsini təmin edir.
4. GA4 Event tagı qurun, hadisə adı `video_progress`, parametrlər olaraq video başlığını və faizi göndərin.

Nəticədə hansı videoların axıra qədər izləndiyini, hansılarının isə ilk on saniyədə bağlandığını görürsünüz. Məhsul videolarında bu, birbaşa məzmun qərarına çevrilir.

Data Layer: GTM-in əsl gücü

İndi ən vacib konsepsiyaya çatdıq. Yuxarıdakı bütün izləmələr GTM-in səhifədən özü oxuya bildiyi məlumatlara əsaslanır: klik, scroll, URL, element. Amma bəzi məlumatları səhifədən belə oxumaq mümkün deyil və ya etibarsızdır.

Problem

Təsəvvür edin ki, e-ticarət saytınız var. Məhsul səhifəsində məhsulun adı, qiyməti, rəngi, ölçüsü və kateqoriyası göstərilir. GTM bu məlumatları səhifənin HTML strukturundan oxuya bilər — məsələn «qiymət `.price` sinfindəki elementdədir» deyə.

Amma dizayner səhifəni yeniləyir və qiymət blokunu başqa yerə köçürür, sinif adını dəyişir. GTM həmin an məlumatı tapa bilmir və izləməniz səssizcə sınır. Heç bir xəta mesajı yoxdur — sadəcə data axmağı dayandırır.

Həll

Data layer — saytın arxasında dayanan JavaScript obyektidir. O, səhifənin görünüşündən asılı olmayaraq, bütün vacib məlumatları struktur şəklində saxlayır.

Front-end dizaynı istədiyiniz qədər dəyişin — data layer olduğu kimi qalır. GTM (və Adobe kimi digər tag menecerlər) məlumatı səhifənin görünüşündən yox, birbaşa data layer-dən oxuyur.

Struktur

Data layer sayt kodunda belə elan olunur:

<script> window.dataLayer = window.dataLayer || []; dataLayer.push({ 'event': 'view_item', 'product_name': 'Klassik köynək', 'product_price': 49.90, 'product_color': 'ağ', 'product_size': 'M', 'product_category': 'kişi geyimi' }); </script>

Diqqət: `dataLayer` yazılışı hərf həssasdır. `datalayer` və ya `DataLayer` işləmir — birinci hissə kiçik, ikinci hissənin ilk hərfi böyük olmalıdır.

Data layer-i saytda necə görmək olar?

Bunun üçün kod bilmək lazım deyil:

1. Saytda sağ klikləyib «Inspect» seçin.
2. Console tabına keçin.
3. `dataLayer` yazıb Enter basın.
4. Massiv görünəcək: 0, 1, 2 nömrəli obyektlər. Hər birinə klikləyib içindəki məlumatları görə bilərsiniz.

Əgər burada boş massiv və ya xəta görürsünüzsə, deməli saytınızda data layer qurulmayıb və bu, developerlə birlikdə həll ediləcək məsələdir.

Data layer dəyişənləri necə yaradılır?

Data layer-də olan məlumatı GTM-də istifadə etmək üçün hər dəyər üçün ayrıca dəyişən yaradılır.

1. Konsolda data layer-ə baxın və lazım olan sahənin dəqiq adını kopyalayın (məsələn `product_price`).
2. GTM → Variables → User-Defined → New → tip Data Layer Variable.
3. «Data Layer Variable Name» sahəsinə həmin adı hərfbəhərf yazın. Bir hərf səhvi dəyişəni boş qaytarır.
4. Adını `dl — product price` şəklində qoyub yadda saxlayın.

İç-içə strukturlarda nöqtə işarəsindən istifadə olunur: `ecommerce.items.0.price`.

Yaratdıqdan sonra Preview rejimində yoxlayın: Variables tabında dəyişənin real dəyər qaytardığını görməlisiniz. Boşdursa, ya ad səhvdir, ya da həmin dəyər yalnız müəyyən hadisələrdə mövcuddur.

Custom Event triggeri ilə birlikdə

Data layer-in ən güclü tərəfi budur: sayt kodu istədiyi anda GTM-ə hadisə göndərə bilir. Yuxarıdakı nümunədə `'event': 'view_item'` sətri məhz bunu edir.

GTM-də bunu tutmaq üçün: Triggers → New → Custom Event, hadisə adı `view_item`. Bu trigger yalnız sayt kodu həmin hadisəni göndərəndə işə düşəcək.

Bu yanaşma klik və ya URL əsaslı triggerlərdən xeyli etibarlıdır, çünki sayt dizaynı dəyişəndə sınmır. E-ticarət izləməsinin (məhsula baxış, səbətə əlavə, alış) peşəkar qurulması məhz bu üsulla aparılır.

Custom HTML tagı: qalan hər şey üçün

GTM-in siyahısında olmayan istənilən kodu Custom HTML tagı ilə yerləşdirmək olar: TikTok piksel, LinkedIn Insight Tag, çat widget-i, istilik xəritəsi alətləri, A/B test skriptləri.

Tags → New → Custom HTML, kodu yapışdırın, trigger seçin. Vəssalam.

Bir neçə vacib qeyd:

• Custom HTML tagına həmişə təsvir yazın — nə etdiyi, hansı platformaya aid olduğu. Altı ay sonra bu qeyd sizi xilas edəcək.
• Üçüncü tərəfdən gələn kodu diqqətlə oxuyun. Custom HTML tagı saytınızda istənilən JavaScript-i icra edə bilir — bu, həm güc, həm də risk deməkdir.
• Ağır skriptləri Page View yerinə Window Loaded triggerinə bağlayın ki, səhifənin əsas məzmununun yüklənməsini gecikdirməsinlər.

Results

Bu beş yazılıq seriyada GTM-i sıfırdan qurduq: anlayışdan interfeysə, izləmə məntiqindən əsas platformalara, oradan da davranış izləməsi və data layer-ə.

Yekun mənzərə belədir. Səhifə baxışları və konversiyalar sizə nəticəni göstərir. Scroll, klik və görünürlük izləməsi Cause göstərir. Data layer isə bu izləmənin sayt dəyişikliklərindən sonra da işləməyə davam etməsini təmin edir.

Bir tövsiyə ilə bitirim: hamısını birdən qurmağa çalışmayın. Əsas quraşdırmadan başlayın, bir-iki həftə datanı izləyin, sonra hansı sualların cavabsız qaldığını görüb növbəti izləməni əlavə edin. Strategiyasız yığılmış qırx tag, düşünülmüş beş tagdan həmişə pisdir.

Frequently asked questions

Data layer üçün mütləq developer lazımdırmı?

Standart data layer üçün bəli — sayt koduna əlavə edilməlidir. Amma yaxşı xəbər budur ki, əksər hazır platformalarda bu, artıq mövcuddur: Shopify, WooCommerce və bir çox CMS öz data layer-ini avtomatik qurur. Əvvəlcə konsolda yoxlayın — bəlkə də hər şey hazırdır.

Scroll izləməsi üçün neçə faiz həddi qoymalıyam?

25/50/75/90 optimal dəstdir. Daha çox hədd əlavə etmək dəyər gətirmir, amma GA4-də hadisə sayınızı əhəmiyyətli dərəcədə artırır. Qısa səhifələr üçün isə 50/90 kifayət edə bilər.

Element Visibility triggerində ID tapa bilmirəm, nə etməli?

Element Visibility triggeri üç seçim metodu təklif edir: ID, CSS selektor və JavaScript dəyişəni. Elementin `id` atributu yoxdursa, CSS selektor variantını seçin və sinif adından istifadə edin (məsələn `.contact-section`). Ən dayanıqlı yol isə developerdən həmin elementə sabit bir ID əlavə etməsini xahiş etməkdir.

Custom HTML tagı saytı yavaşladırmı?

Tagın özü yox, içindəki kod yavaşlada bilər. Xüsusilə çat widget-ləri və istilik xəritəsi alətləri ağır olur. Belə tagları Window Loaded triggerinə bağlayın və PageSpeed Insights ilə əvvəl-sonra müqayisə edin.

Bir səhifədə neçə data layer push ola bilər?

Məhdudiyyət yoxdur. Adətən səhifə yüklənəndə bir ilkin push olur, sonra istifadəçi hərəkət etdikcə əlavə push-lar gəlir — məhsula baxış, səbətə əlavə, ödəniş addımları. Hər push GTM-də ayrıca Custom Event triggeri ilə tutula bilər.