Kaufereignis einrichten

In dieser Anleitung erfahren Sie, wie Sie ein purchase-Ereignis auf Ihrer Website einrichten, um zu erfassen, wenn jemand einen Kauf tätigt. Sie umfasst die Dimensionen, Messwerte und Berichte, die in Analytics mit Daten aus dem Ereignis gefüllt werden. Weitere Informationen zu E-Commerce-Ereignissen finden Sie unter E-Commerce messen.

Hinweis

In dieser Anleitung wird davon ausgegangen, dass Sie bereits diese Schritte ausgeführt haben:

Außerdem wird vorausgesetzt, dass Sie

  • Zugriff auf den Quellcode Ihrer Website
  • mindestens die Rolle „Bearbeiter“ für das Google Analytics-Konto haben.

Schritt 1: Ereignis auf der Website einfügen

Du solltest das purchase-Ereignis auf der Seite deiner Website einfügen, auf der jemand etwas kauft. Sie können das Ereignis beispielsweise auf der Bestätigungsseite hinzufügen, die angezeigt wird, wenn jemand etwas kauft. In dieser Anleitung erfahren Sie, wie Sie das Ereignis einer Seite hinzufügen, auf der jemand auf die Schaltfläche „Kaufen“ klickt.

Füge das Ereignis in einem <script>-Tag am Ende des <body>-Tags ein. Wenn Sie das Ereignis direkt in das <script>-Tag einfügen, wird es beim Laden der Seite ausgelöst. Im nächsten Abschnitt wird beschrieben, wie das Ereignis ausgelöst wird, wenn ein Nutzer auf „Kaufen“ klickt.

<!--
  Note: In the following code sample, make sure to
  replace "TAG_ID" with your tag ID.
  Learn more: https://support.google.com/tagmanager/answer/12326985
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'TAG_ID');
    </script>
</head>
<body>
    <div>This is where the purchase form would go</div>
    <button>Submit</button>
    <script>
    gtag("event", "purchase", {
        transaction_id: "T_12345_1",
        value: 30.03,
        tax: 4.90,
        shipping: 5.99,
        currency: "USD",
        coupon: "SUMMER_SALE",
        items: [
        // If someone purchases more than one item, 
        // you can add those items to the items array
         {
          item_id: "SKU_12345",
          item_name: "Stan and Friends Tee",
          affiliation: "Google Merchandise Store",
          coupon: "SUMMER_FUN",
          discount: 2.22,
          index: 0,
          item_brand: "Google",
          item_category: "Apparel",
          item_category2: "Adult",
          item_category3: "Shirts",
          item_category4: "Crew",
          item_category5: "Short sleeve",
          item_list_id: "related_products",
          item_list_name: "Related Products",
          item_variant: "green",
          location_id: "ChIJIQBpAG2ahYAR_6128GcTUEo",
          price: 10.01,
          quantity: 3
        }]
    });
    </script>
</body>
</html>

Schritt 2: Ereignis mit einer Schaltfläche verbinden

Sie können das Ereignis purchase so einrichten, dass es ausgelöst wird, wenn ein Nutzer auf die Schaltfläche „Kaufen“ klickt. Es gibt verschiedene Möglichkeiten, Eine Möglichkeit besteht darin, der Schaltfläche „Kaufen“ eine ID hinzuzufügen und dann den Ereigniscode in einen Event-Listener einzufügen. Im folgenden Beispiel wird das Ereignis nur gesendet, wenn jemand auf eine Schaltfläche mit der ID purchase klickt.

<!--
  Note: In the following code sample, make sure to
  replace "TAG_ID" with your tag ID.
  Learn more: https://support.google.com/tagmanager/answer/12326985
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'TAG_ID');
    </script>
</head>
<body>
    <div>This is where the purchase form would go</div>
    <button id="purchase">Purchase</button>
    <script>
    document.getElementById("purchase").addEventListener("click", function () {
        gtag("event", "purchase", {
                // This purchase event uses a different transaction ID
                // from the previous purchase event so Analytics
                // doesn't deduplicate the events.
                // Learn more: https://support.google.com/analytics/answer/12313109
                transaction_id: "T_12345_2",
                value: 30.03,
                tax: 4.90,
                shipping: 5.99,
                currency: "USD",
                coupon: "SUMMER_SALE",
                items: [
                {
                  item_id: "SKU_12345",
                  item_name: "Stan and Friends Tee",
                  affiliation: "Google Merchandise Store",
                  coupon: "SUMMER_FUN",
                  discount: 2.22,
                  index: 0,
                  item_brand: "Google",
                  item_category: "Apparel",
                  item_category2: "Adult",
                  item_category3: "Shirts",
                  item_category4: "Crew",
                  item_category5: "Short sleeve",
                  item_list_id: "related_products",
                  item_list_name: "Related Products",
                  item_variant: "green",
                  location_id: "ChIJIQBpAG2ahYAR_6128GcTUEo",
                  price: 10.01,
                  quantity: 3
                }]
          });
      });
    </script>
</body>
</html>

Schritt 3: Prüfen, ob Daten erhoben werden

Der DebugView-Bericht enthält Echtzeitdaten von Ihrer Website, damit Sie prüfen können, ob Sie Ereignisse richtig einrichten. Wenn Sie den Debug-Modus auf einer Webseite aktivieren möchten, fügen Sie dem Befehl config den folgenden debug_mode-Parameter hinzu:

<!--
  Note: In the following code sample, make sure to
  replace "TAG_ID" with your tag ID.
  Learn more: https://support.google.com/tagmanager/answer/12326985
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'TAG_ID',{ 'debug_mode': true });
    </script>
</head>
<body>
    <div>This is where the purchase form would go</div>
    <button id="purchase">Purchase</button>
    <script>
    document.getElementById("purchase").addEventListener("click", function () {
        gtag("event", "purchase", {
                // This purchase event uses a different transaction ID
                // from the previous purchase event so Analytics
                // doesn't deduplicate the events.
                // Learn more: https://support.google.com/analytics/answer/12313109
                transaction_id: "T_12345_3",
                value: 30.03,
                tax: 4.90,
                shipping: 5.99,
                currency: "USD",
                coupon: "SUMMER_SALE",
                items: [
                {
                  item_id: "SKU_12345",
                  item_name: "Stan and Friends Tee",
                  affiliation: "Google Merchandise Store",
                  coupon: "SUMMER_FUN",
                  discount: 2.22,
                  index: 0,
                  item_brand: "Google",
                  item_category: "Apparel",
                  item_category2: "Adult",
                  item_category3: "Shirts",
                  item_category4: "Crew",
                  item_category5: "Short sleeve",
                  item_list_id: "related_products",
                  item_list_name: "Related Products",
                  item_variant: "green",
                  location_id: "ChIJIQBpAG2ahYAR_6128GcTUEo",
                  price: 10.01,
                  quantity: 3
                }]
        });
    });
    </script>
</body>
</html>

Nachdem Sie den Debug-Modus aktiviert haben, werden während der Nutzung Ihrer Website Ereignisse im DebugView-Bericht erfasst. Wenn Sie beispielsweise auf Ihrer Website auf die Schaltfläche „Kaufen“ klicken, werden die folgenden Daten in den Bericht aufgenommen. Sie können ein Ereignis auswählen, um die zugehörigen Parameter, Nutzereigenschaften und Elemente aufzurufen.

Screenshot des DebugView-Berichts

Schritt 4: E-Commerce-Daten abrufen

Nach etwa 24 Stunden sind die Daten, die Sie mit dem Ereignis purchase gesendet haben, in Berichten, explorativen Datenanalysen und in der Google Analytics Data API verfügbar. Außerdem können Sie auf die Daten in BigQuery zugreifen, wenn Sie BigQuery Export einrichten.

Über das Ereignis „Kauf“ werden automatisch verschiedene vordefinierte Dimensionen und Messwerte erfasst, die unter anderem in Berichten und explorativen Datenanalysen verwendet werden. Im Folgenden finden Sie einige der Dimensionen, die im ersten Schritt mit Daten aus dem purchase-Ereignis gefüllt werden:

Parameter Dimension Wert
affiliation Artikelzugehörigkeit Google Merchandise Store
currency Währung USD
discount Artikel – Rabattbetrag 2,22
index Position der Artikelliste 0
item_brand Artikelmarke Google
item_category Artikelkategorie Bekleidung
item_id Artikel-ID SKU_12345
item_list_id Artikellisten-ID related_products
item_list_name Name der Artikelliste Ähnliche Produkte
item_name Artikelname Stan und seine Freunde
item_variant Artikelvariante green
location_id Artikelstandort-ID ChIJIQBpAG2ahYAR_6128GcTUEo (die Google Place ID für San Francisco)
shipping Versandkosten 5,99 EUR
tax Steuerbetrag 4,90
transaction_id Transaktions-ID T_12345

Zusätzlich zu den Dimensionen werden in Google Analytics Daten zu einer Reihe von E-Commerce- und umsatzbezogenen Messwerten erstellt. Wenn ein Nutzer beispielsweise einmal auf die Schaltfläche „Kaufen“ klickt, werden die folgenden Messwerte in Google Analytics erfasst:

  • Der Messwert Artikelumsatz hat einen Wert von 30,03 €.
  • Der Messwert Gesamtumsatz hat einen Wert von 30,03 €.
  • Der Messwert E-Commerce-Käufe hat den Wert „1“.

Sie können diese Dimensionen und Messwerte verwenden, um explorative Datenanalysen und benutzerdefinierte Berichte zu erstellen. Außerdem haben Sie die Möglichkeit, Ihre E-Commerce-Daten im folgenden vordefinierten Bericht E-Commerce-Käufe zu sehen:

Screenshot des Berichts „E-Commerce-Käufe“