Diese Anleitung behandelt alle Möglichkeiten, wie Sie Zenovay-Tracking auf Ihrer Website installieren können.
Tracking-Code finden
Zunächst erhalten Sie Ihren eindeutigen Tracking-Code:
- Melden Sie sich bei Ihrem Zenovay-Dashboard an
- Öffnen Sie Domains und wählen Sie die Website aus, die Sie verfolgen möchten
- Öffnen Sie die Einstellungen der Website und gehen Sie zur Registerkarte General
- Kopieren Sie das Skript aus dem Bereich Tracking Script
Ihr Tracking-Code ist ein eindeutiger 12-stelliger Bezeichner (z. B. aB3xYz9kLm2P). Er ist im Script-Snippet eingebettet, das Sie kopieren, sodass Sie ihn normalerweise nicht separat behandeln müssen.
Installationsmethoden
Die einfachste Möglichkeit, Tracking hinzuzufügen, ist mit einem Script-Tag. Fügen Sie diesen Code in den <head>-Bereich Ihrer Website ein:
<script
defer
src="https://api.zenovay.com/z.js"
data-tracking-code="YOUR_TRACKING_CODE"
></script>
Ersetzen Sie YOUR_TRACKING_CODE durch Ihren tatsächlichen Tracking-Code aus dem Dashboard.
Für React oder andere SPA-Frameworks fügen Sie das gleiche Script-Tag in Ihr index.html oder Root-Layout ein:
<script defer
data-tracking-code="YOUR_TRACKING_CODE"
src="https://api.zenovay.com/z.js"
></script>
Verwenden Sie dann die globale zenovay-Funktion in Ihren Komponenten:
// Nachverfolgung benutzerdefinierter Events nach dem Skriptladung
function handleSignup() {
zenovay('track', 'signup_click', { plan: 'pro' });
}
Für Next.js fügen Sie das Skript in Ihren _app.tsx oder layout.tsx ein:
import Script from 'next/script'
export default function RootLayout({ children }) {
return (
<html>
<head>
<Script
defer
src="https://api.zenovay.com/z.js"
data-tracking-code="YOUR_TRACKING_CODE"
/>
</head>
<body>{children}</body>
</html>
)
}
Wenn Sie mit einem Bundler arbeiten, installieren Sie stattdessen das npm-Paket @zenovay/tracker. Das Wire-Format ist identisch mit der Script-Tag-Installation.
npm install @zenovay/tracker
import { init, track } from '@zenovay/tracker';
init('YOUR_TRACKING_CODE');
// Aus einer Komponente oder einem Handler:
track('Signup clicked', { source: 'hero' });
Jetzt verfügbar als @zenovay/tracker v0.1.0+. Sowohl diese Methode als auch die Script-Tag-Registerkarten darüber werden vollständig unterstützt — wählen Sie, was am besten zu Ihrem Stack passt.
Script-Optionen
Sie können das Tracking-Verhalten mit zusätzlichen Daten-Attributen anpassen:
| Attribut | Beschreibung | Standard |
|---|---|---|
data-tracking-code | Ihr eindeutiger Tracking-Code (erforderlich) | - |
data-api-url | Benutzerdefinierte API-Endpunkt-URL | https://api.zenovay.com |
data-debug | Debug-Modus in der Konsole aktivieren | false |
data-ignore-dnt | Do Not Track überschreiben um zu verfolgen | false |
data-allow-localhost | Tracking auf localhost aktivieren | false |
data-heartbeat | Periodische Heartbeat-Pings senden | true |
data-track-outbound | Ausgehende Link-Klicks verfolgen | false |
data-silent | Alle Konsolenausgabe unterdrücken | false |
DNT (Do Not Track) und GPC (Global Privacy Control) werden standardmäßig beachtet. Sie benötigen kein Attribut, um dies zu aktivieren. Verwenden Sie data-ignore-dnt="true" nur, wenn Sie dieses Verhalten überschreiben müssen. Andere Datenschutzeinstellungen wie IP-Anonymisierung und Datenschutzmodus werden in Settings im Dashboard konfiguriert.
Beispiel mit Optionen
<script
defer
src="https://api.zenovay.com/z.js"
data-tracking-code="YOUR_TRACKING_CODE"
data-debug="true"
></script>
First-Party-Tracking
Scale PlanFür Werbeblocker-resistentes Tracking richten Sie das Skript von Ihrer eigenen Domain aus bereit. Die CNAME-Einrichtung unten erfordert einen Scale- oder Enterprise-Plan:
CNAME-Datensatz hinzufügen
Fügen Sie einen CNAME-DNS-Datensatz hinzu, der eine Subdomain (z. B.
analytics.yourdomain.com) aufproxy.zenovay.comverweist.Script-URL aktualisieren
Ändern Sie die Script-Quelle, um Ihre Subdomain zu verwenden:
<script defer src="https://analytics.yourdomain.com/z.js" data-tracking-code="YOUR_TRACKING_CODE" ></script>Auf DNS-Propagation warten
DNS-Änderungen können bis zu 48 Stunden für vollständige Propagation benötigen.
First-Party-Tracking hilft sicherzustellen, dass Ihre Analysen funktionieren, auch wenn Besucher Werbeblocker oder Datenschutzerweiterungen verwenden.
Verifikation der Installation
Nach dem Hinzufügen des Skripts:
- Öffnen Sie Ihre Website in einem neuen Browser-Tab
- Öffnen Sie Browser DevTools (F12) und gehen Sie zur Network-Registerkarte
- Filtern Sie nach "zenovay" oder "tracker"
- Sie sollten Anfragen an die Zenovay-API sehen
Oder öffnen Sie das Dashboard Ihrer Website und wählen Sie die Registerkarte Live View, um Ihren Besuch in Echtzeit zu sehen.
Fehlerbehebung
Skript wird nicht geladen?
- Stellen Sie sicher, dass das Skript im
<head>-Bereich ist - Überprüfen Sie auf JavaScript-Fehler in der Browser-Konsole
- Überprüfen Sie, dass Ihr Tracking-Code korrekt ist
- Stellen Sie sicher, dass es keine Content Security Policy (CSP) Probleme gibt
Nächste Schritte
- Überprüfen Sie Ihre Installation, um sicherzustellen, dass alles funktioniert
- Verfolgen Sie benutzerdefinierte Events für wichtige Nutzeraktionen
- Richten Sie Ziele ein, um Konversionen zu messen