Ana Sayfa / Seviye 2 / Preview ve Debug Mode

Preview ve Debug Mode

📚 Seviye 2 — Uygulama ⏱ ~10 dakika

1. Tag Assistant Nedir ve Nasıl Kullanılır?

Tag Assistant, GTM'nin Preview Mode'unu çalıştıran ve tag'lerinizi gerçek zamanlı olarak test etmenizi sağlayan araçtır. 2020 sonrası Google, Tag Assistant'ı ayrı bir web uygulaması (tagassistant.google.com) olarak sunmaktadır.

a) Preview Mode'u Başlatma

  1. GTM panelinde sağ üst köşedeki Önizleme (Preview) butonuna tıklayın.
  2. Tag Assistant yeni bir sekmede açılır ve sizden web sitenizin URL'sini girmenizi ister.
  3. URL'yi girdikten sonra "Connect" butonuna tıklayın.
  4. Web siteniz yeni bir sekmede açılır; sağ alt köşede "Tag Assistant Connected" mesajını görmelisiniz.
  5. Artık Tag Assistant sekmesine dönerek tag'lerinizi inceleyebilirsiniz.
🎯 Benzetme: Tag Assistant'ı bir röntgen cihazı gibi düşünün. Normal bir ziyaretçi sitenizi gördüğünde yalnızca dış görünümü görür. Ama siz Tag Assistant ile baktığınızda, arka planda hangi tag'lerin çalıştığını, hangi verilerin gönderildiğini — yani sitenin "iç organlarını" — görebilirsiniz.
💡 İpucu: Preview Mode yalnızca sizin tarayıcınızda çalışır. Sitenizin gerçek ziyaretçileri bu debug oturumundan etkilenmez. Rahat rahat test edebilirsiniz!

2. Debug Console: Tags Fired vs Not Fired

Tag Assistant'ın en önemli bölümü debug console'dur. Burada her sayfa etkileşimi için hangi tag'lerin tetiklendiğini ve hangilerinin tetiklenmediğini görebilirsiniz.

flowchart TD A["🌐 Web Siteniz\n(Preview Mode aktif)"] --> B["📋 Tag Assistant\nDebug Console"] B --> C["Tags Fired ✅\nTetiklenen tag'ler"] B --> D["Tags Not Fired ❌\nTetiklenmeyen tag'ler"] C --> E["Tag detayı:\n• Tetikleyici bilgisi\n• Gönderilen veriler\n• Çalışma zamanı"] D --> F["Neden tetiklenmedi?\n• Tetikleyici koşulu\nsağlanmadı\n• Değişken değeri\nuyuşmadı"] style C fill:#DCFCE7,stroke:#22C55E style D fill:#FEE2E2,stroke:#EF4444 style E fill:#F5F7FA,stroke:#94A3B8 style F fill:#F5F7FA,stroke:#94A3B8

a) Tags Fired (Tetiklenen Tag'ler)

Bu bölümde başarıyla çalışan tag'leri görürsünüz. Her tag'e tıkladığınızda şu detayları inceleyebilirsiniz:

b) Tags Not Fired (Tetiklenmeyen Tag'ler)

Bu bölüm en az "Fired" kadar önemlidir. Burada tetiklenmesini beklediğiniz ama tetiklenmeyen tag'leri görürsünüz. Her tag'e tıklayarak tetikleyici koşullarından hangisinin sağlanmadığını inceleyebilirsiniz.

3. Trigger ve Variable Değerlerini İnceleme

Debug console'un sol tarafında bir olay akışı (event timeline) bulunur. Her bir olay (Page View, Click, Form Submit vb.) sırayla listelenir.

a) Olay Akışı (Event Timeline)

Sol paneldeki olaylardan birine tıkladığınızda, o anda tüm değişkenlerin aldığı değerleri görebilirsiniz. Örneğin bir "Click" olayına tıkladığınızda:

b) Variables Sekmesi

Her olay için "Variables" sekmesine tıklayarak o anda tüm değişkenlerin değerlerini görebilirsiniz. Bu, özellikle koşullu tetikleyicilerinizin neden çalışıp çalışmadığını anlamak için çok faydalıdır.

💡 İpucu: Bir tag tetiklenmiyorsa, ilk yapmanız gereken tetikleyicinin koşullarını kontrol etmektir. Variables sekmesindeki gerçek değerleri, tetikleyicideki beklenen değerlerle karşılaştırın. Genellikle sorun, bir değişken değerinin beklediğinizden farklı olmasıdır.

4. Sık Karşılaşılan Debug Senaryoları

Preview Mode'da karşılaşabileceğiniz en yaygın sorunlar ve çözümleri:

a) "Connected" Mesajı Görünmüyor

b) Tag "Not Fired" Listesinde Kalıyor

c) Tag Tetikleniyor Ama Veri GA4'te Görünmüyor

flowchart TD A["🔍 Sorun:\nTag tetiklenmiyor"] --> B{"GTM Connected\ngörünüyor mu?"} B -->|"Hayır"| C["Snippet kontrolü:\n• Container ID doğru mu?\n• Kod doğru yerde mi?"] B -->|"Evet"| D{"Tag 'Not Fired'\nlistesinde mi?"} D -->|"Evet"| E["Trigger kontrolü:\n• Koşullar doğru mu?\n• Değişken değerleri\nbeklediğiniz gibi mi?"] D -->|"Tag Fired ama\nveri yok"| F["Platform kontrolü:\n• Measurement ID doğru mu?\n• GA4 DebugView'ı\nkontrol edin"] style A fill:#FEE2E2,stroke:#EF4444 style C fill:#FEF3C7,stroke:#F59E0B style E fill:#FEF3C7,stroke:#F59E0B style F fill:#FEF3C7,stroke:#F59E0B

5. İleri Seviye Troubleshooting İpuçları

a) Data Layer'ı İnceleyin

Tarayıcınızın Console sekmesinde dataLayer yazarak mevcut Data Layer içeriğini görebilirsiniz. Custom Event tetikleyicilerinin doğru çalışması için olayların Data Layer'a düzgün gönderildiğini doğrulamanız gerekir.

b) Tarayıcı Cache'ini Temizleyin

Eski GTM sürümleri tarayıcı cache'inde kalabilir. Preview Mode'da sorun yaşıyorsanız, tarayıcının cache'ini temizleyin veya gizli pencere (incognito) kullanın.

c) Birden Fazla Container Çakışması

Bazı web sitelerinde yanlışlıkla birden fazla GTM container'ı eklenmiş olabilir. Bu durum tag'lerin çift tetiklenmesine veya hiç tetiklenmemesine yol açabilir. Sayfa kaynağında yalnızca bir GTM container kodu olduğundan emin olun.

⚠️ Dikkat: Preview Mode'da her şey doğru çalışıyor görünse bile, yayınladıktan sonra GA4 Realtime raporlarını kontrol etmeyi unutmayın. Bazen Preview'da çalışan bir tag, canlıda farklı davranabilir (özellikle sayfa hızı, reklam engelleyiciler veya consent yönetimi nedeniyle).

📝 Quiz — Bilgini Test Et

← Önceki Ders Sonraki Ders →