Dieser Artikel zeigt Ihnen, wie Sie den Google Tag Manager auf Ihrer Website einrichten. Weitere Informationen zum Erstellen von GA4-Tags im Google Tag Manager finden Sie in der Dokumentation von Google.
Google Analytics 4 ersetzt Universal Analytics. Am 1. Juli 2023 werden alle standardmäßigen Universal Analytics-Eigenschaften die Verarbeitung neuer Treffer einstellen. 360 Universal Analytics-Eigenschaften werden die Verarbeitung neuer Treffer am 1. Juli 2024 einstellen. Informationen zur Migration finden Sie unter Umstellung auf Google Analytics 4.
Dieser Artikel folgt nicht genau den Anweisungen von Google, wurde aber getestet und funktioniert. Die Anweisungen von Google wurden aus den folgenden Gründen geändert:
- Google bittet Sie, den Code im
<head>der Website zu installieren. Diese Vorgehensweise ist allerdings schlecht für die Seitengeschwindigkeit, da dadurch das Laden der Website verlangsamt wird. Aus diesem Grund platzieren wir den Code unten in<body-end>, sodass er zuletzt geladen wird. - Hinweis
Wir empfehlen, den Code im
<body-end>zu platzieren, da Google Tag Manager zwar asynchron lädt, das Problem beim asynchronen Laden jedoch darin besteht, dass er trotzdem mit dem Herunterladen von Ressourcen und der Ausführung von Code beginnt. Diese Aktivität konkurriert mit anderen Ressourcen auf dem Smartphone/Computer um Bandbreite, Prozessorauslastung und mehr. Wenn Sie den Code im<head>platzieren, geben Sie ihm immer noch Vorrang vor anderen Ressourcen, die der Browser möglicherweise herunterladen möchte, wie z. B.: Styling und Layout der Website, Hauptinhalte, Bilder, die sich im oberen Bereich der Seite befinden, und mehr.Duda hat immer wieder festgestellt, dass Websites, die den GTM-Code im
<head>platzieren, schlechter abschneiden als solche, die das nicht tun. Wir haben unsere Website optimiert, um sichtbare Inhalte in Übereinstimmung mit Core Web Vitals und den zugehörigen Kennzahlen von FCP und LCP zu priorisieren. - Es ist einfacher, den Code an eine einzige Stelle zu kopieren.
Google Tag Manager hinzufügen
Google wird Ihnen Einbettungs-Codes bereitstellen, die wie die folgenden Beispiele aussehen. Beide müssen unter < body-end> auf der Website installiert werden. Um das <body-end> der Website zu finden, klicken Sie in der Seitenleiste des Editors auf Einstellungen und dann auf Head HTML.
Der folgende Code ist nur ein Beispiel. Kopieren Sie ihn nicht direkt in Ihre Website. Bitte stellen Sie sicher, dass Sie den richtigen Code von Google erhalten.
Script-Abschnitt |
|---|
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXX');</script>
<!-- End Google Tag Manager --> |
NoScript-Abschnitt |
<!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> |
Google Tag Manager einrichten
Dieser Schritt ist entscheidend, damit das Tracking durch den Google Tag Manager auf Ihrer Website funktioniert.
Als Nächstes müssen wir den Standard-Trigger der Seitenanzeige „Alle Seiten“ durch unser benutzerdefiniertes Ereignis ersetzen. Im Tag-Manager müssen wir zunächst den Trigger für benutzerdefinierte Ereignisse erstellen:
- Gehen Sie zum Google Tag Manager und melden Sie sich an.
- Klicken Sie auf der linken Seite auf Trigger.
- Klicken Sie auf der rechten Seite auf die Schaltfläche new (neu).
- Geben Sie oben links einen Namen für den Trigger ein. Wir empfehlen einen einprägsamen und hilfreichen Namen wie Benutzerdefinierter Trigger für die Seitenaufrufe.
- Klicken Sie auf das Feld für die Konfiguration eines benutzerdefinierten Triggers und wählen Sie Custom Event (Benutzerdefiniertes Ereignis).
- Geben Sie in das Feld für den Ereignisnamen dPageView ein.
- Klicken Sie im Tag Manager auf save (speichern).
Nachdem wir den Trigger erstellt haben, müssen wir ihn auf die gewünschten Tags anwenden. Dieser Vorgang muss für jedes Tag durchgeführt werden, das Sie auf der Website verwenden, um Ereignisse für Seitenaufrufe auszulösen. In diesem Beispiel wenden wir es für Google Analytics Universal an. Google Analytics 4 ist jedoch die neueste Version, deren Verwendung wir Ihnen empfehlen. Weitere Informationen zum Erstellen und Anwenden von Triggern auf GA4-Tags im Google Tag Manager finden Sie in der Dokumentation von Google.
- Gehen Sie im Tag Manager zu Tags.
- Erstellen Sie ein neues Tag.
- Geben Sie einen einprägsamen Namen ein.
- Klicken Sie auf das Feld Tag Configuration (Tag-Konfiguration) und wählen Sie das gewünschte Tag aus. In diesem Fall ist es Google Analytics Universal.
- Klicken Sie nach der Einrichtung des Tags auf das Feld Triggering. Wählen Sie den benutzerdefinierten Trigger aus, den wir mit dem Namen „Benutzerdefinierter Trigger für die Seitenaufrufe“ erstellt haben.
- Wählen Sie eine neue Variable aus.
- Wählen Sie Google Analytics-Einstellungen.
- Geben Sie Ihre GA-Tracking-ID ein und tragen Sie oben einen Namen für Ihre Variable ein.
- Wählen Sie die Variable aus und klicken Sie auf Save (Speichern).
Wenn der Trigger „Alle Seiten“ bereits angewendet wurde, löschen Sie ihn bitte. Wir brauchen nur den benutzerdefinierten Trigger.
Nachdem Sie diese Änderungen am Tag Manager vorgenommen haben, klicken Sie auf Submit (Absenden) und dann auf Publish (Veröffentlichen), um die Änderungen für die Live-Einstellungen zu veröffentlichen.
Hinweise zum Google Tag Manager
- Dieser Code wird nur auf der veröffentlichten Live-Website ausgeführt. Sie sollten ihn unbedingt mit der Live-Version testen.
- Wir haben umfangreiche Tests durchgeführt und der Abschnitt
body-end.htmlim Entwicklermodus funktioniert für das Hinzufügen des NoScript-Codes und des Standardcodes. - Bitte ändern Sie nicht die „dataLayer“-Einstellung im Google Tag Manager. Das würde unseren benutzerdefinierten Integrationscode zerstören.