Single-Page-Anwendungen mit Google Tag Manager analysieren

In dieser Anleitung erfahren Sie, wie Sie die Google Analytics-Messung für eine Single-Page-Anwendung (SPA) mit Google Tag Manager einrichten. Sie lernen, wie Sie Ihre Google Analytics-Property konfigurieren, die erforderlichen GTM-Variablen aktivieren und Tags erstellen, die bei Verlaufsänderungen ausgelöst werden.

Hinweis

Für diese Anleitung wird Folgendes vorausgesetzt:

• Ein Google Analytics-Konto und eine Google Analytics-Property.
• Ein Google Tag Manager Container, der in Ihrer SPA installiert ist.
• Mindestens die Rolle „Bearbeiter“ für Google Analytics und Google Tag Manager.

Schritt 1: GA4-Datenstream vorbereiten

Wenn Sie page_view-Ereignisse in einer SPA manuell erfassen möchten, müssen Sie zuerst automatische seitenverlaufsbasierte Seitenaufrufe in GA4 deaktivieren, um doppelte Zählungen zu vermeiden.

1. Öffnen Sie Google Analytics.
2. Klicken Sie auf der Seite Verwaltung unter Datenerhebung und ‑änderung auf Daten streams.
3. Wählen Sie Ihren Web-Datenstream aus.
4. Klicken Sie unter Optimierte Analysen auf das Einstellungssymbol .
5. Deaktivieren Sie unter Seitenaufrufe > Erweiterte Einstellungen anzeigen die Option Seitenänderungen basierend auf Browserverlaufsereignissen.
6. Klicken Sie auf Speichern.

Schritt 2: Integrierte Verlaufsvariablen in Tag Manager aktivieren

Wenn Sie verlaufsbasierte Trigger oder Variablen in GTM verwenden möchten, müssen Sie zuerst die integrierten Verlaufsvariablen aktivieren.

1. Öffnen Sie Google Tag Manager.
2. Gehen Sie in Ihrem Arbeitsbereich zu Variablen.
3. Klicken Sie unter Integrierte Variablen auf Konfigurieren.
4. Aktivieren Sie im Bereich Verlauf die folgenden Variablen:
   • History New URL Fragment
   • History Old URL Fragment
   • History New State
   • History Old State
   • History Source
5. Schließen Sie den Konfigurationsbereich.

Hinweis: Diese Variablen sind für die grundlegende Einrichtung von Seitenaufrufen nicht unbedingt erforderlich. Sie werden nur verwendet, wenn Sie den Trigger filtern oder benutzerdefinierte Logik implementieren möchten, z. B. die Logik für die vorherige Seite, die im letzten Hinweis auf dieser Seite erwähnt wird.

Hinweis: In älterer Dokumentation werden möglicherweise Old History URL oder New History URL verwendet. Dies sind keine standardmäßigen integrierten Variablen. Verwenden Sie stattdessen die aufgeführten Variablen.

Schritt 3: Trigger für Verlaufsänderungen erstellen

Erstellen Sie als Nächstes einen Trigger, der immer dann ausgelöst wird, wenn in Ihrer SPA ein Ereignis für Verlaufsänderungen (z. B. pushState oder replaceState) auftritt.

1. Gehen Sie in Ihrem Tag Manager-Arbeitsbereich zum Menü Trigger.
2. Klicken Sie auf Neu.
3. Wählen Sie unter Triggerkonfiguration den Trigger Verlaufsänderung aus.
4. (Optional) Wenn Sie nur bestimmte Bildschirmänderungen erfassen möchten, aktualisieren Sie den Trigger so, dass er bei Einigen Verlaufsänderungen ausgelöst wird.
5. Geben Sie einen Namen für den Trigger ein (z.B. „Verlaufsänderung“) und klicken Sie auf Speichern.

Schritt 4: Google-Tag erstellen

Erstellen Sie jetzt ein Google-Tag, das den Parameter page_location aktualisiert, wenn eine Verlaufsänderung auftritt.

1. Klicken Sie im Menü Tags auf Neu.
2. Wählen Sie unter Tag-Konfiguration die Option Google-Tag aus.
3. Geben Sie Ihre Tag-ID ein (dieselbe ID, die Sie für Ihr ursprüngliches Google-Tag verwendet haben).

4. Fügen Sie unter Konfigurationseinstellungen die folgenden Parameter hinzu:

   • page_location: {{Page URL}}
   • page_title: {{Page Title}}
   • update: true
   Hinweis: Mit dem update Parameter werden die Konfigurationswerte in die vorhandene Tag-Konfiguration zusammengeführt und ein sofortiges doppeltes page_view-Ereignis unterdrückt. page_referrer ist hier nicht enthalten, da Google Analytics den ursprünglichen externen Referrer beim ersten Laden der Seite automatisch erfasst. Wenn Sie ihn weglassen, kann Google Analytics die URL der vorherigen virtuellen Seite automatisch als Referrer für den Navigationspfad in Ihren Berichten verwenden.

5. Geben Sie einen Namen für das Tag ein (z. B. „Google-Tag – SPA-Update“) und klicken Sie auf Speichern.

   Hinweis: Fügen Sie für dieses Google -Tag im Bereich Trigger keinen Trigger hinzu. Es wird im Schritt 5 als Einrichtungstag mithilfe der Tag-Reihenfolge ausgelöst.

Schritt 5: Virtuelles page_view-Ereignis senden

Erstellen Sie abschließend ein GA4-Ereignis-Tag, um das tatsächliche page_view-Ereignis für jeden virtuellen Seitenaufruf zu senden.

1. Klicken Sie im Menü Tags auf Neu.
2. Wählen Sie unter Tag-Konfiguration die Option Google Analytics: GA4-Ereignis aus.
3. Geben Sie Ihre Mess-ID ein.
4. Legen Sie für Ereignisname den Wert page_view fest.
5. Wählen Sie unter Erweiterte Einstellungen > Tag-Reihenfolge die Option Tag vor GA4-Ereignis – Virtueller Seitenaufruf auslösen aus und wählen Sie das Tag Google-Tag – SPA-Update aus, das Sie in Schritt 4 erstellt haben.
6. Wählen Sie unter Trigger den Trigger Verlaufsänderung aus, den Sie in Schritt 3 erstellt haben.
7. Geben Sie einen Namen für das Tag ein (z. B. „GA4-Ereignis – Virtueller Seitenaufruf“) und klicken Sie auf Speichern.

Schritt 6: Einrichtung überprüfen

So prüfen Sie, ob Ihre virtuellen Seitenaufrufe korrekt erfasst werden:

1. Klicken Sie in Tag Manager auf Vorschau, um den Vorschau modus aufzurufen.
2. Navigieren Sie durch Ihre SPA.
3. Prüfen Sie in Google Analytics DebugView, ob für jede Bildschirmänderung ein neues page_view Ereignis angezeigt wird.
4. Prüfen Sie, ob die page_location-Werte Ihren Erwartungen entsprechen.

Hinweis: Mit dem Standardwert {{Referrer}} wird die ursprüngliche Quelle erfasst, über die der Nutzer auf Ihre Website gelangt ist. Wenn Sie die vorherige virtuelle Seite in Ihrer SPA als Referrer erfassen möchten, müssen Sie eine benutzerdefinierte GTM-Variable implementieren, um den vorherigen Seitenstandort zu speichern.