dataLayer İleri

1. dataLayer Nedir?

dataLayer, GTM'nin web sayfasından veri almasını sağlayan bir JavaScript nesne dizisidir (array of objects). Sayfa ile GTM arasındaki yapılandırılmış iletişim katmanıdır.

a) Teknik Yapı

dataLayer aslında basit bir JavaScript array'idir:

window.dataLayer = window.dataLayer || [];
dataLayer.push({
  'event': 'page_view',
  'page_type': 'product',
  'user_status': 'logged_in'
});

b) dataLayer.push() Mekanizması

Her dataLayer.push() çağrısı GTM'ye bir mesaj gönderir. Eğer push içinde 'event' anahtarı varsa, GTM bu event'i bir trigger olarak değerlendirir.

2. Data Layer Variable (Veri Katmanı Değişkeni)

GTM'de dataLayer'dan veri okumak için "Data Layer Variable" türünde değişken oluşturulur.

a) Basit Değişken

dataLayer'daki bir anahtarın değerini okur:

• Variable Name: page_type
• Okuyacağı değer: dataLayer.push({'page_type': 'product'}) → "product"

b) İç İçe (Nested) Değişken

Nokta notasyonu ile derinlerdeki değerleri okur:

• Variable Name: ecommerce.items.0.item_name
• Bu, ecommerce nesnesinin içindeki items dizisinin ilk elemanının item_name'ini okur.

3. Zamanlama: GTM Snippet Öncesi vs Sonrası

dataLayer push'larının GTM snippet'ine göre zamanlaması kritik öneme sahiptir.

a) GTM Snippet Öncesi (Önerilen)

<!-- Sayfa yüklenirken mevcut olan veriler -->
<script>
  window.dataLayer = window.dataLayer || [];
  dataLayer.push({
    'page_type': 'product',
    'product_id': '12345',
    'product_price': 299.90
  });
</script>

<!-- GTM Snippet -->
<script>(function(w,d,s,l,i){...})(window,document,'script','dataLayer','GTM-XXXXX');</script>

GTM yüklendiğinde veriler zaten hazırdır. Page View trigger'ı ile birlikte kullanılabilir.

b) GTM Snippet Sonrası (Dinamik Event'ler)

<!-- Kullanıcı etkileşimi sonrası -->
<script>
  document.getElementById('add-to-cart').addEventListener('click', function() {
    dataLayer.push({
      'event': 'add_to_cart',
      'ecommerce': {
        'items': [{
          'item_id': 'SKU-12345',
          'item_name': 'Nike Air Max 90',
          'price': 1299.00,
          'quantity': 1
        }]
      }
    });
  });
</script>

4. E-ticaret dataLayer Uygulaması

GA4 e-ticaret takibi için belirli event'lerin standart formatta dataLayer'a push'lanması gerekir.

a) view_item Örneği

dataLayer.push({ ecommerce: null }); // Önceki ecommerce verisini temizle
dataLayer.push({
  'event': 'view_item',
  'ecommerce': {
    'currency': 'TRY',
    'value': 1299.00,
    'items': [{
      'item_id': 'SKU-12345',
      'item_name': 'Nike Air Max 90',
      'item_brand': 'Nike',
      'item_category': 'Ayakkabi',
      'item_category2': 'Spor',
      'price': 1299.00,
      'quantity': 1
    }]
  }
});

b) add_to_cart Örneği

dataLayer.push({ ecommerce: null });
dataLayer.push({
  'event': 'add_to_cart',
  'ecommerce': {
    'currency': 'TRY',
    'value': 1299.00,
    'items': [{
      'item_id': 'SKU-12345',
      'item_name': 'Nike Air Max 90',
      'price': 1299.00,
      'quantity': 1
    }]
  }
});

c) purchase Örneği

dataLayer.push({ ecommerce: null });
dataLayer.push({
  'event': 'purchase',
  'ecommerce': {
    'transaction_id': 'T-98765',
    'value': 2598.00,
    'tax': 467.64,
    'shipping': 29.90,
    'currency': 'TRY',
    'items': [{
      'item_id': 'SKU-12345',
      'item_name': 'Nike Air Max 90',
      'price': 1299.00,
      'quantity': 2,
      'item_brand': 'Nike',
      'item_category': 'Ayakkabi'
    }]
  }
});