Google Tag Manager (GTM) İçin En Önemli 5 Değişken

Bir sayfanın kullanıcı tarafından kaç defa yenilendiğini ölçebilirsiniz.

function reloadCount() {
  var state = history.state || {};
  var reloadCount = state.reloadCount || 0;
  if (performance.navigation.type === 1) {
    state.reloadCount = ++reloadCount;
    history.replaceState(state, null, document.URL);
  } else if (reloadCount) {
    delete state.reloadCount;
    reloadCount = 0;
    history.replaceState(state, null, document.URL);
  }

  return reloadCount
}

Tarayıcı sekmesinde gördüğünüz site başlığını title etiketinden alabilirsiniz.

function pageTitle() {
  var title = document.querySelector('title').innerText
  return title
}

Elde ettiğiniz değişkenin içindeki rakamlar haricindeki tüm değerleri kaldırmak ki  regex kullanabilirsiniz.

let text = "Highping34.4--//96)qwerty%)"
let newText = text.replaceAll(/[^\d]/g, '')

// Sonuç: newText = 34496

GA4 başta olmak üzere tüm veri toplama araçları ürün fiyatı, sepet değeri ve ya sipariş toplam tutarını hem tam sayı hem de küsüratlı kabul ediyor.

Fakat küsüratlı değerlerde istenen şart; küsüratın nokta ile ayrılmasıdır.
Yani tarayıcıda gördüğünüz 1,435.56 TRY, 2.567,32 TRY şeklinde tutarları kabul etmez.
Not: Değerlerin tarayıcıda farklı gözükmesi çoğu zaman kullanıcının değeri rahat okuyabilmesi içindir.
GA4'ün kabul ettiği değerlerin 1435.56 TRY ve 2567.32 TRY (para birimi olmadan) şeklinde olması gerekiyor.

Bunun için yapılacak bir kaç işlem var; önce replaceAll metodunu ele alalım.

// On, yüz, bin, yüzbin ve ya milyonluk değerlerin virgül ile ayrıldığı, küsüratın ise nokta ile ayrıldığı değerler.
// Bu tür değerlerde virgülü silersek işimiz tamamlanacak.

let fiyat = '1,567,435.56'
let yeniFiyat = fiyat.replaceAll(',','') // Yeni fiyat 1567435.56

// Tam tersi durumlarda; küsüratın virgülle, diğerlerin nokta ile ayrıldığı değerler.
// Bu tür değerlerde önce noktaları kaldırıp, sonda virgülü noktaya çevirebiliriz.

let fiyat = '1.567.435,56'
let yeniFiyat = fiyat.replaceAll('.','').replace(',','.') // Yeni fiyat 1567435.56

replace ve replaceAll haricinde bir fonksiyon var ki girilen tüm değerlerin küsüratını noktalı yapar.

function totalPrice() {
  var price = '1234.564,67'
  if (price.includes(',') || price.includes('.')) {
    var commaReplacePrice = price.replaceAll(',', '.')
    var token = '.'
    /* Requires STRING not contain TOKEN */
    var parts = commaReplacePrice.split(token);
    if (price.length <= 4) {
      return price
    } else {
      return parts.slice(0, -1).join('') + '.' + parts.slice(-1)
    }
  } else {
    return price
  }
}

JavaScript addEventListener ve ya onclick metodu ile tarayıcıda tıklanan öğenin elementini yakayabilirsiniz.

Önce metodu konsola yazarak doğruluğunu kontrol ediyoruz:

document.addEventListener("click", function (event) {
    var targetElement = event.target;
    console.log(targetElement);
    return "";
});

document.onclick = function (event) {
    var targetElement = event.target;
    console.log(targetElement);
    return "";
};

Şimdi de en çok ihtiyaç duyulan elementin metin, class, id ve varsa url değerlerini değişkene atayabilirsiniz.

document.onclick = function (event) {
    elementText = event.target.innerText;
    elementClass = event.target.className;
    elementUrl = event.target.href;
    elementId = event.target.id;

    // globalThis değişkeni fonksyiondan çıkararak global değişken haline getirir.
    globalThis.elementText;
    globalThis.elementClass;
    globalThis.elementUrl;
    globalThis.elementId;
    return ''
};

Fakat GTM tıklama takiplerini JS kodu yazmadan da takip edilebileceğimiz tetikleyiciler eklemiştir. Bu tıklanmaları da kendi içinde ikiye ayırmış; Öğe Tıklanmaları ve Link Tıklanmaları. Fark şudur; tüm tıklamalar Öğe Tıklamalarına dahildir, Link Tıklamaları ise içinde url (href) barındıran buton ve ya link tıklamalarıdır. Öğe Tıklamaları için; Tıklama > Tüm Öğeler (Click > All Elements) , Link Tıklamaları için; Tıklama > Yazlınca Bağlantılar (Click > Just Links) tetikleyicisini oluşturmamız gerekiyor. Tetikleyici, kullanıcının eylemini takip eder. Bu eylemin değerlerini değişkenler takip eder. Dolayısı ile sadece Click ve ya Link Click tetikleyicilerini kurmak yeterli sayılmaz. Aynı zamanda bu tetikleyici türüne denk değişken türlerini de aktif etmemiz gerekiyor. Bunun için Değişkenler bölümünden Yerleşik Değişkenlerden Tıklama türündeki değişkenleri aktif ediyoruz. İşlem sonucu şu olacak: Click tetikleyici ile tıklanan elementin Class ismini, mentini ve ya url değerlerini ölçebilirsiniz.