DOCS

Google Analytics 4

iframe Checkout için Google Analytics 4

iframe tabanlı eski Checkout entegrasyonunu kullanırken GA4 ile tam ödeme hattını izleyin.

Eski Checkout entegrasyonunu kullanan (iframe iglobalstores.com üzerinde barındırılan) tüccarlar artık tam ödeme hattı boyunca GA4 analitik etkinliklerini izleyebilir. Zonos Checkout, hafif bir geçiş komut dosyası kullanarak iframe'den analitik etkinliklerini üst sayfaya otomatik olarak aktarır, böylece etkinlikler GA4 özelliğinizde kendi sitenizden kaynaklanmış gibi görünür.

Yerel entegrasyonlar bu kılavuza ihtiyaç duymaz. Eğer <zonos-checkout> doğrudan sitenizde (iframe olmadan) görüntülenirse, Zonos sayfanızın window.gtag işlevini çağırır — Zonos panosu altında Google Analytics'i etkinleştirin Checkout ayarlarıİzleme ve sayfanızda normal GA4 temel etiketinizin yüklendiğinden emin olun. Aşağıdaki geçiş kurulumu, Checkout'un farklı bir kaynakta iframe'de barındırıldığında gereklidir.

Meta Ads dönüşümlerini izlemek için mi arıyorsunuz? Facebook Pixel kılavuzuna bakın — aynı geçiş komut dosyasını kullanır ve GA4 ile birlikte çalışabilir.

Nasıl çalışır 

Zonos Checkout farklı bir kaynakta iframe içinde çalıştığı için, sayfanızın gtag işlevine doğrudan erişemez. Geçiş sistemi, bunu iki adımlı bir el sıkışma (adımlar 1-2) ve ardından olay iletme (adım 3) ile çözer:

  1. Checkout üst öğeyi pingeler -- Checkout iframe içinde yüklendiğinde, ödeme hattını geçişe hazır olduğunu belirten üst penceresine bir mesaj gönderir.
  2. Üst öğe onaylar -- Sayfanızdaki geçiş komut dosyası, pingi alır, mevcut GA4 yapılandırmanızı algılar ve etkinlik almaya hazır olduğunu belirten sinyal gönderir.
  3. Etkinlikler iletilir -- Alışveriş yapanlar ödeme hattında ilerledikçe, her analitik etkinliği postMessage aracılığıyla sayfanıza gönderilir; burada geçiş komut dosyası gtag'a iletilir.

Tüm mesajlar, yalnızca HTTPS üzerinde güvenilir Zonos kaynaklarına (zonos.com ve iglobalstores.com) karşı doğrulanır.

Ön koşullar 

  • Ölçüm kimliği (format: G-XXXXXXXXXX) olan bir GA4 özelliği. Google Analytics'de bir tane oluşturabilirsiniz.
  • Sayfanızda iframe'de Zonos Checkout yükleyen eski Checkout entegrasyonu.

Kurulum 

Adım 1: GA4 etiketini sayfanıza ekleyin

Sitenizde GA4 yüklü değilse, Checkout iframe'ini barındıran sayfanın <head> bölümüne standart Google Analytics 4 etiketini ekleyin. G-XXXXXXXXXX yerine kendi ölçüm kimliğinizi yazın.

1<!-- Google tag (gtag.js) -->
2 
3<script
4 async
5 src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"
6></script>
7 
8<script>
9 window.dataLayer = window.dataLayer || [];
10 function gtag() {
11 dataLayer.push(arguments);
12 }
13 gtag('js', new Date());
14 gtag('config', 'G-XXXXXXXXXX');
15</script>

Not: Sitenizde GA4 etiketi zaten yüklüyse (ör. Google Tag Manager aracılığıyla veya doğrudan bir parçacık), bu adımı atlayabilirsiniz. Geçiş komut dosyası mevcut gtag işlevinizi kullanacaktır.

Bu parçacığı GA4 özelliğinizde Admin -> Veri Akışları -> akışınızı seçin -> Etiket talimatlarını görüntüleyin -> Manuel olarak yükleyin altında bulabilirsiniz.

Adım 2: Ölçüm kimliğinizi Zonos Checkout'a iletin

Zonos Checkout'a hangi GA4 ölçüm kimliğini kullanacağını söyleyin ve window.Zonos.googleAnalyticId öğesini Checkout'unuzun customHTML içinde ayarlayın. Zonos panosu, Checkout ayarları altında bir customHTML editörü gösterir -- bunun gibi bir <script> etiketi ekleyin:

1<script>
2 window.Zonos.googleAnalyticId = 'G-XXXXXXXXXX';
3</script>

Bu değer, geçiş el sıkışması sırasında üst öğeye gönderilir. Üst sayfanızda gtag zaten yüklü değilse, geçiş komut dosyası bu kimliği kullanarak GA4 temel etiketini sizin için enjekte edecektir.

Adım 3: Zonos analitik geçiş komut dosyasını ekleyin

GA4 etiketinden sonra aynı sayfaya aşağıdaki komut dosyası etiketini ekleyin. Bu komut dosyası, Zonos Checkout iframe'den analitik etkinliklerini dinler ve bunları gtag'a iletilir.

1<script
2 async
3 src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"
4></script>

Tam örnek

Sayfanızın <head> bölümündeki tam kurulum şu şekilde görünür:

1<head>
2 <!-- ... mevcut head etiketleriniz ... -->
3 
4 <!-- Google tag (gtag.js) -->
5 
6 <script
7 async
8 src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"
9 ></script>
10 
11 <script>
12 window.dataLayer = window.dataLayer || [];
13 function gtag() {
14 dataLayer.push(arguments);
15 }
16 gtag('js', new Date());
17 gtag('config', 'G-XXXXXXXXXX');
18 </script>
19 
20 <!-- iframe ödeme hattı için Zonos analitik geçişi -->
21 
22 <script
23 async
24 src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"
25 ></script>
26</head>

Hepsi bu. Her iki komut dosyası sayfanızda olduğunda, geçiş komut dosyası iframe ödeme hattı ile el sıkışmayı otomatik olarak tamamlar ve tüm ödeme hattı etkinliklerini GA4 özelliğinize iletilir.

GA4 etkinlikleri referans 

Zonos Checkout geçiş aracılığıyla aşağıdaki etkinlikleri yayar. Tüm etkinlikler bir isTestMode bayrağı ve checkoutSessionId içerir.

EtkinlikTetikleyiciEk meta veri
zonos-checkout-startCheckout açılır--
zonos-checkout-customer-infoAlışveriş yapan müşteri bilgilerini girer--
zonos-checkout-shipping-infoAlışveriş yapan kargo yöntemini seçerserviceLevelId
zonos-checkout-payment-infoAlışveriş yapan ödeme detaylarını girerpaymentMethod
zonos-checkout-payment-failÖdeme denemesi başarısız olur--
zonos-checkout-successSipariş başarıyla tamamlanırtransaction_id, currency, value, items
zonos-checkout-closeAlışveriş yapan ödeme hattını kapatır--
purchaseSipariş tamamlandı (GA4 standart e-ticaret etkinliği)transaction_id, currency, value, items

Satın alma etkinliği meta verileri

purchase etkinliği, GA4 e-ticaret purchase etkinliği şemasını izler:

AlanAçıklama
transaction_idZonos sipariş kimliği veya ödeme oturumu kimliği
currencyÜç harfli para birimi kodu (ör. USD)
valueToplam sipariş değeri
itemsSepet öğeleri dizisi; her biri item_id, item_name, price ve quantity ile

Hata ayıklama 

Geçiş komut dosyası için hata ayıklama günlüğünü etkinleştirmek üzere, sayfa URL'inize zonosDebug=1 sorgu parametresini ekleyin:

1https://www.yourstore.com/checkout?zonosDebug=1

Geçiş el sıkışması ve iletilen etkinliklerin ayrıntılı günlüklerini görmek için tarayıcınızın geliştirici konsolunu açın. Bu, aşağıdakileri doğrulamak için kullanışlıdır:

  • Geçiş komut dosyası, ödeme iframe'den ping alır.
  • GA4, doğru ölçüm kimliği ile yapılandırılır.
  • Etkinlikler gtag'a iletilir.

Sık sorulan sorular 

createTempCart API çağrımı değiştirmem gerekir mi?

Hayır. Geçiş sistemi createTempCart API'den bağımsız olarak çalışır. Sayfanıza GA4 etiketini ve geçiş komut dosyasını eklemeniz yeterlidir.

Zaten Google Analytics için footerHTML kullanıyorsam ne olur?

createTempCart API'deki footerHTML parametresi, komut dosyalarını ödeme iframe'ne enjekte eder; bu, iframe kaynağı içinde sayfa düzeyinde etkinlikleri izlemekle sınırlıdır. Geçiş yaklaşımı önerilir çünkü etkinlikleri kendi alan adınızda kendi GA4 özelliğinize gönderir ve size tek bir özellikte tam huni görünürlüğü verir.

footerHTML'dan GA4 komut dosyalarını geçişi ayarladıktan sonra güvenli bir şekilde kaldırabilirsiniz.

Bu, Google Analytics'te GA4 hata ayıklama modu ile çalışır mı?

Evet. Tarayıcınızın geliştirici konsolunda geçiş komut dosyası günlüklerini etkinleştirmek için zonosDebug=1 kullanabilir ve etkinlikleri gerçek zamanlı olarak doğrulamak için Google Analytics'te GA4 DebugView kullanabilirsiniz.

Test siparişleri izlenir mi?

Tüm etkinlikler bir isTestMode alanı içerir. Checkout test modundayken, etkinlikler yine de GA4'e gönderilir ancak isTestMode: true ile işaretlenir. Gerekirse özel boyutlar kullanarak GA4'te bunları filtreleyebilirsiniz.

Bu sayfa faydalı mıydı?