Meluncurkan Kampanye Google Ads dengan Peristiwa Kustom dan Flutter Google Analytics

Terakhir Diperbarui: 25-01-2021

Yang akan Anda buat

Di codelab ini, Anda akan mempelajari cara menerapkan peristiwa kustom dengan GA4F dan meluncurkan kampanye tindakan melalui Google Ads untuk aplikasi Flutter.

Kita akan menggunakan aplikasi Flutter default dengan widget penghitung sederhana. Kita akan mengiklankan aplikasi kita kepada calon pengguna yang kemungkinan akan mengklik widget penghitung.

bdbf1fc3cbf49ac7.png

Yang akan Anda pelajari

  • Cara melakukan inisialisasi GA4F (Google Analytics for Firebase) di Flutter
  • Cara membuat parameter dan peristiwa custom.
  • Cara mengimpor peristiwa dari Firebase ke Google Ads
  • Meluncurkan kampanye tindakan dengan peristiwa kustom.

Yang Anda butuhkan

  • Android Studio 3.6 atau yang lebih tinggi
  • Xcode (untuk dukungan iOS)
  • Akun Firebase
  • Akun Google Ads

Membuat aplikasi Flutter dengan template sederhana. Anda akan memodifikasi aplikasi awal ini untuk codelab ini.

Meluncurkan Android Studio.

  1. Jika Anda tidak memiliki project yang terbuka, pilih Start a new Flutter app dari halaman sambutan. Atau, pilih File > New > New Flutter Project.
  2. Pilih Flutter Application sebagai jenis project, lalu klik Next.
  3. Verifikasi bahwa jalur Flutter SDK menentukan lokasi SDK. (Pilih Install SDK jika kolom teks kosong.)
  4. Masukkan nama project lalu klik Next.
  5. Gunakan nama paket default yang disarankan oleh Android Studio, lalu klik Next.
  6. Klik Finish.
  7. Tunggu Android Studio menginstal SDK dan membuat project tersebut.

Untuk memulai Firebase, Anda harus membuat dan menyiapkan project Firebase.

Membuat project Firebase

  1. Login ke Firebase.

Di Firebase console, klik Tambahkan Project (atau Buat project), lalu beri nama project Firebase sebagai Firebase-Flutter-Ads atau nama apa pun yang Anda suka.

e9a8e1b1c7c52125.png

  1. Klik opsi pembuatan project. Setujui persyaratan Firebase jika diminta. Anda harus mengaktifkan Google Analytics untuk project ini, karena Anda membutuhkan peristiwa Google Analytics untuk melacak peristiwa tindakan dan menganalisis konversi.

e58151a081f0628.png

Untuk mempelajari lebih lanjut project Firebase, lihat Memahami project Firebase.

3e5b8f1b6ca538c4.png

Mengonfigurasi Android

  1. Di Firebase Console, Pilih Ringkasan Project di panel navigasi sebelah kiri, lalu klik tombol Android di bawah "Mulai dengan menambahkan Firebase ke aplikasi Anda"

Anda akan melihat dialog yang ditampilkan di layar berikut.

3b7d3b33d81fe8ea.png

  1. Nilai penting yang harus diberikan adalah nama paket Android, yang akan Anda dapatkan mengikuti langkah berikut.
  1. Di direktori aplikasi Flutter Anda, buka file android/app/src/main/AndroidManifest.xml.
  2. Di elemen manifest, temukan nilai string atribut package. Nilai ini adalah nama paket Android (misalnya com.yourcompany.yourproject). Salin nilai ini.
  3. Di dialog Firebase, tempelkan nama paket yang disalin ke kolom Android package name.
  4. Kita tidak memerlukan kunci SHA-1 di sini, kecuali Anda berencana untuk menggunakan Login dengan Google atau Firebase Dynamic Links (perlu diketahui bahwa ini bukan bagian dari codelab ini). Jika Anda berencana mengimpor data in_app_purchase dari Google Play, Anda akan harus menetapkan kuncinya nanti.
  5. Klik Register App.
  6. Melanjutkan di Firebase, ikuti petunjuk untuk mendownload file konfigurasi google-services.json.

52f08aa18c8d59d0.png

  1. Buka direktori aplikasi Flutter, lalu pindahkan file google-services.json (yang baru saja Anda download) ke direktori android/app.
  2. Kembali di Firebase console, lewati langkah-langkah yang tersisa, lalu kembali ke halaman utama Firebase console.
  3. Terakhir, Anda memerlukan Google Services Gradle plugin untuk membaca file google-services.json yang dihasilkan oleh Firebase.
  4. Di IDE atau editor Anda, buka android/app/build.gradle, lalu tambahkan baris berikut sebagai baris terakhir di file:
apply plugin: 'com.google.gms.google-services'
  1. Buka android/build.gradle, lalu di dalam tag buildscript, tambahkan dependensi baru:
buildscript {
   repositories {
      // ...
   }
   dependencies {
      // ...
      Classpath 'com.google.gms:google-services:4.3.3'
   }
}
  1. Jika aplikasi Anda masih berjalan, tutup dan build ulang untuk memungkinkan gradle menginstal dependensi.

Anda telah selesai mengonfigurasi aplikasi Flutter Anda untuk Android. Untuk iOS, sebaiknya lihat codelab ini (Kenali Firebase untuk Flutter)

Di langkah ini, Anda akan mulai menggunakan paket Firebase Analytics bernama firebase_analytics, yang berisi fitur Firebase Analytics.

File pubspec mengelola aset untuk aplikasi Flutter. Di pubspec.yaml, tambahkan firebase_analytics: ^6.2.0 (firebase_analytics 6.2.0 atau yang lebih tinggi) ke daftar dependensi:

dependencies:
   flutter:
      sdk: flutter
   cupertino_icons: ^0.1.2
   firebase_analytics: ^6.2.0   # add this line

Saat melihat pubspec di tampilan editor Android Studio, klik Packages get. Tindakan ini akan menarik paket ke dalam project Anda. Anda akan melihat tampilan berikut di konsol:

flutter packages get
Running "flutter packages get" in startup_namer...
Process finished with exit code 0

Dengan menjalankan Pub get, file pubspec.lock akan otomatis dibuat dengan daftar semua paket yang ditarik ke dalam project beserta nomor versinya.

Di lib/main.dart, impor paket baru:

import 'package:firebase_analytics/firebase_analytics.dart';

Di class MyApp, Anda akan memulai objek FirebaseAnalytics dengan memanggil konstruktor.

class MyApp extends StatelessWidget {
 static FirebaseAnalytics analytics = FirebaseAnalytics();
   ...
}

Sekarang Anda sudah siap untuk mengaktifkan beberapa log peristiwa kustom.

Jika Anda membuat template baru di Aplikasi Flutter, Anda akan melihat variable _counter dan metode _incrementCounter() di dalam class Status default. Sekarang, Anda ingin mencatat log peristiwa kustom ketika tombol penambahan diklik lebih dari lima kali dari pengguna tertentu yang antusias.

Nanti, kita akan meluncurkan kampanye aplikasi, terutama untuk menarik calon pengguna yang antusias yang akan berinteraksi dengan aplikasi secara mendalam.

Pertama, sebaiknya teruskan objek analisis yang telah kita inisialisasi ke widget Stateful. Kita dapat memulai dengan menambahkan parameter analisis ke konstruktor MyHomePage.

MyHomePage({Key key, this.title, this.analytics}) : super(key: key);

Anda juga akan menambahkan parameter analisis saat memanggil konstruktor.

home: MyHomePage(
   title: 'Flutter Demo Home Page',
   analytics: analytics,
),

Sekarang, Anda dapat dengan mudah mencatat log peristiwa dengan metode logEvent(). Letakkan metode diikuti dengan menambahkan variabel _counter.

void _incrementCounter() {
 setState(() {
   _counter++;

   //add this
   if(_counter > 5) {
     widget.analytics.logEvent(name: "clicked_counter");
   }

 });
}

Sekarang aplikasi Anda sudah siap untuk mengaktifkan log peristiwa kustom.

Anda juga dapat menggunakan metode yang telah di-build sebelumnya untuk mengaktifkan peristiwa.

f0742c956977df1d.png

Sekarang semuanya sudah siap. Di Android Studio, Jalankan ‘main.dart'.

(Opsional) Mengirim informasi tambahan ke Firebase Analytics menggunakan parameter

Anda juga dapat mengirimkan informasi tambahan melalui parameter. Parameter kustom dapat didaftarkan untuk pelaporan di laporan Analytics Anda. Parameter juga dapat digunakan sebagai filter di definisi audience yang dapat diterapkan ke setiap laporan. Jika aplikasi Anda ditautkan ke project BigQuery, parameter kustom juga akan ditemukan di BigQuery. Lihat BigQuery Export untuk Firebase.

Kita menetapkan nilai _counter sebagai parameter di sini.

void _incrementCounter() {
 setState(() {
   _counter++;

   if(_counter > 5) {
     widget.analytics.logEvent(name: "clicked_counter", parameters: {'count' : _counter});
   }
 });
}

Memeriksa dan men-debug peristiwa

Dalam beberapa jam, Anda akan dapat melihat peristiwa yang disimpan di log di Firebase console. Cukup klik tab Peristiwa dari Bagian Analisis yang ada di Firebase Console. Anda juga dapat memeriksa nilai di dalam clicked_counter peristiwa hanya dengan mengklik peristiwa tersebut.

32b01a1412ab2ba5.png

Anda akan menandai clicked_counter sebagai konversi dengan menggeser tombol ‘tandai sebagai konversi' ke kanan.

e6b420a73db88f03.png

Periksa ulang peristiwa untuk melihat apakah peristiwa berhasil ditandai sebagai konversi. Jika Anda dapat mengonfirmasi bahwa peristiwa ada di tab Konversi, berarti Anda telah berhasil memeriksa peristiwa sebagai konversi. Dengan menandai peristiwa ini sebagai konversi, Google Ads akan dapat mengimpor peristiwa ini dari Firebase.

Namun, untuk tujuan proses debug, Anda dapat menggunakan DebugView Firebase. Untuk detail selengkapnya, lihat Proses Debug Peristiwa.

Setelah penyiapan Firebase-Flutter Anda selesai, Anda sudah siap untuk meluncurkan kampanye aplikasi dengan peristiwa tindakan. Pertama-tama, Anda akan memulai dengan menautkan Firebase ke Google Ads. Dengan menautkan Firebase ke Google Ads, kampanye aplikasi dapat mengimpor peristiwa Firebase. Proses ini juga membantu Google Ads untuk meningkatkan kampanye aplikasi dengan memungkinkannya mempelajari lebih lanjut audiens mereka.

  1. Buka Setelan Firebase dengan mengklik tombol di samping Ringkasan Project.
  2. Di tab Integrasi, Anda akan melihat Google Ads dan tombol Tautkan. Klik Tautkan dan Lanjutkan.

b711bf2e94fa0895.png

  1. Pilih akun Google Ads.

Sekarang, bagian Firebase sudah selesai.

Buka Google Ads.

  1. Login, dan buka Alat & Setelan → Pengukuran → Konversi untuk mengimpor peristiwa kustom sebagai konversi.
  2. Klik tombol + untuk menambahkan tindakan konversi baru.

73cec8d2e80eab03.png

  1. Pilih properti Google Analytics 4 (Firebase) dan klik lanjutkan.

4b1d8f6a712b2ac6.png

  1. Anda dapat melihat semua peristiwa analisis yang ditandai sebagai konversi. Temukan peristiwa clicked_counter yang kita terapkan sebelumnya.

ba1bbe6b2924fac8.png

  1. Periksa dan klik tombol Impor dan Lanjutkan.

ab35e341dff32e48.png

Setelah menetapkan clicked_counter sebagai tindakan konversi, Anda akan meluncurkan kampanye tindakan yang dapat menargetkan pengguna yang kemungkinan mengaktifkan peristiwa clicked_counter lebih dari 5 kali.

  1. Buka tab kampanye di akun Anda sekarang, dan mulai kampanye baru dengan mengklik tombol +. Klik [New campaign] dan lanjutkan.
  2. Anda akan meluncurkan kampanye promosi Aplikasi dengan opsi Penginstalan Aplikasi.

af98c44d1476558.png

  1. Temukan aplikasi Anda dengan mengetik nama aplikasi, nama paket, atau penayang.
  2. Di bagian bidding, pilih Tindakan dalam aplikasi di menu dropdown.
  3. Anda dapat menemukan peristiwa kustom Anda di daftar yang diberikan. Tetapkan Target biaya per tindakan, dan isi juga opsi lainnya.

885956ad00592eb3.png

  1. Selesaikan setelan kampanye Anda.

Selamat, Anda telah berhasil mengintegrasikan Firebase dan Google Ads Anda. Hal ini akan membantu Anda meningkatkan performa kampanye dengan peristiwa Firebase yang diimpor.

Anda telah mempelajari

  • Cara Mengonfigurasi Firebase Analytics untuk Flutter
  • Cara mencatat log peristiwa kustom dengan Firebase Analytics di aplikasi Flutter.
  • Cara mengimpor peristiwa dan menggunakannya untuk kampanye tindakan.