mockup_bg mockup_bg mobile
Blog

So integrieren Sie signalize in Ihre Website

You are here:
< Back

1. Der signalize Code1.1 signalize Code einbauen (Standard Code)
1.2 signalize Code über Plugins integrieren
1.3 signalize Code über Google Tag Manager integrieren
1.4 signalize Code in Google AMP integrieren
1.4.1 Links auf Nicht-AMP-Seiten
1.4.2 Zusätzliche Attribute für AMP-zu-nicht-AMP Hyperlinks
2. Dynamische Inhalte mit dem Wrapper erfassen
2.1 Einbau des Wrappers
2.2 Parameter des Wrappers
3. Segmentierung und Triggering mit signalize
4. Parameter etcc_cust
5. Parameter etcc_newsletter
6. Eigene Segmente
6.1 Anlegen von eigenen Segmenten
6.2 Werte-Aliasing (optional)
6.3 Segment-Informationen übergeben
7. Bestellungen und eCommerce Events
7.1 Funktionalität der eCommerce API
7.2 Zugang zur eCommerce API
7.3 Debug-Modus
7.3.1 Debug-Modus mit Konfigurationsobjekt “_etr“ einschalten
7.3.2 Debug-Modus mit Variable “etCommerce.debugMode“ einschalten
7.4 Die Funktionen der eCommerce API
7.4.1 sendEvent – Event direkt absenden
7.4.2 attachEvent – Event an Objekt anknüpfen
7.5 Mögliche Events
7.5.1 viewProduct – Produkt gesehen
7.5.2 insertToWatchlist – Produkt zur Merkliste hinzugefügt
7.5.3 removeFromWatchlist – Produkt von Merkliste entfernt
7.5.4 insertToBasket – Produkt in den Warenkorb gelegt
7.5.5 removeFromBasket – Produkt aus dem Warenkorb entfernt
7.5.6 order – Bestellung
7.5.7 orderConfirmation – Bestellung vom Status Lead in den Status Sale transferiert
7.5.8 orderCancellation – Bestellung storniert
7.5.9 orderPartialCancellation – Bestellung teilstorniert
7.6 Event Objekte
7.6.1 Das Produkt-Objekt
7.6.2 Das Warenkorb-Objekt
7.6.3 Das Bestell-Objekt
7.7 Anwendungsbeispiele
7.7.1 Produktseite angesehen
7.7.2 Produkt in den Warenkorb gelegt
7.7.3 Ein Produkt aus dem Warenkorb entfernen
7.7.4 Eine Bestellung beim Klick absenden
8. Cross Device Tracking (optional)

Der signalize Code

Um signalize nutzen zu können, muss der individuelle signalize Code in alle Seiten der Website einmalig eingebunden werden.
Hinweis:
Für Targeting-Zwecke können zusätzliche Daten über Parameter und Schnittstellen übergeben werden, die Sie in die Website integrieren müssen.

Der signalize Code ist kompatibel mit dem etracker Tracking Code zur Nutzung von etracker Analytics und etracker Optimiser. So ist gewährleistet, dass die Produkte flexibel eingesetzt und kombiniert werden können, ohne zusätzlichen Code implementieren zu müssen.

signalize Code einbauen (Standard Code)

Der signalize Code wird unter dem Menüpunkt Account-Info → signalize Code bereitgestellt.
Fügen Sie den signalize Code innerhalb des HTML-Quellcodes auf allen Seiten Ihrer Website bzw. im Template Ihres Shop- oder Content Management-Systems zwischen dem öffnenden <head>-Tag und dem schließenden </head>-Tag ein.

Der signalize Standard Code baut sich wie im nachstehenden Beispiel gezeigt auf:
<!-- Copyright (c) 2000-2019 etracker GmbH. All rights reserved. -->
<!-- This material may not be reproduced, displayed, modified or distributed -->
<!-- without the express prior written permission of the copyright holder. -->
<!-- signalize Code 4.1 -->
<script id="_etLoader" type="text/javascript" charset="UTF-8" data-secure-code=
"XXXXXX" data-respect-dnt="true"
src="//static.etracker.com/code/e.js"></script>
<!-- signalize Code 4.1 end -->

Wir empfehlen, den signalize Code unmittelbar hinter dem öffnenden-Tag oder so nah wie möglich daran einzubauen.

signalize Code über Plugins integrieren

Für folgende Shop- und Content Management-Systeme kann der Code-Einbau mittels Plugin vorgenommen werden:

  • xt:Commerce
  • WordPress
  • Woo Commerce
  • Typo3
  • shopware
  • OXID
  • Magento

Sofern eine Implementierung nicht via Plugin erfolgt, sollte der signalize Code einmal auf dem Layout-Template eingefügt werden.

signalize Code über Google Tag Manager integrieren

Hier gehen Sie wie folgt vor:

  1. Melden Sie sich mit E-Mail und Passwort Ihres Google Kontos bei Google Tag Manager an: https://www.google.com/intl/de/tagmanager/
  2. Um Ihrem Container einen Tag mit Ihrem signalize Code hinzuzufügen, klicken Sie zunächst auf “Neues Tag hinzufügen“,

    dann auf “Tag Konfiguration“und schließlich auf “Benutzerdefiniertes HTML-Tag“.Jetzt aktivieren Sie die Checkbox bei “document.write unterstützen“.Damit das Tag erstellt werden kann, ist es noch notwendig, einen Trigger auszuwählen und mit einem Klick auf “Speichern“ zu bestätigen.
  3.  Fügen Sie eine Auslösungsregel für “Alle Seiten“ hinzu. Kopieren Sie den signalize Code aus der Applikation unter Einstellungen → Setup/signalize Code, fügen Sie ihn in das HTML-Fenster ein und passen Sie ihn an Ihre Website an, indem Sie den JavaScript-Variablen des signalize Codes die Variablen aus Ihrem Data Layer zuweisen (siehe signalize Code Integration in Websites und Portale). Klicken Sie nun auf “Speichern“.
  4. Mit Klick auf “Veröffentlichen“ wird der Container mit dem Tag an die Website ausgeliefert.

signalize Code in Google AMP integrieren

Mit signalize ist es auch möglich, Benachrichtigungen an Besucher von AMP-Seiten auszuspielen. Dazu muss die Seite an maximal zwei Stellen angepasst werden.

Zuerst muss “amp-analytics“ eingebunden werden. Dazu wird im HTML durch Hinzufügen eines Script-Elements im Head-Element das entsprechende Skript geladen.
<head>
<script async custom-element="amp-analytics"
src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js">
</script>
</head>

Werden mehrere Tracking-Tools gleichzeitig eingesetzt, muss das Skript nur einmal geladen werden. Danach wird im Body-Element “amp-analytics“ mit der signalize- bzw. etracker-Konfiguration eingebunden.

<body>
<amp-analytics config="https://code.etracker.com/amp-config.json.php">
<script type="application/json">
{
"vars": {
"pagename":"AMP-Beispielseite",
"areas": "AMP-Beispielbereich",
"et": "M632hA"
}
}
</script>
</amp-analytics>
</body>

In dem obigen Code-Abschnitt steht „M632hA“ für den Account-Schlüssel, der eindeutig für jeden Account vergeben wird.

Links auf Nicht-AMP-Seiten

Wenn die AMP-Seiten Verknüpfungen auf Nicht-AMP-Seiten in derselben Domäne enthalten, muss das Cross-Device-Matching für den Account aktiviert werden, um auch zuverlässig Besucher, die von einer AMP-Seite kommen, auf traditionellen Seiten zu erkennen. Außerdem sollten noch folgende Änderungen vorgenommen werden:

Zusätzliche Attribute für AMP-zu-nicht-AMP Hyperlinks

Die folgenden Attribute müssen in genau dieser Form in -Elementen im AMP-HTML eingefügt werden:
data-amp-addparams="et_cdi=CLIENT_ID(_et_amp_id)&et_ts=TIMESTAMP"
data-amp-replace="CLIENT_ID TIMESTAMP"

Eine Verlinkung auf die Seite https://non-amp.example.com von https://amp.example.com sieht dann so aus:
<a href="https://non-amp.example.com" data-amp-<
addparams="et_cdi=CLIENT_ID(_et_amp_id)&et_ts=TIMESTAMP" data-amp-
replace="CLIENT_ID TIMESTAMP">Visit our traditional page</a>

Dynamische Inhalte mit dem Wrapper erfassen

Mit dem Wrapper lassen sich Page Impressions auch ohne den ausdrücklichen Aufruf einer Webseite messen.

Einbau des Wrappers

Der Wrapper wird mit dem Standard JavaScript-Code von signalize ausgeliefert und kann z. B. so eingebaut werden:

<script type="text/javascript">function testCall(pagename){et_eC_Wrapper({et_et:
 accountkey1, et_pagename: pagename});}</script>

Die Funktion “testCall“ kann dann über jedes beliebige JavaScript-Event aufgerufen werden, wie z. B.:

onclick="testCall(pagename)"

Die Wrapper-Funktion kann auch direkt, ohne die TestCall-Funktion, wie folgt aufgerufen werden:

onmousedown="et_eC_Wrapper({et_et: accountkey1, et_pagename: Index-Seite});"

Damit der Aufruf der Wrapper-Funktion durch den geblockten Code, z. B. durch den Ausschluss von der Zählung, nicht zu einem JavaScript-Fehler führt, verwenden Sie bitte die folgende Funktion:

if(typeof(_etracker) === "object") { et_eC_Wrapper(…);}

Parameter des Wrappers

“Account-Schlüssel 1“ – der erste Parameter der Funktion – muss den Account-Schlüssel 1 des Accounts enthalten. Der zweite Parameter enthält ein optionales JavaScript-Objekt mit folgenden optionalen Variablen:

VariableTypeBedeutungBeschreibung
et_pagenameStringSeitennameEindeutiger Name der Seite
et_areasStringBereichsnameBezeichnung des Seitenbereichs

 

Alle Objektvariablen sind optional. Wenn sie nicht ausdrücklich gesetzt sind, werden die Werte übernommen, die im Parameter-Block des signalize Codes angegeben sind.

Folgender Aufruf erzeugt die gleichen Daten wie der ursprüngliche Aufruf über den signalize Code:

<script type="text/javascript">et_eC_Wrapper('Account-Schlüssel 1');</script>

Beispiel für einen vollständigen Aufruf:

<script type="text/javascript">et_eC_Wrapper({et_et:
accountkey,et_pagename:'Landingpage',cc_attributes:{"Attributname1":"Attributwert1",
"Attributname2": ["Attributwert2a", true]},});</script>
et_seg2="intern";..

Segmentierung und Triggering mit signalize

Über zusätzliche Parameter und Schnittstellen können Sie weitere Daten für das Targeting mit signalize übergeben. Folgende Segmente und Auslöser stehen in signalize zur Verfügung:

Segment/TriggerImplementierung
BesuchshäufigkeitWird automatisch ermittelt/Standard Code
KäufertypErfassung von Bestellungen
Zeit seit letzter BestellungErfassung von Bestellungen
Durchschnittlicher BestellwertErfassung von Bestellungen
Zeit seit letztem BesuchWird automatisch ermittelt/Standard Code
Besucher ist Newsletter-AbonnentParameter etcc_newsletter muss gesetzt werden
Besucher ist wiederkehrender BesucherWird automatisch ermittelt/Standard Code
Besucher ist KundeParameter etcc_cust muss gesetzt werden
Eigene User-SegmenteParameter et_seg1 usw. müssen eingerichtet und gesetzt werden
Stehengelassener WarenkorbÜbergabe von entsprechenden eCommerce Events

 

Parameter etcc_cust

Der Parameter etcc_cust muss auf 1 gesetzt werden, wenn der Besucher ein registrierter Kunde ist. Sie können den URL-Parameter etcc_cust=1 bei Bestandskunden an die URL hängen oder diesen im Parameter-Block des signalize Codes übergeben.

Parameter etcc_newsletter

Der Parameter etcc_newsletter muss auf 1 gesetzt werden, wenn der Kunde Newsletter-Empfänger ist. Zur Übergabe hängen Sie den URL-Parameter etcc_newsletter=1 am einfachsten an Ihre Newsletter-Links an.

Eigene Segmente

Anhand von eigenen Segmenten können Sie Ihre Segmentdaten zu Besuchern (User) mit zusätzlichen Informationen (z. B. aus eigenen Datenquellen wie einem CRM-System) anreichern. Diese werden mit Hilfe von Parametern übergeben.

Anlegen von eigenen Segmenten

Die Möglichkeit zur Erstellung von eigenen Segmenten sowie eine Übersicht der bereits angelegten eigenen Segmente finden Sie unter Account Info → Einstellungen → Account → Eigene Segmente:

Um ein neues eigenes Segment anzulegen, geben Sie den Segment-Namen in das Feld “Segment-Name“ ein. Wählen Sie dann aus dem Drop-Down Menü den Segment-Typ „User“ aus.

Nachdem Sie die Felder “Segment-Name“ und “Segment-Typ“ ausgefüllt haben, klicken Sie auf “Hinzufügen“, um das Segment hinzuzufügen. Nach dem Hinzufügen des eigenen Segmentes erscheint dieses in der Segmentübersicht. In der Spalte “Parameter“ wird der Parameter (z. B. „et_seg1“) angezeigt, mit dem Sie die Segmentinformationen übergeben können.

Sie können standardmäßig fünf eigene Segmente definieren. Eine Erweiterung ist jederzeit möglich. Wenden Sie sich hierzu bitte an Ihren Kundenbetreuer.

Werte-Aliasing (optional)

Sie haben die Option, für die übergebenen Segmentwerte ein Aliasing einzurichten, um statt des Klarnamens ein Pseudonym im Parameter übergeben zu können. Das Aliasing der Segmentwerte wird über eine CSV-Datei (max. 1 MB) vorgenommen, die Sie zu dem entsprechenden eigenen Segment hochladen und jederzeit überschreiben können.

Das Format ist für jeden Listeneintrag: Wert, Alias (z. B. x12, weiblich oder „x12“,“weiblich“).

Nach Klick auf “+.csv-Datei hinzufügen“ können Sie auf die Werte-Datei navigieren und diese wieder downloaden.

Achtung:
Das Aliasing gilt erst ab dem Zeitpunkt der Speicherung der Datei in der Applikation für alle zukünftigen Besuche des jeweiligen Website-Besuchers, nicht aber rückwirkend.

Segment-Informationen übergeben

Wenn Sie eigene Segmente unter Account-Info → Einstellungen → Account → Eigene Segmente angelegt haben, können Sie die Segment-Informationen als Parameter im Parameter-Block der jeweiligen Seite als URL-Parameter oder mit einem Wrapper-Aufruf übergeben.

Beispiel für die Übergabe im Parameter-Block mit Parameter bei Seitenaufruf:

var et_seg1="[Wert]";

Beispiel für die Übergabe mit URL-Parameter bei Aufruf über externen Link:

http://www.meineseite.de?etcc_cmp=Sommer&etcc_med=Display&et_seg1=[Wert]

Beispiel für die Übergabe mit der Wrapper-Funktion:

onmousedown="et_eC_Wrapper({et_et: accountkey1, et_pagename: "Login-Startseite", et_seg1: [Wert]});

Beispiel

Für Besucher Ihrer Website soll zusätzlich die Information mitgegeben werden, ob es sich um weibliche oder männliche Besucher handelt und ob der Zugriff auf die Website von internen Mitarbeitern oder von externen Besuchern erfolgte.

Die Übergabe der Information zu dem Geschlecht der Besucher soll nicht im Klartext erfolgen.

Schritt 1: Eigene Segmente erstellen

Es werden zwei eigene Segmente erstellt: “Geschlecht“ und “Autor“. Für das Segment “Geschlecht“ sollen die Werte “männlich“ und “weiblich“ übergeben werden. Hier wird der Segment-Typ “User“ selektiert, da die Nutzer Profile angereichert werden sollen. Für das Segment “Autor“ sollen die Werte “Autor Mustermann“ und “Autor Musterfrau“ übergeben werden. Hier wird der Segment-Typ “Page Impression“ selektiert, da die Seite angereichert werden soll.

Schritt 2: Werte-Datei erstellen
Um die Werte für das eigene Segment “Geschlecht“ zu codieren, wird eine CSV-Datei mit folgendem Inhalt erstellt:

Hierdurch wird bei Übergabe der Werte “x12“ und “y34“ durch eine Encodierung vorgenommen, so dass diese Werte dann als Segmentwerte “weiblich“ und “männlich“ erfasst und in den Reports ausgegeben werden.

Schritt 3: Werte-Datei hochladen

Werte-Datei unter Account-Info → Einstellungen → Account → Eigene Segmente zu dem Segment “Geschlecht“ hochladen.

Schritt 4: Integration der Parameter zur Übergabe als Segment-Informationen

Bei Aufruf Ihrer Webseite von einer internen Mitarbeiterin sieht die Übergabe der Parameter im Parameter-Block des signalize Codes dann wie folgt aus:

..var et_seg1 = "x12"; var et_seg2="intern";..

Bestellungen und eCommerce Events

Um eCommerce Events wie “Produkt angesehen“, “Produkt in den Warenkorb gelegt“, “Produkt auf Merkliste gesetzt“, “Produkt bestellt“ zu erfassen, steht Ihnen die eCommerce-Schnittstelle zur Verfügung.

Funktionalität der eCommerce API

Die eCommerce API ist eine JavaScript-Schnittstelle. Sie kann verschiedene Events, die ein Kunde in einem Online-Shop auslöst, entgegennehmen. Dies kann klassisch pro Seitenaufruf oder auch Event-gesteuert geschehen. Die dabei übertragenen Daten bestehen aus Informationen über die Produkte, Warenkörbe und Bestellungen. Mit den so erfassten Daten können Sie z. B. ermitteln, wie viele Warenkörbe stehengelassen oder welche Produkte besonders häufig angeschaut wurden.

Die Datenübermittlung kann zum tatsächlichen Zeitpunkt der Kundenaktion geschehen, wenn bspw. der Kunde das Produkt in den Warenkorb legt, oder später, z. B. im Fall eines abgesendeten Formulars. Hier wird das Event erst gesendet, wenn der Kunde auf der Folgeseite angelangt ist. In einer asynchronen Umgebung ist es außerdem möglich, Events zu speichern und erst zu senden, wenn der signalize Code geladen ist. Die Beispiele weiter unten erläutern die verschiedenen Varianten zum Einbau von Events.

Zugang zur eCommerce API

Bevor Sie die eCommerce API einsetzen können, müssen Sie den signalize Code auf allen zu messenden Seiten der Website einbinden.
Die Schnittstelle ist mit der Auslieferung des signalize Codes aktiviert, sodass Sie die Events sofort in den Code einbinden können.

Debug-Modus

Die Schnittstelle ist mit einem Debug-Modus ausgestattet, der besonders während des Einbaus der eCommerce API hilfreich ist. Wenn der Debug-Modus aktiviert ist, werden Fehlermeldungen, Events und der Aufruf der Schnittstelle in der JavaScript-Konsole angezeigt. Die Events werden nicht an signalize übermittelt, wenn der Debug-Modus aktiviert ist.

Der Modus kann erst eingeschaltet werden, wenn der signalize Code komplett geladen ist.

Um die Ausgaben lesen zu können, helfen Entwicklertools wie sie heute von vielen Browsern angeboten werden.

BrowserEntwicklertoolBezugsort
FirefoxFirebughttps://addons.mozilla.org/de/firefox/addon/firebug
Internet ExplorerEntwicklertoolsIst im Browser integriert
ChromeEntwicklertoolsIst im Browser integriert
OperaDragonflyIst im Browser integriert
SafariFirebug litehttp://getfirebug.com/firebuglite

 

Debug-Modus mit Konfigurationsobjekt “_etr“ einschalten

Hinweis:
Das Konfigurationsobjekt können Sie nur einbauen, wenn Sie den aktuellen signalize Code 4.x verwenden. Die Einstellung greift erst, wenn die Datei e.js nachgeladen ist. Vorher versendete Events werden aber trotzdem auf Fehler geprüft, da sie erst verarbeitet werden, wenn die e.js geladen ist.

“_etr“ sollte nicht überschrieben werden, falls es bereits existiert.

Beispiel:

<script type="text/javascript" charset="UTF-8">
// Parameterblock
var et_pagename = "__INDEX__"; _etr = { debugMode = true; }
</script>
<script id="_etLoader" type="text/javascript" charset="UTF-8" data-preload-dc="data-preload-dc" data-secure-code="Account Schlüssel 1" src="//static.etracker.com/code/e.js"></script>

Debug-Modus mit Variable “etCommerce.debugMode“ einschalten

Hinweis:
Die Variable “etCommerce.debugMode“ muss nach dem Aufruf des signalize Codes gesetzt werden. Der signalize Code 4.x wird durch die Datei e.js aufgerufen.

// einschalten des Debug-Modus
etCommerce.debugMode = true ;

Beispiel für signalize Code 4.x etCommerce.debugMode hinter Parameterblock und Code:

<script type="text/javascript" charset="UTF-8">
// Parameterblock
var et_pagename = "Seitenname";
</script>
<script id="_etLoader" type="text/javascript" charset="UTF-8" data-preload-dc="data-preload-dc" data-secure-code="Account Schlüssel 1" src="//static.etracker.com/code/e.js"></script>
<script type="text/javascript" charset="UTF-8">
var etCommerce.debugMode = true ;
</script>

Die Funktionen der eCommerce API

Die Schnittstelle hat zwei grundlegende Funktionen, um Informationen zu übermitteln: “sendEvent“ und “attachEvent“. “sendEvent“ ist der direkte Aufruf eines von der Schnittstelle definierten eCommerce Events, welcher sofort die übergebenen Werte sendet. Soll das Absenden an ein bestimmtes JavaScript Event gekoppelt sein – z. B. Besucher klickt auf “in den Warenkorb“ -, dann kann die Funktion “attachEvent“ verwendet werden, die das eCommerce Event an ein gewünschtes Objekt der Webseite anhängt.

Wenn der signalize Code am Ende der HTML-Seite eingebaut ist oder asynchron geladen wird, gibt es die Möglichkeit, Events und das Anhängen von Events an HTML-Objekte zwischenzuspeichern. Die Funktionen werden dann ausgeführt, wenn der signalize Code komplett geladen ist.

sendEvent – Event direkt absenden

etCommerce.sendEvent(event, parameter_1, [parameter_n])

Die Funktion “sendEvent“ des Objekts “etCommerce“ wird im JavaScript direkt aufgerufen. Die übergebenen Werte werden dabei direkt an signalize übermittelt.

FunktionsparameterDatentypBegrenzungBeschreibung
eventstringEs werden nur die von der Schnittstelle definierten Events unterstützt.Name des Events
parameter_1, [parameter_n]variiertSiehe weitere Beschreibung.

 

Hinweis:
Parameter in eckigen Klammern [ ] sind optionale Parameter.

Beispiel:

// direkter Aufruf
etCommerce.sendEvent('viewProduct', product, 'Warenkorb 1') ;

attachEvent – Event an Objekt anknüpfen

etCommerce.attachEvent(attachObject, event, parameter_1, [parameter_n])

Mit der Funktion „attachEvent“ können Sie an jedes Webseiten-Objekt, das eine ID besitzt, ein eCommerce Event anhängen. Dieses wird dann durch das angegebene JavaScript-Event ausgelöst. So kann direkt mit dem Klick auf den Button “In den Warenkorb“ das eCommerce Event an signalize übermittelt werden.

FunktionsparameterDatentypBegrenzungBeschreibung
attachObjectObjektEs werden nur bestehende JavaScript-Events und Objekt-IDs, die mittels getElementById ermittelt werden, unterstützt.
Der Aufbau des Objekts ist folgendermaßen: {'Eventname': ['Objekt-ID1', ‘Objekt-ID2’]}
In diesem Objekt sind das JavaScript-Event und die IDs der Webseiten-Objekte enthalten, an welche dieses Event angehängt wird.
eventstringEs werden nur die von der Schnittstelle definierten Events unterstützt.Name des angehängten Events.
parameter_1, [parameter_n]variiertSiehe weitere Beschreibung.

 

Hinweis:
Parameter in eckigen Klammern [ ] sind optionale Parameter.

Beispiel:

// Verknüpfen des eCommerce Events mit einem JavaScript-Event
etCommerce.attachEvent({'mousedown' : ['viewButton']}, 'viewProduct', product, 'Warenkorb 1') ;

Mögliche Events

Gegenwärtig unterstützt die eCommerce API acht verschiedene Events, die im Folgenden beschrieben werden.

viewProduct – Produkt gesehen

Dieses Event kann gesendet werden, wenn sich der Kunde auf der Produktseite befindet.

FunktionsparameterDatentypBegrenzungBeschreibung
'viewProduct'stringNur dieser Name ist zugelassen.Name des Events.
Produkt-ObjektobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechenEin Produkt-Objekt.

 

Beispiele:

// Definition des Produkt-Objekts
var product = { id : '3445',  name : 'Elfrida',  category : ['Tiere', 'Großwild', 'Giraffen', 'Liebe Giraffen'],  price : '1723.60',  currency : 'EUR',  variants : {'Farbe' : 'gelb', 'Geschlecht' : 'weiblich', 'Figur' : 'dünn'}};

// direkter Aufruf
etCommerce.sendEvent('viewProduct', product, 'Warenkorb 1') ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['button_ view']}, 'viewProduct', product, 'Warenkorb 1') ;

insertToWatchlist – Produkt zur Merkliste hinzugefügt

Dieses Event wird gesendet, wenn der Kunde seiner Merkliste ein Produkt hinzufügt.

FunktionsparameterDatentypBegrenzungBeschreibung
'insertToWatchlist'stringNur dieser Name ist zugelassen.Name des Events.
Produkt-ObjektobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechen.Ein Produkt-Objekt.
Anzahlinteger0 - 65 535
Negative Zahlen sind nicht erlaubt.
Die Anzahl der auf die Merkliste gesetzten Produkte.
[Seitenname]stringMaximal 255 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt.
Unterscheidet sich der Sei-tenname von dem Standard, kann dieser Seitenname übergeben werden.

 

Hinweis:
Parameter in eckigen Klammern [ ] sind optionale Parameter. Die Warenkorb-ID wird noch nicht in Reports angezeigt.

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('insertToWatchlist', product, 2 ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['insertButton']}, 'insertToWatchlist', product, 2) ;

removeFromWatchlist – Produkt von Merkliste entfernt

Mit Hilfe dieses Events können Sie feststellen, welche Produkte wieder von der Merkliste entfernt wurden.

FunktionsparameterDatentypBegrenzungBeschreibung
'removeFromWatchlist'stringNur dieser Name ist zugelassen.Name des Events.
Produkt-ObjektobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechen.Ein Produkt-Objekt.
Anzahlinteger0 - 65 535
Negative Zahlen sind nicht erlaubt.
Die Anzahl der entfernten Produkte.
[Seitenname]stringMaximal 255 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt.
Unterscheidet sich der Seitenname von dem Standard, kann dieser Seitenname übergeben werden.

 

Hinweis:
Parameter in eckigen Klammern [ ] sind optionale Parameter.

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('removeFromWatchlist', product, 1) ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['removeButton']}, 'removeFromWatchlist', product, 1) ;

insertToBasket – Produkt in den Warenkorb gelegt

Dieses Event wird gesendet, wenn der Kunde seinem Warenkorb ein Produkt hinzufügt.

FunktionsparameterDatentypBegrenzungBeschreibung
'insertToBasket'stringNur dieser Name ist zugelassen.Name des Events.
Produkt-ObjektobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechen.Ein Produkt-Objekt.
Anzahlinteger0 - 65 535
Negative Zahlen sind nicht erlaubt.
Die Anzahl der in den Warenkorb gelegten Produkte.

 

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('insertToBasket', product, 2) ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['insertButton']}, 'insertToBasket', product, 2) ;

removeFromBasket – Produkt aus dem Warenkorb entfernt

Mit Hilfe dieses Events können Sie feststellen, welche Produkte wieder aus einem Warenkorb entfernt wurden.

FunktionsparameterDatentypBegrenzungBeschreibung
'removeFromBasket'stringNur dieser Name ist zugelassen.Name des Events.
Produkt-ObjektobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechen.Ein Produkt-Objekt.
Anzahlinteger0 - 65 535
Negative Zahlen sind nicht erlaubt.
Die Anzahl der entfernten Produkte.

 

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('removeFromBasket', product, 1) ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['removeButton']}, 'removeFromBasket', product, 1) ;

order – Bestellung

Dieses Event übermittelt die gesamte Bestellung mit allen Bestelldaten und dem Warenkorb.

FunktionsparameterDatentypBegrenzungBeschreibung
'order'stringNur dieser Name ist erlaubt.Name des Events.
Bestell-ObjektobjectDas Objekt muss der Bestell-Objekt-Beschreibung entsprechen.Ein Bestell-Objekt.
currencystringMaximal 3 Zeichen lang, Leerzeichen am Anfang und Ende werden entfernt.Die Währung nach ISO 4217, z. B. EUR oder USD.

 

Beispiele:

// Definition des Bestell-Objekts
var order = { orderNumber : 'Bestellnummer 1', status : 'sale',  orderPrice : '1723.60', basket : { id : 'Warenkorb 1', products : [ { product: { id : '3445',  name : 'Elfrida',  category : ['Tiere', 'Großwild', 'Giraffen', 'Liebe Giraffen'],  price : '1723.60', currency : 'EUR',  }, quantity : 1 }]}, customerGroup : 'Tierliebhaber', deliveryConditions : 'Großer Transport', paymentConditions : 'Sofortzahlung',};

// direkter Aufruf
etCommerce.sendEvent('order', order) ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['orderButton']}, 'order', order) ;

orderConfirmation – Bestellung vom Status Lead in den Status Sale transferiert

Dieses Event wird gesendet, wenn eine Bestellung inklusive aller Produktpositionen vom Status “Lead“ in den Status “Sale“ überführt werden soll.

FunktionsparameterDatentypBegrenzungBeschreibung
'orderConfirmation'stringNur dieser Name ist zugelassen.Name des Events.
BestellnummerstringMaximal 50 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt.
Die Bestellnummer der Bestellung, für die der Status “Lead“ in “Sale“ übergehen soll.

 

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('orderConfirmation', 'Bestellnummer 1');

// Als Event angehängt
etCommerce.attachEvent({'mousedown' :['cancelButton']}, 'orderConfirmation', 'Bestellnummer 1') ;

orderCancellation – Bestellung storniert

Dieses Event wird gesendet, wenn der Kunde die gesamte Bestellung storniert.

FunktionsparameterDatentypBegrenzungBeschreibung
'oderCancellation'stringNur dieser Name ist zugelassen.Name des Events.
BestellnummerstringMaximal 50 Zeichen lang, Leerzeichen am Anfang und Ende werden entfernt.Die Bestellnummer der Bestellung, die storniert werden soll.

 

Beispiele:

// direkter Aufruf
etCommerce.sendEvent('orderCancellation', 'Bestellnummer 1') ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['cancelButton']}, 'orderCancellation', 'Bestellnummer 1') ;

orderPartialCancellation – Bestellung teilstorniert

Dieses Event wird gesendet, wenn nur einzelne Produkte einer Bestellung storniert werden.

FunktionsparameterDatentypBegrenzungBeschreibung
'orderPartialCancellation'stringNur dieser Name ist erlaubt.Name des Events.
BestellnummerstringMaximal 50 Zeichen lang, Leerzeichen am Anfang und Ende werden entfernt.Die Bestellnummer der Bestellung, die storniert werden soll.
Produkt-Objektearray of objectsDas Array muss der Produkte-Array-Beschreibung entsprechen.Ein Array, welches aus verschiedenen Produkt-Objekten und deren jeweils zu stornierenden Anzahl besteht.

 

Beispiele:

// Definition von Produkt-Objekten
var products = [ { product : { id : '3445',  name : 'Elfrida',  category : ['Tiere', 'Großwild', 'Giraffen', 'Liebe Giraffen'],  price : '1723.60',  }, quantity: 1}];

// direkter Aufruf
etCommerce.sendEvent('orderPartialCancellation', 'Bestellnummer 1' , products) ;

// Als Event angehängt
etCommerce.attachEvent({'mousedown' : ['partialButton']}, 'orderPartialCancellation', 'Bestellnummer 1' , products) ;

Event Objekte

Die Informationen zu den Produkten, den Warenkörben und den Bestellungen werden in JavaScript-Objekten abgelegt. Im Folgenden finden Sie eine Aufstellung dieser Objekte und deren Aufbau.

Das Produkt-Objekt

Dieses Objekt definiert ein Produkt mit den dazugehörigen Attributen.

NameAttributDatentypBegrenzungKommentar
Produkt-IDidstringMaximal 50 Zeichen lang, Leerzeichen am Anfang und Ende werden entfernt.Die 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 entfernt.Der Name des Produktes.
Produkt-Hierarchie (Kategorie)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'].
(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.
VariantenvariantsObject with key/value pairsDas Objekt kann leer sein.
Die Varianten können 50 Zeichen lang sein,
Leerzeichen am Anfang und Ende werden entfernt. Maximal 3 Varianten.
Um verschiedene Varianten eines Produktes zu übergeben,
z. B.: {'Farbe': 'gelb', 'Geschlecht': 'weiblich', 'Figur': 'dünn'} .

 

Beispiele:

// Definition eines Produkt-Objekts
var product = {    id      : '3445',     name      : 'Elfrida',     category : ['Tiere', 'Großwild', 'Giraffen', 'Liebe Giraffen'],     price      : '1723.60',     currency : 'EUR',     variants : {'Farbe' : 'gelb', 'Geschlecht' : 'weiblich', 'Figur' : 'dünn'}};

Das Warenkorb-Objekt

Bei einer Bestellung werden die bestellten Produkte in einem Warenkorb-Objekt abgelegt.

NameAttributDatentypBegrenzungKommentar
Warenkorb-IDidstringMaximal 50 Zeichen lang, Leerzeichen am Anfang und Ende werden entfernt.Die Warenkorb-ID wird von Ihnen festgelegt.
Produkt-Objekteproductsarray of objectsDas Array muss der Produkte-Array-Beschreibung entsprechen (siehe folgende Tabelle).In diesem Array werden die verschiedenen Produkt-Objekte und die bestellte Anzahl hinterlegt.

Das Array “products“ enthält ein oder mehrere Objekte, die wiederum aus Produkt-Objekten und der jeweiligen Anzahl bestehen. Dieses Produkte-Array findet auch in einer Teilstornierung Verwendung.

NameAttributDatentypBegrenzungKommentar
ProduktproductobjectDas Objekt muss der Produkt-Objekt-Beschreibung entsprechen.Das Produkt-Objekt.
Anzahlquantityinteger0 - 65 535
Negative Zahlen sind nicht erlaubt.
Die bestellte/stornierte Anzahl.

 

Beispiele:

// Definition eines Warenkorb-Objekts mit Produkte-Array
var basket = { id : '3', products : [ { product: { … }, quantity : 2 }, { product: { … }, quantity : 1 } ]};

Das Bestell-Objekt

Das Objekt der Bestellung enthält sämtliche Bestelldaten und das Warenkorb-Objekt.

NameAttributDatentypBegrenzungKommentar
BestellnummerorderNumberstringMaximal 50 Zeichen lang,
Leerzeichen am Anfang und Ende werden entfernt.
Die von Ihnen 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, sale, cancellation oder partial_cancellation
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.
Warenkorbbasketobject of warenkorbDas Objekt muss der Warenkorb-Objekt-Beschreibung entsprechen.Das 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.

 

Hinweis:
Parameter in eckigen Klammern [ ] sind optionale Parameter.

Beispiel:

// Definition eines Bestell-Objekts
var order = { orderNumber : '234', status : 'sale',  orderPrice : '5447.2', currency : 'EUR',  basket : {Warenkorb-Objekt}, customerGroup : ‘Tierliebhaber’, deliveryConditions : 'Großer Transport', paymentConditions : 'Sofortzahlung',}

Anwendungsbeispiele

Die Anwendungsbeispiele verdeutlichen, wie die verschiedenen Events für ausgewählte Aktionen auf der Website an signalize gesendet werden können.

Produktseite angesehen

Beim Aufrufen einer Produktseite sollen die Produktinformationen sofort übermittelt werden. Dafür wird ein Produkt-Objekt definiert. Die Daten werden über die “sendEvent“-Funktion direkt übermittelt.

Beispiel:

var et_Commerce_basketId = '3';
var et_Commerce_product = { id : '3445', name : 'TV 47 Zoll Special Angebot',     category : ['TV', 'LCD', '47', 'Special'], price : '1723.60', };
// Produkt gesehen
etCommerce.sendEvent('viewProduct', et_Commerce_product, et_Commerce_basketId);

Produkt in den Warenkorb gelegt

Um Produkte zu erfassen, die in den Warenkorb gelegt werden (durch Klicken auf einen “in den Warenkorb legen“-Button), ist ein Event zu definieren, das sich an den vorhandenen Button hängt. Zuvor muss ein Produkt-Objekt definiert werden, das die Produktdaten enthält. Die ID des Buttons lautet in diesem Fall “ButtonAddToBasket“ und die Datenübermittlung erfolgt, wenn das JavaScript-Event mousedown ausgelöst wird. Die Anzahl der erfassten Produkte ergibt sich aus einem auf der Webseite hinterlegten Formularfeld “ProductQuantity“.

Beispiel:

var et_Commerce_basketId = '3';
var et_Commerce_product = { id : '3445',  name : 'TV 47 Zoll Special Angebot',  category : [‘TV’, 'LCD', '47', 'Special'],  price : '1723.60', };
var et_Commerce_quantity = Number(document.getElementById('ProductQuantity').value);
etCommerce.attachEvent({'mousedown' : ['ButtonAddToBasket']}, 'insertToBasket', et_Commerce_product, et_Commerce_quantity, et_Commerce_basketId);

Ein Produkt aus dem Warenkorb entfernen

Um die Information zu übermitteln, dass der Kunde ein Produkt wieder aus dem Warenkorb genommen hat, muss das Event “removeFromBasket“ aufgerufen werden. Die Daten werden über die “sendEvent“-Funktion direkt übermittelt.

Beispiel:

var et_Commerce_basketId = '3';
var et_Commerce_product = { id : '3445',  name : 'TV 47 Zoll Special Angebot',  category : ['TV ', 'LCD', '47', 'Special'], price : '1723.60', };
etCommerce.sendEvent('removeFromBasket', et_Commerce_product, 1, et_Commerce_basketId]);

Eine Bestellung beim Klick absenden

Um eine Bestellung direkt beim Klicken auf den Bestellknopf anzumelden, benötigt man ein Event “order“, das an den Button “sendOrder“ angehängt wird. Die Daten werden über die “sendEvent“-Funktion direkt übermittelt.

Beispiel:

var basket = {id : '3',products : [{ product:  { id : '3445',  name : 'Elfrida',  category : ['Tiere', 'Großwild', 'Giraffen', 'Liebe Giraffen'], price : '1723.60',  }, quantity : 1}]}
var order = { orderNumber : '234', status : 'sale',  orderPrice : '5447.2', basket : basket, customerGroup : ‘Tierliebhaber’, deliveryConditions : 'Großer Transport', paymentConditions : 'Sofortzahlung',}
etCommerce.attachEvent( {'mousedown' : ['sendOrder']}, 'order', order);

Cross Device Tracking (optional)

Das Cross Device Tracking ermöglicht die geräteübergreifende Verknüpfung von Besuchern einer Website. Die eindeutige Identifizierung eines Besuchers kann bspw. durch einen Newsletter oder ein Login erfolgen. Mit Hilfe des Parameters “et_cdi“ wird ein Wert (Identifier) übergeben, der zur Identifikation des Website-Besuchers verwendet wird.

  • Der Identifier wird seitens signalize stets gehashed gespeichert.
  • Der Identifier muss pro Website-Besucher eindeutig sein, andernfalls werden unterschiedliche Userprofile zusammengeführt.

border