Firebase için Google Analytics ile Web Görünümünde Etkinlikleri İzleme

1. Giriş

Son güncelleme tarihi: 25.02.2022

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 resmi kılavuzunda, GitHub'da örnek kod sağlanır. Bu proje için ona ihtiyacımız var.

Başlamak için kodu indirip favori geliştirme ortamınızda açmanız gerekecek. 2 dizin kullanacağız : Android ve 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 için Firebase yapılandırması

Firebase konsolunda Android'i yapılandırma

1. Firebase Konsol Ana Sayfası'nda aşağıdaki gibi Android simgesini tıklayabilirsiniz. .

Alternatif olarak soldaki gezinme çubuğundan Projeye Genel Bakış'a gidip "Uygulamanıza Firebase'i ekleyerek başlayın"ın altındaki Android düğmesini tıklayın

"Firebase'i Android uygulamanıza ekleyin" seçeneğini görürsünüz aşağıdaki gibi bir ekran görüntüsü ekleyin.

2. Android paketinizin adını (ör. com.xxxx.myproject), uygulama dizininizin android/app/src/main/AndroidManifest.xml sayfasında bulabilirsiniz.

package="com.xxxx.myproject"

3. Burada SHA-1 anahtarı gerekmez. Bu anahtar yalnızca Google ile Oturum Açma veya Firebase Dynamic Links'i kullanmak ya da bu codelab'de yer almayan in_app_purchase verilerini Google Play'den içe aktarmak istediğinizde gereklidir.
4. Uygulamayı Kaydet'i tıklayın.
5. Firebase konsolunda yapılandırma dosyasını (google-services.json) indirin ve kopyalayıp bu dosyayı uygulama projenizdeki android/app dizinine yapıştırın.
6. Firebase konsoluna dönün ve kalan adımları atlayın ve Firebase konsolunun ana sayfasına dönün.
7. Son olarak, Firebase tarafından oluşturulan google-services.json dosyasını okumak için Google Services Gradle eklentisine ihtiyacınız vardır.
8. 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 adlı kişiyi aç. Ardından, 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 sayfasına hangi kodu yerleştirmeniz gerektiğine bakalım. .

Öncelikle, html dosyasında kullanılacak bir JavaScript dosyası oluşturun. Örnek kodda js dosyasının adı index.js olarak verilmiştir. "logEvent" işlevini oluşturmanız gerekir. "AnayticsWebInterface" çağrısı için ve "messageHander" için olan aşağıdaki kodu kullanabilirsiniz.

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

Android uygulamasındaki WebView'da bir etkinlik tetiklendiğinde, "window.AnalyticsWebInterface" çağrılır ve etkinlik, uygulamadaki WebInterface koduna yönlendirilir.

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 bir web sayfası URL'sine ihtiyacınız vardır. Web sayfalarını barındırmanın birçok yöntemi vardır. Bu codelab'de, Firebase barındırma hizmetini size kolaylık sağlamak için kullanacağız.

• Terminalinizde web dizinini (ör. cd web) tıklayıp şu komutları çalıştırın:
• npm install -g firebase-tools

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

• Web sayfası URL'sini aldıktan sonra Android Studio'da uygulama projenize gidin ve Web Görünümü'nde bu adımda az önce yaptığınız web URL'sini aşağıdaki gibi ekleyin.

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

Etkinlikleri Web Görünümü'nde GA4F ile izlemek için kodu hem web'e hem de Android'e eklemeniz gerekir. Bu bölümde, WebView'da web sayfasındaki etkinlikleri almak için 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 GitHub'dan 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

"1. ETKİNLİĞİ GÜNCELLE"yi tıklayın veya kodunuz iyi ç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.

event1 dönüşümünü Google Ads'de dönüşüm olarak içe aktarmak için Dönüşüm olarak işaretle anahtarını sağa kaydırarak bu dönüşümü dönüşüm olarak 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 kurulumunuz tamamlandıktan sonra işlem etkinlikleriyle uygulama kampanyalarını başlatmaya hazır olursunuz. 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şlemi olarak ayarlandıktan sonra event1 etkinliğiyle uygulama işlemi 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

12. Referanslar

Resmi Kılavuz

• Analytics'i Web Görünümünde Kullanma - Firebase - Google

Firebase ve Google Ads kurulumu

• Firebase için Google Analytics ile Google Ads özel etkinlikleri - Android
• Google Analytics Özel Etkinlikler ve Flutter ile Google Ads Kampanyaları Başlatma