> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Tracking einbinden

> Externe Tracking-Dienste wie Matomo oder Google Analytics in den Shop einbinden, entweder über die Tracking-Schnittstelle oder direkt im Template.

Welche Wege Besucher durch den Shop nehmen, wo sie abspringen und welche Kampagne wirklich Bestellungen bringt, beantwortet kein Shopsystem von sich aus. Dafür binden Sie einen Tracking-Dienst ein, und WEBSALE V8s bietet dafür zwei Wege an.

> [!WARNING]
>
> Tracking, Cookies und vergleichbare Werkzeuge der Werbewirksamkeitsforschung dürfen nach aktueller Rechtsprechung erst dann Daten übertragen, wenn der Besucher aktiv zugestimmt hat. Ein Hinweis genügt nicht, und voreingestellte Häkchen sind unzulässig. Klären Sie die Ausgestaltung mit Ihrem Datenschutzbeauftragten, bevor Sie einen der folgenden Schritte umsetzen.

Wegweiser: [Einwilligung zur Datenverarbeitung (Cookies)](https://dokumentation.websale.de/v8s/einstellungen/einwilligung-zur-datenverarbeitung-cookies.md)

## Die zwei Wege

| | Über die Tracking-Schnittstelle | Direkt im Template |
| - | - | - |
| Wo der Code steht | gesammelt in der Datei `ws_analyse.js` | im Template oder in einem Include-Bereich |
| Im Template steht | das Tag `WS-ExternalStatistics` | der Code selbst |
| Freischaltung | von WEBSALE zu beantragen | keine |
| Stärke | alle Dienstleister an einer Stelle, Änderungen ohne Templateeingriff | keine Abhängigkeit von der Schnittstelle |

Beide Wege lassen sich nebeneinander verwenden. Für einen Dienst, der seinen Code selbst laufend ändert, ist die Schnittstelle die ruhigere Lösung.

## Weg A: über die Tracking-Schnittstelle

### Schritt 1: Freischaltung

Die Tracking-Schnittstelle muss für Ihren Shop freigeschaltet werden. Wenden Sie sich dafür an die WEBSALE AG.

### Schritt 2: Code in die ws\_analyse.js kopieren

Die Datei `ws_analyse.js` im Shopverzeichnis nimmt die Skripte aller Tracking-Dienstleister auf. Liefert ein Anbieter selbst eine Datei dieses Namens, übernehmen Sie deren Inhalt in die vorhandene Datei, statt sie zu ersetzen.

Setzen Sie um jeden Abschnitt Kommentarzeilen. Bei vier Dienstleistern in einer Datei ist das der Unterschied zwischen fünf Minuten und einer Stunde, wenn später etwas zu ändern ist.

```js theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
// *******************************************************
// Beginn Google Analytics
// *******************************************************

  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'IHRE_MESS-ID');

// *******************************************************
// Ende Google Analytics
// *******************************************************
```

### Schritt 3: Tag im Template setzen

Das Tag gehört in den `<head>`-Bereich jedes Templates, auf dem gemessen werden soll.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<head>
   ...
   ~WS-ExternalStatistics~
   ...
</head>
```

Referenz: [WS-ExternalStatistics](https://dokumentation.websale.de/v8s/referenz/tags/ws/merkzettel-vergleich-upload-und-externe-dienste.md#die-tags-im-uberblick)

Wegweiser: [Beschreibung der Tracking-Schnittstelle](https://dokumentation.websale.de/v8s/materialien/materialien-tracking-schnittstelle.md)

Materialien: Beispiel des Trackings auf einer Shopseite

## Weg B: direkt im Template

Tracking gehört in der Regel auf alle Shopseiten. Statt den Code in jedes Template zu kopieren, legen Sie einen Include-Bereich in der FastInclude-Datei `incl_fast_includes.htm` an und binden ihn überall ein.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{Incl-Tracking}
   <script async src="https://www.googletagmanager.com/gtag/js?id=IHRE_MESS-ID"></script>
   <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'IHRE_MESS-ID');
   </script>
{/Incl-Tracking}
```

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<head>
   ...
   ~WS-Fast_Include(Incl-Tracking)~
   ...
</head>
```

Wegweiser: [Include-Bereiche](https://dokumentation.websale.de/v8s/referenz/tags/ws/includes-templates-css-und-js.md)

Referenz: [WS-Fast\_Include()](https://dokumentation.websale.de/v8s/referenz/tags/ws/includes-templates-css-und-js.md) · WS-Fast\_Include2…4()

## Beispiele der Anbieter

Den Code holen Sie sich im Konto des jeweiligen Dienstes und ersetzen darin alle Platzhalter durch Ihre eigenen Kennungen.

Matomo:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq || [];
_paq.push(["trackPageView"]);
_paq.push(["enableLinkTracking"]);

(function() {
  var u="//ihr-matomo-server.de/";
  _paq.push(["setTrackerUrl", u+"matomo.php"]);
  _paq.push(["setSiteId", "IHRE_MATOMO_SITEID"]);
  var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0];
  g.type="text/javascript"; g.async=true; g.src=u+"matomo.js"; s.parentNode.insertBefore(g,s);
})();
</script>
```

Google Analytics:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<!-- Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=IHRE_MESS-ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'IHRE_MESS-ID');
</script>
```

> [!WARNING]
>
> Ältere Anleitungen zeigen für Google Analytics noch den Code um `_gaq` und `ga.js` mit einer Kennung in der Form `UA-…`. Dieser Code misst nichts mehr. Verwenden Sie den Code aus Ihrem Google-Konto, der auf `gtag.js` und eine Mess-ID in der Form `G-…` setzt.

## Sonderfall Google Conversion Tracking

Google Conversion Tracking gehört zu Google Ads. Sie brauchen dafür ein Google-Ads-Konto, mit der Anmeldung bekommen Sie Ihre Kunden-ID.

> [!WARNING]
>
> Für Conversion Tracking empfiehlt Google die direkte Einbindung im Template. Verwenden Sie dafür nicht die Tracking-Schnittstelle, sondern setzen Sie den Code von Google an der von Google beschriebenen Stelle in jedes zu messende Template.

## Umlaute und Sonderzeichen übergeben

Der Shop liefert seine Inhalte in der Zeichencodierung aus, die in seiner Konfiguration steht, üblicherweise ISO 8859-1. Viele Tracking-Dienste erwarten dagegen UTF-8. Übergeben Sie einen Wert mit Umlauten unverändert, kommt dort ein Zeichensalat an.

Für diesen Fall gibt es `DC-FP1_convertToEncoding()`. Der Wert wird in einen freien Platzhalter gelegt, umcodiert und dann ausgegeben.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
~DC-FP1_reset~
~DC-FP1_set($WS-Search$)~
~DC-FP1_convertToEncoding($WS-Charset$,UTF-8)~
~DC-FP1_urlencoding~
```

| Zeile | Was sie tut |
| - | - |
| `~DC-FP1_reset~` | leert den Platzhalter, nötig, wenn er auf diesem Template schon benutzt wurde |
| `~DC-FP1_set($WS-Search$)~` | legt den Suchbegriff hinein |
| `~DC-FP1_convertToEncoding($WS-Charset$,UTF-8)~` | codiert vom Zeichensatz des Shops nach UTF-8 um |
| `~DC-FP1_urlencoding~` | gibt den Wert URL-codiert aus |

Als Ausgangscodierung steht `$WS-Charset$` und nicht fest `ISO-8859-1`. Damit arbeitet das Beispiel auch in einem Subshop, der auf eine andere Codierung eingestellt ist.

Ein vollständiges Beispiel, das Suchbegriff und Produktnummern an einen Dienstleister übergibt:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{Cat-Data}
   {ST-DepVar_OK}
      <script type="text/javascript" src="//www.sample.de/js/inlineretarget.js?method=search&pid=%%SampleTrackingPID%%&search=~DC-FP1_reset~~DC-FP1_set($WS-Search$)~~DC-FP1_convertToEncoding($WS-Charset$,UTF-8)~~DC-FP1_urlencoding~&productIds={@PR-Data}~DC-FP1_reset~~DC-FP1_set($PR-Number$)~~DC-FP1_convertToEncoding($WS-Charset$,UTF-8)~~DC-FP1_urlencoding~;{/@PR-Data}&productSeparator=;"></script>
   {/ST-DepVar_OK}
{/Cat-Data}
```

> [!WARNING]
>
> Die Tag-Kette steht hier bewusst ohne Zeilenumbrüche innerhalb des `src`-Attributs. Ein Umbruch mitten in der Adresse landet in der erzeugten Adresse und macht den Aufruf unbrauchbar.

Referenz: [WS-Search](https://dokumentation.websale.de/v8s/referenz/tags/ws/suche-listen-und-blaettern.md#die-tags-im-uberblick) · DC-FP1…5 · [DC-FP1…5\_set](https://dokumentation.websale.de/v8s/referenz/tags/dc/parameter.md) · [DC-FP1…5\_convertToEncoding()](https://dokumentation.websale.de/v8s/referenz/tags/dc/parameter.md) · [DC-FP1…5\_urlencoding](https://dokumentation.websale.de/v8s/referenz/tags/dc/parameter.md)

## Prüfen

Rufen Sie nach der Einbindung einige Seiten auf und sehen Sie im Konto des Dienstleisters nach, ob die Daten ankommen. Bei Google hilft zusätzlich der Tag Assistant im Chrome-Browser.

Wegweiser: Einrichtung des Web-Tracking-Codes überprüfen

## Was danach regelmäßig anzusehen ist

Mit der Einbindung ist es nicht getan. Zwei Werkzeuge von Google gehören in den Arbeitsalltag, und sie beantworten unterschiedliche Fragen.

| Werkzeug | Beantwortet | Sinnvoller Rhythmus |
| - | - | - |
| Google Search Console | Wie sieht Google meinen Shop? Welche Fehler meldet der Crawler, über welche Suchanfragen kommen Besucher, ist die Sitemap angekommen? | wöchentlich |
| Google Analytics | Was tun die Besucher im Shop? Woher kommen sie, welche Inhalte sehen sie, an welcher Stelle brechen sie ab? | täglich |

Wegweiser: [Sitemaps, robots.txt und Mobile-Subshops](https://dokumentation.websale.de/v8s/seo/sitemaps-robots-txt-und-mobile-subshops.md)

## Verwandte Themen

* Wegweiser: Beschreibung der Tracking-Schnittstelle
* Wegweiser: [Einwilligung zur Datenverarbeitung (Cookies)](https://dokumentation.websale.de/v8s/einstellungen/einwilligung-zur-datenverarbeitung-cookies.md)
* Wegweiser: Include-Bereiche
* Wegweiser: [A/B-Test](https://dokumentation.websale.de/v8s/funktionen-zur-shop-optimierung/a-b-test.md)


## Related topics

- [Materialien Tracking-Schnittstelle](https://dokumentation.websale.de/v8s/materialien/materialien-tracking-schnittstelle.md)
- [Integration von econda](https://dokumentation.websale.de/v8s/integration-von-econda/integration-von-econda.md)
- [Daten mit externen Systemen austauschen](https://dokumentation.websale.de/v8s/externe-dienste/daten-mit-externen-systemen-austauschen.md)
- [Navigation und Kategoriebaum](https://dokumentation.websale.de/v8s/referenz/tags/cat/navigation-und-kategoriebaum.md)
- [A/B-Test](https://dokumentation.websale.de/v8s/funktionen-zur-shop-optimierung/a-b-test.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.