Google Analytics Tracking Code auf AMP-Seiten in WordPress einbinden
- Code für functions.php & Plugin -Nachfolgend erhältst du 2 Möglichkeiten an die Hand, mit welchen du Google Analytics korrekt und valide in deine AMP-Seiten in WordPress einbinden kannst.
Jetzt lesenDieser Beitrag zeigt Dir, wie Du den Google Analytics Tracking Code auf AMP-Seiten in Deiner WordPress-Installation richtig und nach den AMP-Richtlinien einbindest.
Voraussetzungen Deiner WordPress-Installation
Bevor wir jedoch anfangen kurz ein paar Worte zu den Voraussetzungen. Ich gehe davon aus, dass Du das AMP-Plugin von Automattic installiert und aktiviert hast. Wenn Du das noch nicht getan haben solltest, empfehle ich Dir diesen Blogeintrag von Yoast. Dort findest Du alles Wissenswerte, um mit AMP auf Deiner WordPress-Seite zu starten.
Zudem empfiehlt Google, dass man für das Tracking der AMP-Seiten eine eigene Property in seinem Google Analytics-Konto anlegt. Wenn Du nicht genau weißt wie das geht, findest Du hier eine Anleitung von Google dazu.
Als Letztes sei noch erwähnt, dass die Daten von AMP-Seiten immer über eine IP-Anonymisierung verfügen, weshalb man aus datenschutzrechtlichen Gründen nicht den Tracking-Code erweitern muss, wie das beim „normalen“ Google Analytics Tracking-Code der Fall ist.
AMP Analytics über functions.php einbinden
Bevor Du den Tracking-Code einbindest, musst Du erst das AMP Analytics Skript in den <head>-Bereich Deiner AMP-Seiten einbinden. Das geht über den amp_post_template_data Filter ganz einfach. Um das Skript einzubinden, füge folgenden Code in Deine functions.php:
1 2 3 4 5 6 7 8 | /** AMP Analytics in den head der AMP-Seiten einbinden */ function wpc_amp_script( $data ) { $data['amp_component_scripts']['amp-analytics'] = 'https://cdn.ampproject.org/v0/amp-analytics-0.1.js'; return $data; } add_filter( 'amp_post_template_data', 'wpc_amp_script' ); |
Anschließend musst Du noch den Google Analytics Tracking-Code einbinden. Das geschieht über den amp-analytics Tag, da man nicht einfach so den normalen Tracking-Code von Google Analytics einbinden kann.
Hierfür benötigst Du jetzt die Tracking ID Deiner neuen Google Analytics Property, die Du im besten Fall gerade eben erstellt hast. Mit Hilfe der amp_post_template_footer hook können wir nun den Tracking Code AMP-konform in den Footer jeder AMP-Seite einbinden.
Beachte die Zeile 9, in welcher Du Deine Tracking ID eintragen musst.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | /** amp-analytics in den Footer der AMP-Seiten einbinden */ function wpc_amp_analytics( $amp_template ) { ?> <amp-analytics type="googleanalytics"> <script type="application/json"> { "vars": { "account": "UA-XXXXX-Y" // Mit Deiner Tracking ID austauschen }, "triggers": { "trackPageview": { "on": "visible", "request": "pageview" } } } </script> </amp-analytics> <?php } add_action( 'amp_post_template_footer', 'wpc_amp_analytics' ); |
Mit diesem Code kannst du Pageviews tracken. Für Event-Tracking oder Social-Interactions kannst Du Dich auf der offiziellen Seite von Google zu dem Thema umsehen.
Plugin: AMP Analytics
Wie könnte es anders sein, gibt es zu diesem Problem auch bereits erste Plugins zum Download.
Ich habe kurz mal AMP Analytics in Version 0.0.2 installiert und die AMP-Seite wurde sowohl validiert als auch der Besuch in Google Analytics getrackt. Somit dürfte das Plugin seinen Zweck erfüllen. Viel Einstellungsmöglichkeiten gibt es nicht, Du kannst dort lediglich Deine Tracking ID hinterlegen.
Soweit ich mitbekommen habe, kann man auch über PageFrog den Analytics-Code integrieren. Wurde von mir nicht getestet, weshalb ich dazu keine Einschätzung oder Empfehlung abgeben kann. Solltest Du unter Umständen PageFrog bereits installiert haben, schau Dich in den Einstellungen um.
AMP-Seiten validieren
Über die Chrome DevTools kannst Du Deine AMP-Seite validieren und checken, ob alles in Ordnung ist.
Rufe dazu einfach Deine AMP-URL auf (einfach /amp/ ans Ende setzen) und füge an die URL noch #development=1 an (also z.B. www.deinedomain.de/url-zum-beitrag/amp/#development=1). Öffne anschließend in den Chrome DevTools die Konsole auf.
Wenn dort AMP validation successful. steht, hast Du es geschafft und Deine Seite entspricht den Richtlinien!
Ich hoffe, ich konnte Dir mit dieser kleinen Anleitung helfen und Du kannst nun erfolgreich die Besucher Deiner AMP-Seiten in Google Analytics tracken.
Hey tolles Guide. Sag mal weißt du auch wie man den Google Tag Manager per functions.php einbindet?
Gruß
Andres
Hi Andres,
Der Google Tag Manager lässt sich analog zum AMP-Tracking ebenfalls via functions.php einbinden. Das würde ungefähr so aussehen:
Wie füge ich die Anonymisierung hinzu ???
Hi Mtesa,
wie im Artikel bereits geschrieben, werden Daten aus AMP-Dokumenten immer anonymisiert übertragen.
Zitat Google: „Data from AMP documents is always IP anonymized.“
Wenn du dein „normales“ Google Analytics um die IP-Anonymisierung erweitern willst, empfehle ich dir diesen Artikel von mir: https://wpcorner.de/wordpress/google-analytics-wordpress-einbinden/
Dort steht alles beschrieben. Hauptsächlich musst du deinen Tracking-Code um folgende Zeile erweitern:
„ga(’set‘,’anonymizeIp‘,true);“