Google Analytics ile Web Görünümünde Etkinlikleri İzleme

1. Giriş

Son güncelleme tarihi: 22.12.2021

Oluşturacaklarınız

Bu codelab'de, GA4F'nin etkinlikleri izleyebilmesi için etkinlikleri WebView'daki bir web sayfasından yerel bir koda nasıl yönlendireceğinizi öğreneceksiniz.

Bir web sayfasını WebView kullanarak çağıran örnek Karma Android uygulamasını kullanacağız.

Neler öğreneceksiniz?

• Karma uygulamada GA4F'yi (Firebase için Google Analytics) başlatma
• Web sayfasında özel etkinlikler ve parametreler oluşturma
• WebView içindeki bir web sayfasında bulunan etkinlikleri yerel bir koda yönlendirme
• Hata ayıklama
• Etkinlikleri içe aktarma ve işleme yönelik kampanyalarda kullanma

Gerekenler

• Android Studio 3.6 veya sonraki sürümler
• Firebase Hesabı

2. Kurulum

Kodu alma

Firebase kılavuzu belgeleri, bu proje için ihtiyaç duyduğumuz örnek kodu bir github'a sağlar.

Başlamak için kodu alıp favori geliştirme ortamınızda açmanız gerekecek. 2 dizin kullanacağız : Android, web. "Android" dizini, Android uygulaması ve "web" içindir dizini, uygulama tarafından WebView aracılığıyla çağrılacak bir web sayfası içindir.

3. Firebase projesi oluşturma ve ayarlama

Firebase'i kullanmaya başlamak için bir Firebase projesi oluşturup ayarlamanız gerekir.

Firebase projesi oluşturma

1. Firebase'de oturum açın.

Firebase konsolunda Proje Ekle (veya Proje oluştur) seçeneğini tıklayın ve Firebase projenizi Webview-test-codelab olarak veya istediğiniz herhangi bir adla adlandırın.

2. Proje oluşturma seçeneklerini tıklayarak ilerleyin. İstenirse Firebase şartlarını kabul edin. İşlem etkinliklerini izlemek ve dönüşümleri analiz etmek için Google Analytics etkinliklerine ihtiyacınız olduğundan bu proje için Google Analytics'i etkinleştirmeniz gerekir.

Firebase projeleri hakkında daha fazla bilgi için Firebase projelerini anlama başlıklı makaleyi inceleyin.

4. Android Firebase yapılandırması

Android'i yapılandırma

1. Firebase Konsolu'nda sol gezinme menüsünden Projeye Genel Bakış'ı seçin ve ardından "Uygulamanıza Firebase'i ekleyerek başlayın"ın altındaki Android düğmesini tıklayın.

Sonraki ekranda gösterilen iletişim kutusunu göreceksiniz.

2. Sağlanacak önemli değer Android paketi adıdır. Bu değeri aşağıdaki adımı izleyerek edinebilirsiniz.

İpucu: Paket ve uygulama kimlikleri hakkında daha fazla bilgi için Uygulama kimliğini ayarlama bölümünü okuyun.

3. Uygulama dizininizde android/app/src/main/AndroidManifest.xml dosyasını açın.
4. manifest öğesinde, package özelliğinin dize değerini bulun. Bu değer, Android paketinin adıdır (com.yourcompany.yourproject gibi). Bu değeri kopyalayın.
5. Firebase iletişim kutusunda, kopyalanan paket adını Android package name alanına yapıştırın.
6. Google ile Oturum Açma veya Firebase Dynamic Links kullanmayı planlamıyorsanız burada SHA-1 anahtarına ihtiyacınız yoktur (bunların bu codelab'in bir parçası olmadığını unutmayın). in_app_purchase verilerini Google Play'den içe aktarmayı planlıyorsanız anahtarı daha sonra ayarlamanız gerekir.
7. Uygulamayı Kaydet'i tıklayın.
8. Firebase'de devam ederek google-services.json yapılandırma dosyasını indirme talimatlarını uygulayın.

9. Uygulama dizininize gidin, ardından yeni indirdiğiniz google-services.json dosyasını android/app dizinine taşıyın.
10. Firebase konsoluna dönün ve kalan adımları atlayın ve Firebase konsolunun ana sayfasına dönün.
11. Son olarak, Firebase tarafından oluşturulan google-services.json dosyasını okumak için Google Services Gradle eklentisine ihtiyacınız vardır.
12. IDE'nizde veya düzenleyicinizde android/app/build.gradle uygulamasını açın, ardından aşağıdaki satırı dosyanın son satırı olarak ekleyin:

apply plugin: 'com.google.gms.google-services'

13. android/build.gradle sayfasını açıp buildscript etiketinin içine yeni bir bağımlılık ekleyin:

buildscript { 
   repositories {
      // ...
   }
   dependencies {
      // ...
      Classpath 'com.google.gms:google-services:4.3.3'
   }
}

14. Uygulamanız hâlâ çalışıyorsa gradle'ın bağımlılıkları yüklemesine izin vermek için uygulamayı kapatıp yeniden oluşturun.

Uygulamanızı Android için yapılandırmayı tamamladınız.

5. Web'de bir Analytics Web Arayüzü geliştirin ve özel etkinlikleri günlüğe kaydedin

Google Analytics ile bir web görünümündeki etkinlikleri izlemek için kodu hem web hem de Android uygulamasına eklemeniz gerekir.

Bu bölümde, web'e hangi kodu yerleştirmeniz gerektiğine bakalım. .

Öncelikle, html dosyasında kullanılacak bir JavaScript dosyası oluşturun. Örnek kodda, index.js adlı js dosyası. "logEvent" işlevini oluşturmanız gerekir. Android için AnayticsWebInterface ve iOS için MessageHander çağrısını yapmak üzere aşağıdaki kodu kullanın.

Ve bu işlevi, aşağıdaki gibi etkinliği izlemek istediğiniz yere çağırın.

Etkinlik Android'de web görünümünde tetiklendiğinde, "window.AnalyticsWebInterface" çağrılır ve etkinliği yerel uygulamaya bağlar.

6. Web sayfası URL'sini almak için web dizinini barındırın

Uygulamanızda WebView içinde bir web sayfasını çağırmadan önce web sayfası URL'sine ihtiyacınız vardır. Web sayfası barındırmanın birçok yöntemi olsa da bu codelab'de, Firebase barındırma hizmetini size kolaylık sağlamak için nasıl kullanacağınızı göstereceğiz.

• Terminalinizde web dizinini (ör. cd web) tıklayıp şu komutları çalıştırın:
• npm install -g firebase-tools - Bu işlem Firebase CLI'ı yükler.
• firebase login
• firebase init
• "Barındırma"yı seçin oluşturmak istediğiniz sorulduğunda.
• Android uygulamanız için oluşturduğunuz projeyi seçin.
• Kalan tüm istemler için varsayılanları kabul edin.
• firebase deploy --only hosting - Firebase barındırmaya dağıtım

7. Android uygulamasında arayüz kodu geliştirme

Google Analytics ile bir web görünümünde etkinlikleri izlemek için kodu hem web'e hem de Android'e eklemeniz gerekir. Bu bölümde, Android uygulamasına hangi kodu yerleştirmeniz gerektiğine bakalım.

"AnalyticsWebInterface.java" dosyasını oluşturun "AnalyticsWebInterface" yapacak sınıfını kullanır. Bu sınıfta, aşağıdaki gibi web js dosyasındaki logEvent işlevini bağlamak için @JavascriptInterface kodunu kodlamanız gerekir.

Daha sonra, Etkinlik bölümüne aşağıdaki gibi web görünümünü çağıran bir JavaScript arayüzü eklemeniz gerekir.

Kodun tamamını görmek için lütfen "Kurulum" bölümünde indirdiğiniz örnek koda bakın. adımına geçelim.

8. Etkinlikleri kontrol etme ve hata ayıklama

Hata ayıklama etkinlikleri için test cihazını bağladıktan veya emülatörü başlattıktan sonra Android Studio terminalinde aşağıdaki kodu kullanabilirsiniz.

> adb shell setprop Debugger.firebase.analytics.app [uygulama paketi adı]

> adb shell setprop log.tag.FA AYRINTILI

> adb kabuk setprop log.tag.FA-SVC AYRINTILI

> adb logcat -v süre -s FA FA-SVC

Kodunuz düzgün çalışıyorsa aşağıdaki gibi bir günlük görürsünüz.

Firebase konsolunda kontrol etmek isterseniz Gerçek Zamanlı sekmesini de kullanabilirsiniz. Firebase konsoluna gidin ve aşağıdaki gibi Gerçek Zamanlı sekmesini tıklayın.

Ardından "Karşılaştırma ekle"yi kullanarak Android platform etkinliğini filtreleyin işlevini kullanın.

Kodunuz doğru uygulandığında Android uygulamasındaki etkinlikleri Gerçek Zamanlı sekmesinde görürsünüz.

Günlüğe kaydedilen etkinliklerinizi Firebase konsolundaki Etkinlikler sekmesinde birkaç saat içinde görebilirsiniz. Firebase Konsolu'ndaki Analytics bölümünde Etkinlikler sekmesini tıklamanız yeterlidir. Yalnızca etkinliği tıklayarak event1 etkinliğindeki değerleri de kontrol edebilirsiniz.

Dönüşüm olarak işaretle anahtarını sağa kaydırarak event1 dönüşümünü işaretleyin.

Etkinlik Dönüşüm sekmesindeyse etkinliği başarıyla dönüşüm olarak işaretlemişsinizdir. Google Ads artık bu etkinliği Firebase'den içe aktarabilecek.

Hata ayıklama için Firebase DebugView'u kullanın. Daha fazla bilgi için Etkinlikte hata ayıklama bölümüne bakın.

9. Analiz etkinliklerini Google Ads'e aktarma

Firebase-Flutter kurulumunuz tamamlandıktan sonra işlem etkinlikleriyle uygulama kampanyalarını başlatmaya hazırsınız demektir. Firebase'i Google Ads'e bağlayarak başlayın. Firebase Google Ads'e bağlandığında uygulama kampanyaları Firebase etkinliklerini içe aktarabilir. Bu süreç, Google Ads'in kitleleri hakkında daha fazla bilgi edinmesini sağlayarak uygulama kampanyalarını güçlendirmesine de yardımcı olur.

1. Projeye Genel Bakış'ın yanındaki düğmeyi tıklayarak Firebase Ayarları'na gidin.
2. Entegrasyonlar sekmesinde Google Ads ve Bağla düğmesini görürsünüz. Bağlantı oluştur'u, ardından Devam'ı tıklayın.

3. Google Ads hesabı'nı seçin.

Dikkat: Hedef etkinlik dönüşüm etkinliği olarak işaretlenmemişse Google Ads bu etkinliği içe aktaramaz. Etkinliğin doğru şekilde dönüşüm olarak işaretlendiğinden emin olun.

Şimdi Firebase kısmı tamamlandı.

Google Ads'e gidin.

1. Giriş yapın ve Araçlar ve Ayarlar > Ölçüm > Dönüşümler'i seçin.
2. Yeni dönüşüm işlemleri eklemek için + düğmesini tıklayın.

3. Google Analytics 4 mülkleri (Firebase) seçeneğini belirleyin ve Devam'ı tıklayın.

4. Dönüşüm olarak işaretlenen tüm analiz etkinliklerini görebilirsiniz. Daha önce uyguladığımız event1 etkinliğini bulun.

5. İşlemi kontrol edin, İçe aktar'ı,ardından Devam'ı tıklayın.

event1 dönüşüm işlemini bir dönüşüm işlemi olarak ayarladıktan sonra, event1 etkinliklerini 5 defadan fazla tetikleyebilecek kullanıcıları hedefleyebilecek işlem kampanyaları başlatabilirsiniz.

10. İçe aktarılan etkinliklerle uygulama işlemi kampanyaları başlatma

Önemli: Uygulama kampanyasını başarılı bir şekilde başlatmak için Google Play'de üretim düzeyinde bir uygulama edinmeniz gerekir. Ancak henüz yayınlamaya hazır değilseniz bu adımı şimdilik atlayabilirsiniz.

6. Mevcut hesabınızın kampanya sekmesine gidin ve + düğmesini tıklayarak yeni bir kampanya başlatın. [Yeni kampanya] seçeneğini, ardından Devam'ı tıklayın.
7. Uygulama Yüklemeleri seçeneğini kullanarak bir Uygulama tanıtım kampanyası başlatın.

8. Uygulama adını, paket adını veya yayıncıyı yazarak uygulamanızı bulun.
9. Teklif verme bölümündeki açılır menüden Uygulama içi işlemler'i seçin.
10. Sağlanan listede özel etkinliğinizi bulun. İşlem başına maliyet hedefi'ni ayarlayın ve ek seçenekleri tamamlayın.

11. Kampanya ayarlarınızı tamamlayın.

11. Tebrikler

Tebrikler, Firebase ile Google Ads'i başarıyla entegre ettiniz. Böylece, Firebase'den içe aktarılan etkinliklerle kampanya performansınızı artırabilirsiniz.

Neler öğrendiniz?

• Karma uygulamada GA4F'yi (Firebase için Google Analytics) başlatma
• Web sayfasında özel etkinlikler ve parametreler oluşturma
• WebView içindeki bir web sayfasında bulunan etkinlikleri yerel bir koda yönlendirme
• Hata ayıklama
• Etkinlikleri içe aktarma ve işleme yönelik kampanyalarda kullanma