Google Tag Manager Kurulumu ve İlk Etiket

01GTM Nedir, Ne İşe Yarar?

Google Tag Manager (GTM), sitenize eklenen analiz, reklam ve ölçüm kodlarını tek bir panelden yönetmenizi sağlayan ücretsiz etiket yönetim sistemidir. Siteye yalnızca bir kez kapsayıcı kodu eklenir; GA4, Google Ads, Meta Pikseli gibi diğer kodlar bu kapsayıcının içinden çalıştırılır.

En büyük faydası, her yeni ölçüm ihtiyacında yazılımcıya ve kod yayınına bağımlı kalmamaktır. Pazarlama ekibi yeni bir dönüşüm etiketini panelde hazırlar, önizlemede test eder ve yayınlar. Her yayın bir sürüm olarak saklandığı için hatalı bir değişiklik tek tıkla geri alınabilir.

GTM'in bir sorumluluğu da vardır: kapsayıcıya erişimi olan herkes siteye kod ekleyebilir. Bu yüzden yetkileri dikkatli dağıtmak ve gereksiz etiketleri düzenli temizlemek gerekir.

02Etiket, Tetikleyici ve Değişken

GTM'i anlamanın anahtarı üç temel kavramdır. Her kurulum, bu üç parçanın birbirine bağlanmasından oluşur.

Data layer nedir?

Data layer, sitenizin GTM'e bilgi aktardığı ortak bir JavaScript dizisidir. Sipariş numarası, ürün bilgisi ya da form adı gibi sayfada görünmeyen verileri buraya yazarsınız; GTM bu verileri değişken olarak okuyup etiketlere aktarır. Böylece ölçüm, sayfa tasarımı değiştiğinde bozulmayan sağlam bir zemine oturur.

03Hesap ve Kapsayıcı Oluşturma

tagmanager.google.com adresine işletmenin Google hesabıyla girin. Hesap ve kapsayıcı işletme adına açılmalı, ajansa yalnızca kullanıcı yetkisi verilmelidir; iş birliği sona erdiğinde ölçüm altyapınız sizde kalır.

1. Hesap oluştur düğmesine basın, hesap adına işletme adınızı yazın ve ülkeyi seçin.
2. Kapsayıcı adına sitenizin adresini yazın ve hedef platform olarak Web seçin.
3. Hizmet şartlarını kabul edin; ekrana kurulum kodları gelir.
4. GTM- ile başlayan kapsayıcı kimliğini not edin.

04Kapsayıcı Kodunu Siteye Ekleme

GTM iki kod parçası verir. İlki her sayfanın head bölümünde, mümkün olduğunca yukarıda yer almalıdır. İkincisi JavaScript kapalı tarayıcılar için yedektir ve açılış body etiketinin hemen ardından eklenir. Ortak bir şablon ya da başlık dosyası kullanıyorsanız kodu yalnızca bir yere eklemeniz tüm sayfaları kapsar.

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Altyapı panelinden ekleme

Pek çok hazır sistem kapsayıcı kimliği için ayrı bir alan sunar ve kodu doğru yerlere kendisi yerleştirir. Aurora'nın e-ticaret altyapısında Google Tag Manager kodu panelden eklenir ve canlı kontrol ekranı kodun gerçekten çalışıp çalışmadığını gösterir.

05İlk Etiket: GA4 Google Etiketi

Kapsayıcı yüklendikten sonra ilk iş genellikle GA4 ölçümünü GTM üzerinden başlatmaktır. GA4 mülkünüz henüz yoksa önce Google Analytics 4 kurulumu adımlarıyla ölçüm kimliğini alın.

Google etiketi sayfa görüntülemelerini ve gelişmiş ölçüm etkinliklerini toplar. Ek etkinlikler için ayrı GA4 Etkinliği etiketleri oluşturur, ölçüm kimliğini ve etkinlik adını yazar, uygun tetikleyiciye bağlarsınız. Google Ads dönüşümleri için de aynı mantık geçerlidir: Google Ads panelinden aldığınız dönüşüm kimliği ve etiketiyle bir Google Ads Dönüşüm İzleme etiketi oluşturup bunu teşekkür sayfasına ya da satın alma olayına bağlamanız yeterlidir. Etiket adlarında araç, tür ve amaç sırasını korumak, kapsayıcı büyüdükçe aradığınızı kolayca bulmanızı sağlar.

1. Etiketler menüsünden Yeni düğmesine basın ve etikete anlaşılır bir ad verin (ör. GA4 - Google Etiketi).
2. Etiket yapılandırmasında Google Etiketi türünü seçin ve G- ile başlayan ölçüm kimliğinizi yazın.
3. Tetikleme bölümünde Initialization - All Pages (Başlatma - Tüm Sayfalar) tetikleyicisini seçin; böylece etiket diğer etiketlerden önce yüklenir.
4. Kaydedin. Etiket henüz canlı değildir; sırada önizleme ve yayınlama var.

06Data Layer ile Olay Gönderme

Form gönderimi ya da satın alma gibi önemli anlarda sitenin data layer'a bir olay yazması en güvenilir ölçüm yöntemidir. Tıklama ya da sayfa adresi gibi görünür öğelere dayanan tetikleyiciler, tasarım değiştiğinde sessizce bozulabilir.

Aşağıdaki örnekte form başarıyla gönderildiğinde form_gonderildi adlı bir olay yazılır. GTM'de Özel Etkinlik türünde, olay adı form_gonderildi olan bir tetikleyici oluşturur, GA4 Etkinliği etiketini bu tetikleyiciye bağlarsınız. Form adını okumak için de Data Layer Değişkeni türünde form_adi adlı bir değişken tanımlarsınız.

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  event: 'form_gonderildi',
  form_adi: 'teklif_formu'
});

Tek sayfa uygulamalarda (SPA)

React ya da Vue ile yazılmış tek sayfa uygulamalarda sayfa geçişleri tarayıcıyı yeniden yüklemez. Bu durumda Geçmiş Değişikliği (History Change) tetikleyicisini kullanabilir ya da yönlendirici her sayfa değiştiğinde data layer'a bir olay yazabilirsiniz. Proje kurulumunu Vite ile React kurulumu rehberinde anlattık.

07Önizleme, Test ve Yayınlama

Hiçbir değişikliği test etmeden yayınlamayın. Sağ üstteki Önizle düğmesi Tag Assistant'ı açar; sitenizin adresini yazdığınızda site hata ayıklama modunda açılır ve her sayfa ya da olayda hangi etiketin çalıştığını, hangisinin çalışmadığını tek tek görürsünüz.

Testten memnunsanız Gönder düğmesine basın, sürüme açıklayıcı bir ad ve kısa bir not yazın. Sürüm adına ne değiştiğini yazmak, aylar sonra bir ölçüm sorunu çıktığında hangi değişikliğin buna yol açtığını bulmanızı kolaylaştırır.

• GA4 tarafında etkinliklerin geldiğini DebugView ekranından da doğrulayın.
• Sorun çıkarsa Sürümler menüsünden önceki sürümü yeniden yayınlayabilirsiniz.
• Büyük ekiplerde ayrı çalışma alanları açarak değişikliklerin birbirine karışmasını önleyin.

08Sık Hatalar ve İyi Uygulamalar

Zamanla kapsayıcıda kullanılmayan etiketler birikir ve her biri sayfa yüküne eklenir. Üç ayda bir kapsayıcıyı gözden geçirip kullanılmayan etiketleri duraklatmak, hem ölçüm karmaşasını hem de sayfa hızı üzerindeki yükü azaltır; bu konu hız ve performans yönetimi çalışmalarımızın da düzenli bir parçasıdır.

Ziyaretçi onayı alınmadan reklam ve ölçüm etiketlerinin çalıştırılmaması gerekir. GTM'in izin ayarları ve Consent Mode yapılandırması bu akışı yönetir. Bu yazı genel bilgi verir; çerez onay yapınız için güncel mevzuatı ve hukuk danışmanınızı kontrol edin.