Skip to content

Commit 8093993

Browse files
committed
docs: update track-script documentation with new script attributes and examples
1 parent 418a2ae commit 8093993

7 files changed

Lines changed: 475 additions & 230 deletions

File tree

website/docs/website/track-script.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,41 @@ the script look like below:
1616

1717
you can get this script code from your **Tianji** website list
1818

19+
## Script Attributes
20+
21+
The tracker script supports the following `data-*` attributes on the `<script>` tag:
22+
23+
| Attribute | Required | Default | Description |
24+
|---|---|---|---|
25+
| `data-website-id` | **Yes** || The unique website ID for associating tracking data. The tracker will not initialize without this. |
26+
| `data-host-url` | No | Script `src` origin | The backend server URL. If omitted, it is automatically derived from the script's `src` path. |
27+
| `data-auto-track` | No | `true` | Automatically track page views and route changes. Set to `"false"` to disable. |
28+
| `data-do-not-track` | No || When set, respects the browser's Do Not Track (DNT) setting and disables tracking if DNT is enabled. |
29+
| `data-domains` | No || A comma-separated list of domains to track (e.g. `"example.com,www.example.com"`). Tracking is only active when the current hostname matches one of these domains. |
30+
31+
### Full Example
32+
33+
```html
34+
<script
35+
async
36+
defer
37+
src="https://example.com/tracker.js"
38+
data-website-id="clxxxxxxxxxxxxxxxxxx"
39+
data-host-url="https://analytics.example.com"
40+
data-auto-track="true"
41+
data-do-not-track="true"
42+
data-domains="example.com,www.example.com"
43+
></script>
44+
```
45+
46+
### Disable Tracking via localStorage
47+
48+
You can also disable tracking at runtime by setting a localStorage flag:
49+
50+
```javascript
51+
localStorage.setItem('tianji.disabled', '1');
52+
```
53+
1954
## Report Event
2055

2156
**Tianji** provide a simple way to report user click event, its easy to help you track which action user like and often to use.
Lines changed: 77 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,77 @@
11
---
22
sidebar_position: 1
3-
_i18n_hash: ef9fc0eb6072a8f037b70ff2b56e12ae
3+
_i18n_hash: 21ae6837de110e1b576fdf570bbbea6c
44
---
55
# Tracker-Skript
66

77
## Installation
88

9-
Um Website-Ereignisse zu verfolgen, müssen Sie nur ein einfaches Skript (< 2 KB) in Ihre Website einfügen.
9+
Um Website-Ereignisse zu verfolgen, müssen Sie lediglich ein einfaches Skript (< 2 KB) in Ihre Website einfügen.
1010

1111
Das Skript sieht wie folgt aus:
1212

1313
```html
14-
<script async defer src="https://<Ihre-eigene-Domain>/tracker.js" data-website-id="xxxxxxxxxxxxx"></script>
14+
<script async defer src="https://<Ihr-selbst-gehosteter-Domain>/tracker.js" data-website-id="xxxxxxxxxxxxx"></script>
1515
```
1616

17-
Sie können diesen Skript-Code aus Ihrer **Tianji**-Websiteliste erhalten.
17+
Sie können diesen Skriptcode von Ihrer **Tianji**-Website-Liste erhalten.
1818

19-
## Ereignis melden
19+
## Skriptattribute
2020

21-
**Tianji** bietet eine einfache Möglichkeit, Benutzer-Klickereignisse zu melden. Es ist einfach, nachzuvollziehen, welche Aktionen der Benutzer mag und häufig verwendet.
21+
Das Tracker-Skript unterstützt die folgenden `data-*` Attribute im `<script>` Tag:
2222

23-
Dies ist eine sehr gängige Methode in der Website-Analyse. Sie können es schnell nutzen, indem Sie **Tianji** verwenden.
23+
| Attribut | Erforderlich | Standardwert | Beschreibung |
24+
|---|---|---|---|
25+
| `data-website-id` | **Ja** || Die eindeutige Website-ID zur Verknüpfung von Tracking-Daten. Der Tracker wird ohne dies nicht initialisiert. |
26+
| `data-host-url` | Nein | Skript `src` Ursprung | Die URL des Backend-Servers. Wenn weggelassen, wird es automatisch aus dem `src` Pfad des Skripts abgeleitet. |
27+
| `data-auto-track` | Nein | `true` | Automatische Verfolgung von Seitenansichten und Routenänderungen. Setzen Sie es auf `"false"`, um es zu deaktivieren. |
28+
| `data-do-not-track` | Nein || Bei Einstellung respektiert es die Do Not Track (DNT)-Einstellung des Browsers und deaktiviert das Tracking, wenn DNT aktiviert ist. |
29+
| `data-domains` | Nein || Eine kommagetrennte Liste von Domains, die verfolgt werden sollen (z.B. `"example.com,www.example.com"`). Das Tracking ist nur aktiv, wenn der aktuelle Hostname mit einer dieser Domains übereinstimmt. |
30+
31+
### Vollständiges Beispiel
32+
33+
```html
34+
<script
35+
async
36+
defer
37+
src="https://example.com/tracker.js"
38+
data-website-id="clxxxxxxxxxxxxxxxxxx"
39+
data-host-url="https://analytics.example.com"
40+
data-auto-track="true"
41+
data-do-not-track="true"
42+
data-domains="example.com,www.example.com"
43+
></script>
44+
```
45+
46+
### Deaktivieren des Trackings über localStorage
47+
48+
Sie können das Tracking auch zur Laufzeit deaktivieren, indem Sie ein localStorage-Flag setzen:
49+
50+
```javascript
51+
localStorage.setItem('tianji.disabled', '1');
52+
```
53+
54+
## Ereignisbericht
55+
56+
**Tianji** bietet eine einfache Möglichkeit, Benutzer-Klickereignisse zu melden. Es ist einfach, Ihnen zu helfen, nachzuvollziehen, welche Aktion der Benutzer mag und oft verwendet.
57+
58+
Dies ist eine sehr gängige Methode in der Website-Analyse. Sie können sie schnell nutzen, indem Sie **Tianji** verwenden.
2459

2560
### Grundlegende Nutzung
2661

27-
Nachdem Sie den Skript-Code in Ihre Website eingefügt haben, müssen Sie nur ein `data-tianji-event` im DOM-Attribut hinzufügen.
62+
Nachdem Sie den Skriptcode in Ihre Website eingefügt haben, müssen Sie lediglich ein `data-tianji-event` im DOM-Attribut hinzufügen.
2863

2964
Zum Beispiel:
3065

3166
```html
32-
<button data-tianji-event="submit-login-form">Anmelden</button>
67+
<button data-tianji-event="submit-login-form">Login</button>
3368
```
3469

35-
Wenn ein Benutzer nun auf diese Schaltfläche klickt, erhält Ihr Dashboard ein neues Ereignis.
70+
Jetzt, wenn der Benutzer auf diese Schaltfläche klickt, erhält Ihr Dashboard ein neues Ereignis.
3671

37-
### Ereignisdaten anhängen
72+
### Anfügen von Ereignisdaten
3873

39-
Sie können zusätzliche Daten an Ihre Ereignisse anhängen, indem Sie `data-tianji-event-{key}`-Attribute verwenden. Jedes Attribut, das diesem Muster entspricht, wird gesammelt und mit dem Ereignis gesendet.
74+
Sie können zusätzliche Daten an Ihre Ereignisse anhängen, indem Sie `data-tianji-event-{key}` Attribute verwenden. Jedes Attribut, das diesem Muster entspricht, wird erfasst und mit dem Ereignis gesendet.
4075

4176
```html
4277
<button
@@ -57,29 +92,30 @@ Dies sendet ein Ereignis namens `purchase` mit den folgenden Daten:
5792
}
5893
```
5994

60-
### Link-Klicks verfolgen
95+
### Tracking von Link-Klicks
6196

62-
Bei der Verwendung von `data-tianji-event` auf Anker (`<a>`) -Tags behandelt **Tianji** diese speziell, um sicherzustellen, dass das Ereignis vor der Navigation verfolgt wird:
97+
Beim Verwenden von `data-tianji-event` auf Anker- (`<a>`) Tags behandelt **Tianji** sie speziell, um sicherzustellen, dass das Ereignis vor der Navigation verfolgt wird:
6398

6499
```html
65-
<a href="/pricing" data-tianji-event="view-pricing">Preise anzeigen</a>
100+
<a href="/pricing" data-tianji-event="view-pricing">Preise überprüfen</a>
66101
```
67102

68-
Für interne Links (nicht in einem neuen Tab geöffnet) wird der Tracker:
103+
Für interne Links (nicht in neuem Tab öffnen) wird der Tracker:
104+
69105
1. Die Standardnavigation verhindern
70-
2. Das Verfolgungsereignis senden
71-
3. Nach Abschluss der Verfolgung zur Ziel-URL navigieren
106+
2. Das Tracking-Ereignis senden
107+
3. Zur Ziel-URL navigieren, nachdem das Tracking abgeschlossen ist
72108

73109
Für externe Links oder Links mit `target="_blank"` wird das Ereignis verfolgt, ohne die Navigation zu blockieren.
74110

75111
### JavaScript-API
76112

77-
Nachdem das Tracker-Skript geladen ist, können Sie auch Ereignisse programmatisch unter Verwendung des `window.tianji`-Objekts verfolgen.
113+
Nach dem Laden des Trackerskripts können Sie Ereignisse auch programmgesteuert über das `window.tianji` Objekt verfolgen.
78114

79-
#### Benutzerdefinierte Ereignisse verfolgen
115+
#### Verfolgen von benutzerdefinierten Ereignissen
80116

81117
```javascript
82-
// Einfaches Ereignisverfolgen
118+
// Einfaches Ereignistracking
83119
window.tianji.track('button-clicked');
84120

85121
// Ereignis mit benutzerdefinierten Daten
@@ -89,24 +125,24 @@ window.tianji.track('purchase', {
89125
currency: 'USD'
90126
});
91127

92-
// Verfolgen mit benutzerdefiniertem Payload-Objekt
128+
// Tracking mit benutzerdefiniertem Payload-Objekt
93129
window.tianji.track({
94-
website: 'Ihre-Website-ID',
95-
name: 'benutzerdefiniertes-ereignis',
130+
website: 'your-website-id',
131+
name: 'custom-event',
96132
data: { key: 'value' }
97133
});
98134

99-
// Verfolgen mithilfe einer Funktion (erhält aktuelle Seiteninformationen)
135+
// Tracking mit einer Funktion (erhält aktuelle Seiteninformationen)
100136
window.tianji.track((payload) => ({
101137
...payload,
102-
name: 'dynamisches-ereignis',
138+
name: 'dynamic-event',
103139
data: { timestamp: Date.now() }
104140
}));
105141
```
106142

107-
#### Benutzer identifizieren
143+
#### Identifizieren von Benutzern
108144

109-
Sie können Benutzerdaten an Session-Tracking anhängen:
145+
Sie können Benutzerinformationen an Tracking-Sitzungen anhängen:
110146

111147
```javascript
112148
window.tianji.identify({
@@ -116,35 +152,35 @@ window.tianji.identify({
116152
});
117153
```
118154

119-
Diese Informationen werden mit nachfolgenden Ereignissen dieses Benutzers verbunden.
155+
Diese Informationen werden mit nachfolgenden Ereignissen von diesem Benutzer verknüpft.
120156

121-
## Standardmäßigen Skriptnamen ändern
157+
## Standard-Skriptname ändern
122158

123-
> Diese Funktion ist verfügbar ab v1.7.4+
159+
> Diese Funktion ist in Version v1.7.4+ verfügbar.
124160
125-
Sie können die Umgebung `CUSTOM_TRACKER_SCRIPT_NAME` verwenden, wenn Sie damit starten
161+
Sie können die Umgebung `CUSTOM_TRACKER_SCRIPT_NAME` verwenden, wenn Sie es starten.
126162

127-
zum Beispiel:
163+
Zum Beispiel:
128164
```
129165
CUSTOM_TRACKER_SCRIPT_NAME="my-tracker.js"
130166
```
131167

132-
dann können Sie Ihr Tracker-Skript mit `"https://<Ihre-eigene-Domain>/my-tracker.js"` besuchen.
168+
dann können Sie Ihr Tracker-Skript mit `"https://<your-self-hosted-domain>/my-tracker.js"` besuchen.
133169

134-
Dies soll Ihnen helfen, einige Werbeblocker zu umgehen.
170+
Dies soll Ihnen helfen, einige Ad-Blocker zu umgehen.
135171

136-
Sie benötigen nicht das `.js`-Suffix. Es kann jeder beliebige Pfad sein, den Sie wählen, sogar `CUSTOM_TRACKER_SCRIPT_NAME="this/is/very/long/path"`.
172+
Sie benötigen nicht das `.js` Suffix. Es kann jeder Pfad sein, den Sie wählen, und Sie können sogar `CUSTOM_TRACKER_SCRIPT_NAME="this/is/very/long/path"` verwenden.
137173

138-
## Nur bestimmte Domains verfolgen
174+
## Ausschließlich für bestimmte Domains verfolgen
139175

140-
Im Allgemeinen wird der Tracker alle Ereignisse melden, wo immer Ihre Seite läuft. Aber manchmal müssen wir Ereignisse wie `localhost` ignorieren.
176+
Im Allgemeinen wird der Tracker alle Ereignisse protokollieren, wo immer Ihre Website läuft. Aber manchmal müssen wir Ereignisse wie `localhost` ignorieren.
141177

142-
Tianji bietet ein Attribut des Tracker-Skripts, um dies zu tun.
178+
Tianji bietet ein Attribut im Tracker-Skript, um dies zu tun.
143179

144-
Sie können `data-domains` in Ihr Skript hinzufügen. Der Wert sollte Ihre Root-Domains zum Verfolgen sein. Verwenden Sie `,` um mehrere Domains zu trennen.
180+
Sie können `data-domains` zu Ihrem Skript hinzufügen. Der Wert sollte Ihre Root-Domains für das Tracking sein. Verwenden Sie `,` um mehrere Domains zu trennen.
145181

146182
```html
147-
<script async defer src="https://<Ihre-eigene-Domain>/tracker.js" data-website-id="xxxxxxxxxxxxx" data-domains="website.com,www.website.com"></script>
183+
<script async defer src="https://<Ihr-selbst-gehosteter-Domain>/tracker.js" data-website-id="xxxxxxxxxxxxx" data-domains="website.com,www.website.com"></script>
148184
```
149185

150186
Dann können Sie nur die Ereignisse von diesen Domains sehen.

0 commit comments

Comments
 (0)