Google Ads-Kampagnen mit benutzerdefinierten Google Analytics-Ereignissen und Flutter starten

1. Einführung

Zuletzt aktualisiert: 25.01.2021

Umfang

In diesem Codelab erfahren Sie, wie Sie benutzerdefinierte Ereignisse mit GA4F implementieren und Action-Kampagnen über Google Ads für eine Flutter-App starten.

Wir verwenden die Standard-Flutter-App mit einem einfachen Zähler-Widget. Wir werben für unsere App bei potenziellen Nutzern, die wahrscheinlich auf das Zähler-Widget klicken.

Lerninhalte

• GA4F (Google Analytics for Firebase) in Flutter initialisieren
• Benutzerdefinierte Ereignisse und Parameter erstellen
• Ereignisse aus Firebase in Google Ads importieren
• Aktionskampagnen mit benutzerdefinierten Ereignissen starten

Voraussetzungen

• Android Studio 3.6 oder höher
• Xcode (für iOS-Unterstützung)
• Firebase-Konto
• Google Ads-Konto

2. Neues Flutter-Projekt starten

Erstellen Sie eine einfache Flutter-App mit Vorlage. Sie werden diese Starter-App in diesem Codelab ändern.

Starten Sie Android Studio.

Hinweis:Wenn „New Flutter Project“ in Ihrer IDE nicht als Option angezeigt wird, müssen Sie die Plug-ins für Flutter und Dart installieren.

1. Wenn Sie keine offenen Projekte haben, wählen Sie auf der Startseite Start a new Flutter app (Neue Flutter-App starten) aus. Wählen Sie andernfalls File > New > New Flutter Project (Datei > Neu > Neues Flutter-Projekt) aus.
2. Wählen Sie Flutter Application (Flutter-Anwendung) als Projekttyp aus und klicken Sie auf Next (Weiter).
3. Prüfen Sie, ob der Flutter SDK-Pfad den Speicherort des SDKs angibt. Wählen Sie SDK installieren aus, wenn das Textfeld leer ist.
4. Geben Sie den Projektnamen ein und klicken Sie auf Weiter.
5. Verwenden Sie den von Android Studio vorgeschlagenen Standardpaketnamen und klicken Sie auf Weiter.
6. Klicken Sie auf Fertig.
7. Warten Sie, bis das SDK in Android Studio installiert und das Projekt erstellt wurde.

3. Firebase-Projekt erstellen und einrichten

Um mit Firebase zu beginnen, müssen Sie ein Firebase-Projekt erstellen und einrichten.

Firebase-Projekt erstellen

1. Melden Sie sich in Firebase an.

Klicken Sie in der Firebase Console auf „Projekt hinzufügen“ (oder „Projekt erstellen“) und geben Sie Ihrem Firebase-Projekt den Namen „Firebase-Flutter-Ads“ oder einen beliebigen anderen Namen.

2. Klicken Sie sich durch die Optionen zur Projekterstellung. Akzeptieren Sie die Firebase-Nutzungsbedingungen, wenn Sie dazu aufgefordert werden. Sie sollten Google Analytics für dieses Projekt aktivieren, da Sie Google Analytics-Ereignisse benötigen, um Aktionsereignisse zu erfassen und Conversions zu analysieren.

Weitere Informationen zu Firebase-Projekten

4. Plattformspezifische Firebase-Konfiguration (Android)

Android konfigurieren

1. Wählen Sie in der Firebase Console im linken Navigationsbereich Projektübersicht aus und klicken Sie dann unter „Fügen Sie Firebase zu Ihrer App hinzu, um zu beginnen“ auf die Schaltfläche Android.

Das Dialogfeld, das auf dem folgenden Bildschirm zu sehen ist, wird angezeigt.

2. Der wichtige Wert, den Sie angeben müssen, ist der Android-Paketname, den Sie im nächsten Schritt erhalten.

Tipp: Weitere Informationen zu Paket- und Anwendungs-IDs finden Sie unter Anwendungs-ID festlegen.

3. Öffnen Sie im Verzeichnis Ihrer Flutter-App die Datei android/app/src/main/AndroidManifest.xml.
4. Suchen Sie im manifest-Element den Stringwert des Attributs package. Dieser Wert ist der Android-Paketname (z. B. com.yourcompany.yourproject). Kopieren Sie diesen Wert.
5. Fügen Sie im Firebase-Dialogfeld den kopierten Paketnamen in das Feld Android package name ein.
6. Der SHA‑1-Schlüssel ist hier nicht erforderlich, es sei denn, Sie möchten Google Sign-in oder Firebase Dynamic Links verwenden. Diese sind jedoch nicht Teil dieses Codelabs. Wenn Sie in_app_purchase-Daten aus Google Play importieren möchten, müssen Sie den Schlüssel später festlegen.
7. Klicken Sie auf App registrieren.
8. Folgen Sie in Firebase der Anleitung, um die Konfigurationsdatei google-services.json herunterzuladen.

9. Wechseln Sie zum Verzeichnis Ihrer Flutter-App und verschieben Sie die Datei google-services.json (die Sie gerade heruntergeladen haben) in das Verzeichnis android/app.
10. Überspringen Sie die verbleibenden Schritte und kehren Sie zur Hauptseite der Firebase Console zurück.
11. Schließlich benötigen Sie das Gradle-Plug-in für Google-Dienste, um die von Firebase generierte google-services.json-Datei zu lesen.
12. Öffnen Sie android/app/build.gradle in Ihrer IDE oder Ihrem Editor und fügen Sie die folgende Zeile als letzte Zeile in die Datei ein:

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

13. Öffnen Sie android/build.gradle und fügen Sie im Tag buildscript eine neue Abhängigkeit hinzu:

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

14. Wenn Ihre App noch ausgeführt wird, schließen Sie sie und erstellen Sie sie neu, damit Gradle die Abhängigkeiten installieren kann.

Sie haben Ihre Flutter-App für Android konfiguriert. Für iOS können Sie sich dieses Codelab ansehen: Informationen zu Firebase für Flutter.

5. Firebase Analytics in Flutter konfigurieren

In diesem Schritt verwenden Sie das Firebase Analytics-Paket mit dem Namen firebase_analytics, das Firebase Analytics-Funktionen enthält.

In der pubspec-Datei werden die Assets für eine Flutter-App verwaltet. Hängen Sie in pubspec.yaml firebase_analytics: ^6.2.0 (firebase_analytics 6.2.0 oder höher) an die Liste der Abhängigkeiten an :

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

Klicken Sie in der Editoransicht von Android Studio auf Packages get (Pakete abrufen), während Sie die pubspec-Datei ansehen. Dadurch wird das Paket in Ihr Projekt aufgenommen. In der Konsole sollte Folgendes angezeigt werden:

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

Wenn Sie Pub get ausführen, wird auch automatisch die Datei pubspec.lock mit einer Liste aller in das Projekt aufgenommenen Pakete und deren Versionsnummern generiert.

Achtung:Bei bestimmten Firebase-Versionen wird java.lang.IllegalArgumentException: Service not registered angezeigt, wenn die Klasse FirebaseAnalytics zum ersten Mal initialisiert wird (siehe GitHub-Problem 1662)..

Importieren Sie in lib/main.dart das neue Paket:

import 'package:firebase_analytics/firebase_analytics.dart';

Initialisieren Sie in der Klasse MyApp das FirebaseAnalytics-Objekt, indem Sie den Konstruktor aufrufen.

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

Sie können jetzt benutzerdefinierte Ereignislogs auslösen.

6. Benutzerdefinierte Ereignisse mit Firebase Analytics protokollieren

Wenn Sie eine neue Vorlage in der Flutter-App generieren, sehen Sie eine _counter-Variable und die _incrementCounter()-Methode in der Standardklasse State. Sie möchten jetzt benutzerdefinierte Ereignisse protokollieren, wenn die Schaltfläche zum Erhöhen mehr als fünfmal von übereifrigen Nutzern angeklickt wird. Später starten wir eine App-Kampagne, um potenzielle Nutzer anzusprechen.

Zuerst müssen wir die initialisierten Analyseobjekte an das Stateful-Widget übergeben. Zuerst fügen wir dem MyHomePage-Konstruktor einen Analyseparameter hinzu.

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

Außerdem fügen Sie beim Aufrufen des Konstruktors einen Analyseparameter hinzu.

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

Jetzt können Sie Ereignisse ganz einfach mit der Methode logEvent() protokollieren. Fügen Sie die Methode hinzu und erhöhen Sie die Variable _counter.

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

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

 });
}

Ihre App kann jetzt das benutzerdefinierte Ereignisprotokoll auslösen.

Sie können auch vordefinierte Methoden zum Auslösen von Ereignissen verwenden.

Jetzt ist alles bereit. Führen Sie in Android Studio „main.dart“ aus.

(Optional) Zusätzliche Informationen mit Parametern an Firebase Analytics senden

Sie können zusätzliche Informationen über Parameter senden. Benutzerdefinierte Parameter können für Berichte in Ihren Analytics-Berichten registriert werden. Sie können auch als Filter in Zielgruppendefinitionen verwendet werden, die auf jeden Bericht angewendet werden können. Wenn Ihre App mit einem BigQuery-Projekt verknüpft ist, sind benutzerdefinierte Parameter auch in BigQuery verfügbar (siehe BigQuery Export für Firebase).

Hier legen wir den Wert _counter als Parameter fest.

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

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

Ereignisse prüfen und Fehler beheben

Nach einigen Stunden können Sie die protokollierten Ereignisse in der Firebase Console sehen. Klicken Sie dazu einfach in der Firebase Console im Analytics-Bereich auf den Tab Ereignisse. Sie können die Werte im Ereignis clicked_counter auch aufrufen, indem Sie einfach auf das Ereignis klicken.

Markieren Sie clicked_counter als Conversion, indem Sie den Schalter Als Conversion markieren nach rechts schieben.

Wenn das Ereignis auf dem Tab „Conversions“ zu sehen ist, haben Sie es erfolgreich als Conversion markiert. Dieses Ereignis kann jetzt in Google Ads aus Firebase importiert werden.

Verwenden Sie Firebase DebugView zur Fehlerbehebung. Weitere Informationen finden Sie unter Ereignis debuggen.

7. Analytics-Ereignisse in Google Ads importieren

Sobald die Einrichtung von Firebase-Flutter abgeschlossen ist, können Sie die App-Kampagnen mit Aktionsereignissen starten. Verknüpfen Sie zuerst Firebase mit Google Ads. Wenn Sie Firebase mit Google Ads verknüpfen,können Firebase-Ereignisse in App-Kampagnen importiert werden. Außerdem können App-Kampagnen so optimiert werden, da mehr Informationen über die Zielgruppen verfügbar sind.

1. Klicken Sie neben Projektübersicht auf den Button, um die Firebase-Einstellungen aufzurufen.
2. Auf dem Tab Integrationen sehen Sie Google Ads und die Schaltfläche Verknüpfen. Klicken Sie auf Verknüpfen und dann auf Weiter.

3. Wählen Sie ein Google Ads-Konto aus.

Achtung:Wenn das Zielereignis nicht als Conversion-Ereignis markiert ist, kann es nicht in Google Ads importiert werden. Prüfen Sie, ob das Ereignis korrekt als Conversion markiert ist.

Der Firebase-Teil ist jetzt abgeschlossen.

Rufen Sie Google Ads auf.

1. Melden Sie sich an und rufen Sie Tools und Einstellungen > Analyse > Conversions auf, um benutzerdefinierte Ereignisse als Conversions zu importieren.
2. Klicken Sie auf das +, um neue Conversion-Aktionen hinzuzufügen.

3. Wählen Sie Google Analytics 4-Properties (Firebase) aus und klicken Sie auf Weiter.

4. Sie sehen alle Analytics-Ereignisse, die als Conversions markiert sind. Suchen Sie nach dem clicked_counter-Ereignis, das wir zuvor implementiert haben.

5. Klicken Sie das Kästchen neben der Aktion an, klicken Sie auf Importieren und dann auf Weiter.

Nachdem Sie clicked_counter als Conversion-Aktion festgelegt haben, können Sie Aktionskampagnen starten, mit denen Sie Nutzer ansprechen, die das Ereignis clicked_counter wahrscheinlich mehr als fünfmal auslösen.

8. App-Aktionskampagnen mit importierten Ereignissen starten

Wichtig: Damit Sie eine App-Kampagne starten können, benötigen Sie eine App in der Produktionsphase bei Google Play. Wenn Sie noch nicht bereit für die Veröffentlichung sind, können Sie diesen Schritt jetzt überspringen.

6. Rufen Sie den Tab „Kampagne“ Ihres aktuellen Kontos auf und starten Sie eine neue Kampagne, indem Sie auf die Schaltfläche + klicken. Klicken Sie auf [Neue Kampagne] und dann auf Weiter.
7. Starten Sie eine App-Werbekampagne mit der Option App-Installationen.

8. Suchen Sie nach Ihrer App, indem Sie den App-Namen, den Paketnamen oder den Publisher eingeben.
9. Wählen Sie im Bereich Gebote im Drop-down-Menü die Option In-App-Aktionen aus.
10. Suchen Sie in der Liste nach Ihrem benutzerdefinierten Ereignis. Legen Sie den Ziel-CPA (Cost-per-Action) fest und füllen Sie alle zusätzlichen Optionen aus.

11. Schließen Sie die Kampagneneinstellungen ab.

9. Glückwunsch

Herzlichen Glückwunsch! Sie haben Firebase und Google Ads erfolgreich verknüpft. So können Sie die Kampagnenleistung mit importierten Firebase-Ereignissen steigern.

Sie haben gelernt

• Firebase Analytics für Flutter konfigurieren
• Benutzerdefinierte Ereignisse mit Firebase Analytics in der Flutter-App erfassen
• Ereignisse importieren und für aktionsfördernde Kampagnen verwenden