Integration & Setup

  1. Home
  2. Integration & Setup
  3. Praxis-Tipps & Leitfäden
  4. Musterkonzepte eCommerce
  5. eCommerce Events

eCommerce Events

Mithilfe von eCommerce Events können Ereignisse wie ‚Produktseite gesehen‘, ‚Produkt in den Warenkorb gelegt‘ oder ‚Produkt bestellt‘ mit allen relevanten Artikelinformationen übermittelt werden. Dazu ist jedoch eine Integration weiteren Codes notwendig. Die dafür vorgesehenen Funktionen und Parameter sind in der sogenannten eCommerce-API enthalten.

Hierbei handelt es sich um JavaScript-Code, der an den entsprechenden Stellen auf Ihrer Website integriert werden muss. Die eCommerce-API hat zwei grundlegende Funktionen, um Informationen an etracker zu übermitteln: ’sendEvent‘ und ‚attachEvent‘.

sendEvent ist der direkte Aufruf eines von der Schnittstelle definierten eCommerce Events. Diese Funktion ist dann einzusetzen, wenn ein Ereignis beim Öffnen einer Seite abgesetzt werden soll

Soll das Absenden an ein bestimmtes ggf. schon bestehendes JavaScript-Event gekoppelt sein, muss die Funktion attachEvent verwendet werden. Ein Beispiel hierfür ist der Klick auf einen Button, bei dem sich ein Layer öffnet. Wichtig hierbei ist, dass jedes HTML-Element, an welches ein eCommerce Event angehängt werden soll, eine ID hat. Der HTML-Parameter ‚id‘ muss also stets einen Wert haben.

Mittels dieser beiden Funktionen lassen sich folgende zur Verfügung stehenden Ereignisse, bzw. Events, erfassen:

  • viewProduct – Produkt gesehen
  • insertToWatchlist – Produkt auf Merkliste gesetzt
  • removeFromWatchlist – Produkt von Merkliste entfernt
  • insertToBasket – Produkt in den Warenkorb gelegt
  • removeFromBasket – Produkt aus dem Warenkorb entfernt
  • order – Bestellung
  • orderCancellation – Bestellung storniert

Bei jedem Event müssen sog. Objekte definiert und angegeben werden. Bei den Objekten handelt es sich um:

  • product: Dieses Objekt definiert ein Produkt mit den dazugehörigen Attributen. Zu den Attributen eines Produkt-Objekts gehören:
    • Produkt-ID
    • Produkt-Name
    • Produkt-Hierarchie (Kategorie, bis zu vier Kategorie-Stufen)
    • (Nominal-)Preis
  • basket: Bei einer Bestellung werden die bestellten Produkte in einem Warenkorb-Objekt abgelegt. Dabei wird eine Warenkorb-ID übermittelt, und die Produkte, die sich im Warenkorb befinden, werden erfasst. Die Warenkorb-ID muss beim Event ‚viewProduct‘ mit angegeben werden.
  • order: Das Objekt der Bestellung enthält sämtliche Bestelldaten und das Warenkorb-Objekt. Folgende Bestelldaten werden erfasst:
    • Bestellnummer: Für die eindeutige Identifizierung der von Besuchern erreichten Umsatzziele (Leads & Sales) wird ein eindeutiger Wert an etracker übergeben, so dass jede Buchung einzeln erfasst wird.
    • Status: Bei einer Bestellung ist dies der Status ‚sale‘.
    • Bestellwert: Gesamtbestellwert der Bestellung.
    • Warenkorb: Das Warenkorb-Objekt (s.o.)

Hinweis:
Bei der Integration der eCommerce-API ist der Debug-Modus sehr hilfreich, um mögliche Übergabefehler schneller zu finden

Bitte beachte folgende Hinweise zur Integration von eCommerce-Events und dem neusten asynchronen etracker Code.

Produkt gesehen

Dieses Event soll bei jedem Aufruf einer Produktseite übergeben werden. Ein Produkt sollte als ‚gesehen‘ gewertet werden, wenn man es von dieser Seite aus in den Warenkorb legen kann.

Hinweis: Dies bedeutet, wenn Produkte von der Kategorie-Übersichtsseite direkt in den Warenkorb gelegt werden, muss hier, gleichzeitig zum ‚Produkt in den Warenkorb-Event‘, auch ein ‚Produkt gesehen-Event‘ aufgerufen werden.

Definition des Produkt-Objekts

NameAttributDatentypBegrenzungKommentar
Produkt-IDidstringMaximal 50 Zeichen lang, Leerzeichen am Anfang und Ende werden entferntDie Produkt-ID wird von Ihnen festgelegt und ergibt sich z. B. aus Ihrem Warenwirtschaftssystem
Produkt-NamenamestringMaximal 255 Zeichen lang, Leerzeichen am Anfang und Ende werden entferntDer Name des Produktes
(Nominal)-PreispricestringMaximal 20 Zeichen lang,
Dezimaltrenner ist ein Punkt. Leerzeichen am Anfang und Ende werden entfernt
Der Preis des Produktes
Währungcurrencystringmaximal 3 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
Die Währung nach ISO 4217
z. B.: EUR oder USD
[Produkt-Hierarchie]categoryarray of stringsEs können maximal vierstufige Hierarchien abgebildet werden. Das Array oder eine Kategorie kann auch leer sein.
Die Hierarchien können 50 Zeichen lang sein,
Leerzeichen am Anfang und Ende werden entfernt.
Die Produkthierarchie wird in einem Array gespeichert,
z. B.: ['Monitore', '', 'Flachbildschirme', 'LED']

Hinweis: Das Produkt-Objekt benötigt zwei weitere Attribute bei der Übergabe an die eCommerce- API: ‚currency‘ und ‚variants‘. Eine individuelle Anpassung dieser Attribute ist derzeit noch nicht möglich.

Für die Übergabe des Events ‚viewProduct‘ muss die Funktion ’sendEvent‘ auf einer Produktseite verwendet werden. Demnach ist folgender Beispiel-Code für die Auslösung des Events notwendig:

Produkt: Produkt A Artikelnummer: 125125125 Artikelname: Produkt A Preis: 25.99 Kategorie-Ebene 1: Oberkategorie X Kategorie-Ebene 2: Unterkategorie X.Y. Kategorie-Ebene 3: Unterkategorie X.Y.Z Kategorie-Ebene 4: Sonderkategorie i

var et_Commerce_product = 
 {
  id : '125125125', 
  name : 'Produkt A', 
  category : [‘Oberkategorie X’, 'Unterkategorie X.Y.', 'Unterkategorie X.Y.Z.', 'Sonderkategorie i'], 
  price : '25.99',
  currency: 'EUR',
  variants: {}
};
etCommerce.sendEvent('viewProduct',et_Commerce_product)

Produkt in den Warenkorb gelegt

Dieses Event wird dann ausgelöst, wenn der Nutzer auf den Button ‚in den Warenkorb‘ klickt. Für die Übergabe mit dem Klick muss die Funktion ‚attachEvent‘ genutzt werden.

Demnach ist folgender Beispiel-Code für die Auslösung des Events notwendig:

var et_Commerce_product = 
{
  id : '125125125', 
  name : 'Produkt A', 
  category : [‘Oberkategorie X’, 'Unterkategorie X.Y.', 'Unterkategorie X.Y.Z.', 'Sonderkategorie i'], 
  price : '25.99', 
  currency: 'EUR',
  variants: {}
}; 
var quantity = '1';
etCommerce.attachEvent({'mousedown' : ['ButtonAngebot']}, 'insertToBasket',et_Commerce_product,quantity);

Bestellung

Dieses Event wird ausgelöst, wenn die Bestätigungsseite eines Kaufs erscheint. Dabei muss ein Bestell-Objekt definiert werden. Definition eines Bestell-Objekts

NameAttributDatentypBegrenzungKommentar
BestellnummerorderNumberstringMaximal 50 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
Die von dir festgelegte eindeutige Bestellnummer. Mit dieser werden spätere Stornierungen getätigt. Bestellnummern, die sich nicht eindeutig einer Bestellung zuordnen lassen, verfälschen die Daten.
StatusstatusenumEnthält lead oder saleGibt an, ob es sich um eine Bestellung oder um einen Kauf handelt.
BestellwertorderPricestringMaximal 20 Zeichen lang,
Dezimaltrenner ist ein Punkt.
Leerzeichen am Anfang und Ende werden entfernt
Der Gesamtwert der Bestellung. Er sollte sich möglichst als Summe aus Warenkorbwert und Versandkosten ergeben. Rabatte, Gutscheine oder Sonderkosten durch Zahlungsart o.ä. sollten als Produkt-Objekt erfasst werden.
WährungcurrencystringMaximal 3 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
Die Währung der Bestellung nach ISO 4217
z. B.: EUR oder USD
WarenkorbbasketobjectDas Objekt muss der Warenkorb-Objekt-Beschreibung entsprechenDas Warenkorb-Objekt
[Kundengruppe]customerGroupstringMaximal 50 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
z. B.:
- Neukunde
- Stammkunde
- Vielkäufer
- VIP
[Lieferbedingungen]deliveryConditionsstringMaximal 255 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
z. B.:
- Lieferung bis Bordsteinkante
- Aufstellung vor Ort
- Lieferung an Packstation/Paket-shop/Filiale
[Zahlungsbedingungen]paymentConditionspaymentConditionsMaximal 255 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt
z. B.:
- Spezielle Zahlungsziele
- Skonto
- Ratenzahlung

Das nachstehende Beispiel bezieht sich auf folgende Inhalte:

Produkt: Produkt A Artikelnummer: 125125125 Artikelname: Produkt A Preis: 25.99 Kategorie-Ebene 1: Oberkategorie X Kategorie-Ebene 2: Unterkategorie X.Y. Kategorie-Ebene 3: Unterkategorie X.Y.Z Kategorie-Ebene 4: Sonderkategorie i

Demnach ist folgender Beispiel-Code für die Auslösung des Events notwendig:

var orderObject = {
    orderNumber : 'ABC12345',
    status : 'sale',  
    orderPrice : '25.99',
    basket : {
        id : '1',
        products : [
            {
                product: {
  id : '125125125', 
  name : 'Produkt A', 
  category : [‘Oberkategorie X’, 'Unterkategorie X.Y.', 'Unterkategorie X.Y.Z.', 'Sonderkategorie i'], 
  price : '25.99', 
  currency: 'EUR',
  variants: {}
                       },
                quantity : 1
            }
        
        ]
    },
}
etCommerce.sendEvent('order', orderObject);

Im Folgenden ein Beispiel, in welchem der potentielle Kunde mehrere Produkte in einer Auswahl bestellt:

Produkt: Produkt A Produkt-ID: 123456789 Produkt-Name: Produkt A Kategorie-Ebene 1: Kategorie X Kategorie-Ebene 2: Kategorie X.Y. Kategorie-Ebene 3: Kategorie X.Y.Z. Kategorie-Ebene 4: Marke i Preis: 129,56 Quantity: 3

Produkt: Produkt B Produkt-ID: 234567890 Produkt-Name: Produkt B Kategorie-Ebene 1: Kategorie A Kategorie-Ebene 2: Kategorie B Kategorie-Ebene 3: Kategorie C Kategorie-Ebene 4: Marke ii Preis: 23,99 Quantity: 1

Demnach ist folgender Beispiel-Code für die Auslösung des Events notwendig:

var orderObject = {
    orderNumber: 'ABC12345',
    status: 'Sale',
    orderPrice: '412.67',
    currency: 'EUR',
    basket: {
        id: '1',
        products: [{
            product: {
                id: '123456789',
                name: 'Produkt A',
                category: ['Kategorie X', 'Kategorie X.Y.', 'Kategorie X.Y.Z.', 'Marke i'],
                price: '129.56',
                currency: 'EUR',
                variants: {}
           },
            quantity = '3'
        }, {
            product: {
                id: '234567890',
                name: 'Produkt B',
                category: ['Kategorie A', 'Kategorie B', 'Kategorie C', 'Marke ii'],
                price: '23.99',
                currency: 'EUR',
                variants: {}
            },
            quantity = '1'
        }]
    },
}
etCommerce.sendEvent('order',orderObject);

Es ist auch möglich, die Versandkosten als eigenes Produkt zu erfassen. Hierzu folgendes Beispiel:

Produkt: Produkt A Produkt-ID: 123456789 Produkt-Name: Produkt A Kategorie-Ebene 1: Kategorie X Kategorie-Ebene 2: Kategorie X.Y. Kategorie-Ebene 3: Kategorie X.Y.Z. Kategorie-Ebene 4: Marke i Preis: 129,56 Quantity: 3

Produkt: Produkt B Produkt-ID: 234567890 Produkt-Name: Produkt B Kategorie-Ebene 1: Kategorie A Kategorie-Ebene 2: Kategorie B Kategorie-Ebene 3: Kategorie C Kategorie-Ebene 4: Marke ii Preis 23,99 Quantity 1

Produkt: Versandkosten Produkt-ID: Versandkosten Produkt-Name: Versandkosten Kategorie-Ebene 1: Versandkosten Kategorie-Ebene 2: Kategorie-Ebene 3: Kategorie-Ebene 4: Preis: 4,99 Quantity: 1

Demnach ist folgender Beispiel-Code für die Auslösung des Events notwendig:

var orderObject = {
    orderNumber: '123456789',
    status: 'Sale',
    orderPrice: '417.66',
    currency: 'EUR',
    basket: {
        id: '1',
        products: [{
            product: {
                id: '123456789',
                name: 'Produkt A',
                category: ['Kategorie X', 'Kategorie X.Y.', 'Kategorie X.Y.Z.', 'Marke i'],
                price: '129.56',
                currency: 'EUR',
                variants: {}
            },
            quantity = '3'
        }, {
            product: {
                id: '123456789',
                name: 'Produkt B',
                category: ['Kategorie A', 'Kategorie B', 'Kategorie C', 'Marke ii'],
                price: '23.99',
                currency: 'EUR',
                variants: {}
            },
            quantity = '1'
        }, {
            product: {
                id: 'Versandkosten',
                name: 'Versankosten',
                category: ['Versandkosten', '', '', ''],
                price: '4.99',
                currency: 'EUR',
                variants: {}
            },
            quantity = '1'
        }]
    },
}
etCommerce.sendEvent('order', orderObject);