Die einfachste Methode, Webanalyse in eine Website einzubinden, ist das Skript count.js. Daneben stehen weitere Integrationsmöglichkeiten zur Verfügung.
Das Skript liegt unter http://gc.zgo.at/count.js. Sie können es auch an anderer Stelle hosten, und es gibt stabile Versionen mit Unterstützung für Subresource Integrity.
Das Skript wird bewusst nicht minifiziert ausgeliefert, damit Sie es einfach prüfen können. Es ist mit ca. 3,2 KB klein; durch Minifizierung würde es sich nur um etwa 1 KB reduzieren.
Das Skript stellt window.goatcounter mit verschiedenen Einstellungen und Methoden bereit.
Am einfachsten setzen Sie diese über das Attribut data-goatcounter-settings am <script>-Tag. Alternativ können Sie sie direkt auf window.goatcounter setzen. Einige Beispiele folgen weiter unten.
Folgende Einstellungen werden unterstützt:
| Einstellung | Beschreibung |
|---|---|
no_onload |
Beim Laden der Seite nichts ausführen; nützlich, wenn Sie count() manuell aufrufen möchten. Events werden ebenfalls nicht gebunden. |
no_events |
Events nicht binden. |
allow_local |
Anfragen von lokalen Adressen (localhost, 192.168.0.0 usw.) zulassen, um die Integration lokal zu testen. |
allow_frame |
Anfragen zulassen, wenn die Seite in einem Frame oder Iframe geladen wird. |
endpoint |
Den Endpoint für das Senden von Seitenaufrufen anpassen (überschreibt die URL in data-goatcounter). Nur sinnvoll in Kombination mit no_onload. |
Beispiel zum Zulassen lokaler Anfragen über data-goatcounter-settings:
<script data-goatcounter="https://MYCODE.stats.wise-relations.com/count"
data-goatcounter-settings='{"allow_local": true}'
async src="//static.goatcounter.localhost:8081/count.js"></script>
Die Einstellung über das Attribut vermeidet ein zusätzliches <script>-Tag mit Inline-JS. Achten Sie darauf, dass der Wert gültiges JSON ist. Bei einem Fehler erscheint eine Meldung im Browser-Konsolenlog. Das Attribut überschreibt alle bereits in window.goatcounter gesetzten Werte.
Alternativ können Sie window.goatcounter verwenden; das folgende Beispiel ist gleichwertig:
<script>
// Make sure this is *before* you load the count.js script; otherwise
// the pageview may get sent before this is loaded and this will just
// overwrite the object.
window.goatcounter = {allow_local: true}
</script>
<script data-goatcounter="https://MYCODE.stats.wise-relations.com/count"
async src="//static.stats.wise-relations.com/count.js"></script>
Sie können die an die Webanalyse gesendeten Daten anpassen. Der Standardwert wird verwendet, wenn der Wert null oder undefined ist, jedoch nicht bei leerem String, 0 oder anderen Werten.
Sie können auch eine Callback-Funktion verwenden: Der Standardwert wird übergeben, und der Rückgabewert wird an den Server gesendet. Wenn der Callback für path den Wert null zurückgibt, wird kein Seitenaufruf gesendet.
| Variable | Beschreibung |
|---|---|
path |
Seitenpfad (ohne Domain) oder Event-Name. Standard ist der Wert von <link rel="canonical">, falls vorhanden, sonst location.pathname + location.search. |
title |
Lesbarer Titel. Standard ist document.title. |
referrer |
Herkunft des Besuchers; kann eine URL (https://example.com) oder ein beliebiger String (June Newsletter) sein. Standard ist der Referer-Header. |
event |
Den path als Event behandeln statt als URL. Boolean. |
no_session |
Sessions für diesen Seitenaufruf nicht erfassen; er wird immer gezählt, auch wenn der Benutzer die Seite neu lädt. Vor allem bei Events sinnvoll, wenn z. B. jeder Button-Klick gezählt werden soll. Für Seitenaufrufe nur in besonderen Szenarien empfohlen. |
Wie bei den Einstellungen oben können Sie sowohl das Attribut data-goatcounter-settings als auch das Objekt window.goatcounter verwenden. Beispiel, um immer /hello als Pfad zu senden:
<script data-goatcounter="https://MYCODE.stats.wise-relations.com/count"
data-goatcounter-settings='{"path": "/hello"}'
async src="//zgo.at/count.js"></script>
<script>
window.goatcounter = {path: '/hello'}
</script>
<script data-goatcounter="https://MYCODE.stats.wise-relations.com/count"
async src="//static.stats.wise-relations.com/count.js"></script>
Weitere fortgeschrittene Beispiele finden Sie unter Daten vor dem Senden ändern.
Die folgenden Methoden stehen auf window.goatcounter zur Verfügung, nachdem das Skript geladen wurde. Da es standardmäßig mit async geladen wird, ist es möglicherweise noch nicht verfügbar, wenn Ihr Skript ausgeführt wird. Entfernen Sie entweder async, oder verwenden Sie einen setInterval()-Callback:
var t = setInterval(function() {
if (!window.goatcounter || !window.goatcounter.count)
return
clearInterval(t)
// Do stuff with goatcounter here.
}, 100)
count(vars) Sendet einen Seitenaufruf oder ein Event an die Webanalyse. Der Parameter vars ist ein Objekt wie im Abschnitt Datenparameter beschrieben und wird in das globale window.goatcounter eingemischt, sofern es existiert.
url(vars) Gibt die URL zurück, die an den Server gesendet wird. Der Parameter vars verhält sich wie bei count().
Beachten Sie, dass Sie filter() verwenden sollten, um Prerender-Anfragen und andere unerwünschte Zugriffe auszuschließen.
filter() Prüft, ob diese Anfrage gefiltert werden soll. Die Methode gibt einen String mit dem Grund oder false zurück.
Bestimmte Bots, Prerender-Anfragen, Frames (sofern allow_frame nicht gesetzt ist) und lokale Anfragen (sofern allow_local nicht gesetzt ist) werden gefiltert.
Beispiel:
var f = goatcounter.filter()
if (f) {
if (console && 'log' in console)
console.warn('goatcounter: not counting because of: ' + f)
return
}
bind_events() Bindet ein Klick-Event an jedes Element mit data-goatcounter-click. Wird beim Laden der Seite aufgerufen, sofern no_onload oder no_events nicht gesetzt ist. Sie müssen diese Methode möglicherweise manuell aufrufen, wenn Sie Elemente nach dem Laden der Seite einfügen.
Weitere Details zu Events finden Sie unter Events.
get_query(name) Gibt einen einzelnen Query-Parameter aus der URL der aktuellen Seite zurück; liefert undefined, wenn der Parameter nicht vorhanden ist. Das ist nützlich, wenn Sie den referrer aus der URL auslesen möchten:
<script>
window.goatcounter = {
referrer: function() {
return goatcounter.get_query('ref') ||
goatcounter.get_query('utm_campaign') ||
goatcounter.get_query('utm_source') ||
document.referrer
},
}
</script>
<script data-goatcounter="https://MYCODE.stats.wise-relations.com/count"
async src="//static.stats.wise-relations.com/count.js"></script>
Beachten Sie auch die Einstellung Kampagnenparameter, die für die meisten Anwendungsfälle einfacher ist. Die obige Methode eignet sich, wenn Sie die Kampagne nur auf bestimmten Seiten auswerten oder eine weitergehende Filterung vornehmen möchten, etwa um nur eigene Kampagnen einzuschließen.
Bei Fragen oder Schwierigkeiten stehen wir Ihnen gern zur Verfügung. Die meisten Probleme lassen sich schnell klären.
Kontakt aufnehmen: anzeigen