Single Page Applications (SPAs) ermöglichen es Ihren Nutzern, verschiedene Seiten auf Ihrer Website zu besuchen, ohne die Seite komplett neu laden zu müssen. In den meisten Fällen ändert eine SPA-Website die URL im Browser, auch wenn die Seite nicht neu geladen wird.
Standardmäßig ist Hotjar in der Lage, diese SPA-URL-Änderungen automatisch zu erkennen und zu verfolgen. Wenn jedoch ein Benutzer eine neue Seite auf Ihrer SPA-Site besucht und sich die URL nicht ändert oder Fragmente zur URL hinzugefügt werden, die von Hotjar verfolgt werden müssen, müssen Sie möglicherweise Ihre Hotjar-Einstellungen aktualisieren, um sicherzustellen, dass Hotjar Änderungen des Seitenstatus korrekt verfolgt.
In diesem Artikel werden die folgenden Punkte behandelt:
- Welche Optionen gibt es für die Verfolgung von URL-Änderungen?
- Wie passe ich die Einstellungen für die Verfolgung von URL-Änderungen an?
- Tipps zur Fehlerbehebung für Single Page Applications
Welche Optionen gibt es für die Verfolgung von URL-Änderungen?
Es gibt drei Optionen für die Behandlung von URL-Änderungen:
- Änderungen automatisch verfolgen, ohne Fragmente (Standard)
- Änderungen automatisch verfolgen, einschließlich Fragmente
- Änderungen manuell verfolgen
Änderungen automatisch verfolgen, ohne Fragmente (Standardeinstellung)
Mit dieser Einstellung überwacht Hotjar die URL-Adressleiste auf Änderungen an der Seiten-URL, mit Ausnahme von Fragmenten oder Query-Strings.
Wenn ein Benutzer zum Beispiel von www.example.com zu www.example.com/about wechselt, würde Hotjar dies als Seitenwechsel zählen. Wenn der Benutzer von www.example.com zu www.example.com#heading1 wechselt, würde Hotjar dies nicht als Änderung erfassen.
Änderungen automatisch verfolgen, einschließlich Fragmente
Viele Websites verwenden Fragmente (dargestellt durch ein #-Zeichen), um Änderungen des Seitenstatus anzuzeigen. Dies ist bei Single-Page Applications (SPAs) üblich.
Nehmen wir zum Beispiel an, Sie hätten eine Anwendung, die verschiedene Seiten mit einem Fragment darstellt. Die URL könnte etwa so aussehen: app.example.com#profile. Standardmäßig würde Hotjar den Wechsel zu #profile nicht als URL-Änderung erkennen. In diesem Fall sollten Sie die Option Änderungen automatisch verfolgen, einschließlich Fragmente, auswählen.
Die beiden folgenden Änderungen würden mit dieser Einstellung nachverfolgt:
Änderungen manuell verfolgen
Einige Single-Page-Apps ändern die URL-Adressleiste überhaupt nicht, haben aber dennoch unterschiedliche Seiten. In diesem Fall müssen Sie Hotjar manuell mitteilen, wenn eine Routenänderung stattgefunden hat, indem Sie Event mit JavaScript an Hotjar weitergeben.
Wenn diese Option aktiviert ist, registriert Hotjar diese JavaScript-Event als Seitenwechsel. Außerdem werden URL-Änderungen durch Neuladen der Seite weiterhin verfolgt.
Der Code, der benötigt wird, um einen manuellen Seitenwechsel zu erzeugen, sieht wie folgt aus:
hj('stateChange', 'some/relative/path');Der Code muss zu jeder Seite hinzugefügt werden, die im Routing-Code Ihrer Anwendung als neue Seite betrachtet wird. Das zweite Argument kann eine relative oder vollständige URL sein.
Manuelle Zustandsänderungen sollten mit jeder Front-End-JavaScript-Bibliothek kompatibel sein. Hier ist ein Beispiel für den Code in AngularJS (1.X) ui-router:
angular.module('yourApp', []).run([
'$rootScope',
function ($rootScope, ...) {
...
// Richtet den Router ein, um Zustandsänderungen an das Hotjar-Skript zu melden.
$rootScope.$on('$stateChangeSuccess',function () {
hj('stateChange', $location.url());
});
...
}
]);Der obige Code ist nur ein Beispiel. Da verschiedene SPAs mit unterschiedlichen Frameworks erstellt werden, ist es nicht möglich, Beispielcode für alle möglichen Websites zu verwenden. Wir empfehlen, mit einem Entwickler zusammenzuarbeiten, um alle Codeänderungen auf Ihrer Website zu implementieren.
Wie kann ich die Einstellungen für die Verfolgung von URL-Änderungen anpassen?
Die folgenden Schritte zeigen, wie Sie die Einstellungen für die Nachverfolgung von URL-Änderungen aktualisieren können.
Klicken Sie auf Einstellungen, dann auf Websites & Organisationen.
Klicken Sie auf das Einstellungssymbol, um die Site-Einstellungen für die Site zu öffnen, die Sie ändern möchten.
Wählen Sie unter Session Targeting & Tracking die Tracking-Option, die für Ihre Site am besten geeignet ist.
Klicken Sie auf Änderungen speichern.
Tipps zur Fehlerbehebung für Single Page Applications
Fast alle Probleme, die bei Single Page Application (SPA) Sites auftreten, lassen sich mit einer oder mehreren der folgenden Lösungen beheben:
- Senden Sie Statusänderungen manuell an Hotjar und stellen Sie das URL-Tracking idealerweise auf manuell um.
- Wenn Sie Event oder Benutzerattribute für das Targeting verwenden, senden Sie das Ereignis oder Benutzerattribut an jede Route, auf der es wirksam werden soll (eine Route ist im Wesentlichen dasselbe wie eine "Seite" bei SPAs).
- Wenn Sie irgendeine Art von automatischem URL-Tracking verwenden wollen, richten Sie Ihre Tools nur auf URLs aus (anstatt auf Event oder Benutzerattribute) oder führen Sie einen der oben genannten Schritte aus.
- Ziehen Sie die automatische Nachverfolgung mit Fragmenten in Betracht, wenn Ihre Website Fragmente oder Abfragen für URL-Änderungen verwendet. Verwenden Sie dies auf jeden Fall, wenn Sie diese Abfragen/Fragmente in Ihre Targeting-Kriterien einbeziehen.