Optimize installieren

Optimize auf Ihrer Website einfügen

Zum Installieren von Optimize müssen Sie auf Ihrer Website ein kurzes Code-Snippet einfügen, damit Besucher Tests bzw. Personalisierungen aus Optimize sehen können.

Vorbereitung

Zuerst einmal benötigen Sie ein Optimize-Konto und einen Container, der mit einer Google Analytics-Property verknüpft ist. Weitere Informationen dazu finden Sie im Hilfeartikel Optimize einrichten. Außerdem müssen Sie auf das HTML Ihrer Website zugreifen können, damit Sie es mit dem Optimize-Snippet taggen können.

Eine Methode auswählen

Je nachdem, wie Sie Google Analytics eingerichtet haben, empfehlen wir für die Installation von Optimize zwei Methoden:

  1. Methode 1 – bei Verwendung des allgemeinen Website-Tags (gtag.js)
  2. Methode 2 – bei Verwendung von Google Tag Manager

Methode 1: Optimize mit dem allgemeinen Website-Tag (gtag.js) installieren

Hinweis: Wenn Sie Google Tag Manager verwenden, folgen Sie dieser Anleitung.

Schritt 1: Allgemeines Website-Tag mit Analytics installieren

Hinweis: Wenn Sie auf Ihrer Website bereits ein allgemeines Website-Tag mit Analytics eingefügt haben, können Sie direkt mit Schritt 2 weitermachen und die Container-ID für Optimize einfügen.

Das allgemeine Website-Tag (gtag.js) mit Google Analytics muss vorhanden sein, um Optimize zu installieren. Sie können es in Google Analytics über die Admin-Konsole abrufen (Admin > Spalte "Property" > Tracking-Informationen > Tracking-Code) oder dem Beispiel unten folgen.

Beispiel: Allgemeines Website-Tag mit Google Analytics

Mit dem folgenden Tag wird die gtag.js-Bibliothek geladen, GA_TRACKING_ID als Standard-Property-ID für Google Analytics festgelegt und ein Seitenaufruftreffer an Google Analytics gesendet.

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
</script>

 

Hinweis: Sie müssen GA_TRACKING_ID durch Ihre Google Analytics-Tracking-ID ersetzen.

Weitere Informationen zum Einrichten des Trackings in Analytics finden Sie in der Google Analytics-Hilfe.

Schritt 2: Optimize zum allgemeinen Website-Tag hinzufügen

Wenn Sie das allgemeine Website-Tag (gtag.js) mit der Google Analytics-Tracking-ID eingerichtet haben, müssen Sie die Container-ID für Optimize in der Zeile gtag('config' einfügen:

   gtag('config', 'GA_TRACKING_ID', { 'optimize_id': 'OPT_CONTAINER_ID'});

In Optimize können Sie Ihre Analytics- und Optimize-IDs automatisch in das angepasste allgemeine Website-Tag einfügen lassen. Wählen Sie hierzu "Container" > "Containerkonfiguration" > "Optimize-Plug-in installieren" aus.

Beispiel: Allgemeines Website-Tag mit Google Analytics und Optimize

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID', { 'optimize_id': 'OPT_CONTAINER_ID'});
</script>
 

Hinweis: Ersetzen Sie GA_TRACKING_ID durch Ihre Google Analytics-Tracking-ID und OPT_CONTAINER_ID durch Ihre Optimize-Container-ID.

Schritt 3: Allgemeines Website-Tag auf der Website installieren

Fügen Sie das Code-Snippet für das allgemeine Website-Tag direkt nach dem <head>-Tag auf allen Seiten ein, die Sie optimieren möchten.

  • Wenn das allgemeine Website-Tag bereits auf Ihrer Website installiert ist, fügen Sie noch die Optimize-Container-ID ein (siehe Schritt 2 oben) und verschieben Sie das schon vorhandene Tag an den Anfang des <head>-Tags.
  • Falls sich das allgemeine Website-Tag noch nicht auf Ihrer Website befindet, fügen Sie es am Anfang des <head>-Tags aller Seiten ein, die Sie optimieren möchten.

Hinweis: Pro Seite ist nur ein allgemeines Website-Tag nötig.

Best Practices für die Platzierung von Snippets

Sie erzielen die beste Leistung, wenn Sie das allgemeine Website-Tag ganz am Anfang des <head>-Tags aller Seiten platzieren, die Sie optimieren möchten.

Vor dem allgemeinen Website-Tag dürfen nur die folgenden Elemente stehen:

  1. Initialisierung der Datenschicht. Hinweis: Die dataLayer-Variable darf nach dem Snippet zum Ausblenden von Seiten nicht neu zugewiesen werden.
  2. Alle Skripts, in denen JavaScript-Variablen und -Funktionen deklariert oder Cookies erstellt werden, die Sie in Optimize-Tests verwenden möchten, also z. B. jQuery oder eine JavaScript-Bibliothek zur Implementierung oder für das Targeting. Hinweis: jQuery wird von Optimize nicht standardmäßig installiert.
  3. Das optionale Snippet zum Ausblenden von Seiten, um Seitenflackern zu vermeiden

Methode 2: Optimize mit Google Tag Manager installieren

Wir empfehlen dringend, für die Installation optimize.js zu verwenden, da damit die beste Leistung erzielt wird. Außerdem ist es die einfachste Methode, um Optimize zu installieren.

Wenn Sie Optimize mit Google Tag Manager einrichten möchten, folgen Sie der Anleitung unten. Halten Sie sich bei anderen Tag-Management-Systemen an die Anleitung des jeweiligen Anbieters, um Optimize zu Ihrem bestehenden Google Analytics-Tag hinzuzufügen.

Benutzerdefinierte Tracker-Einstellungen

Wenn Sie benutzerdefinierte Tracker-Einstellungen verwenden, müssen Sie die freigegebene Variable Google Analytics-Einstellungen in Tag Manager und Analytics verwenden, damit die Tracker-Einstellungen der Tags zueinander passen.

Schritt 1: Notwendige Informationen erfassen

Für die Installation von Optimize benötigen Sie die folgenden Informationen:

  1. Ihre Analytics-Tracking-ID
  2. Ihre Optimize-Container-ID
  3. Bestätigung, dass in den Tracker-Einstellungen von Tag Manager und Analytics die freigegebene Variable Google Analytics-Einstellungen verwendet wird

Schritt 2: Optimize in Tag Manager konfigurieren

Sobald die oben genannten Informationen vorliegen, können Sie Optimize in Tag Manager wie unten beschrieben konfigurieren:

  1. Melden Sie sich in Tag Manager an und wählen Sie ein Konto aus.
  2. Klicken Sie auf Tags > Neu.
  3. Klicken Sie auf Tag-Konfiguration > Google Optimize.
  4. Geben Sie Ihre Container-ID für Optimize ein.
  5. Optional: Maximieren Sie Name der globalen Funktion (Universal Analytics) und wählen Sie eine Variable für Google Analytics-Einstellungen aus. Damit können Sie die vom Universal Analytics-Tag verwendete globale Funktion umbenennen.
  6. Speichern Sie das Tag ohne Trigger. Hinweis: Sie müssen den Trigger für Seitenaufrufe in dem Analytics-Tag konfigurieren, das das Optimize-Tag auslöst.
  7. Öffnen Sie das Analytics-Tag „Seitenaufruf“ für die Analytics-Property, die mit Ihrem Optimize-Container verknüpft ist.
  8. Klicken Sie auf Tag-Konfiguration > Erweiterte Einstellungen > Tag-Reihenfolge.
  9. Setzen Sie ein Häkchen im Kästchen zum Auslösen eines Tags, bevor dieses Tag ausgelöst wird. Klicken Sie unter Setup-Tag auf das Menü und wählen Sie ein Optimize-Tag aus.
  10. Legen Sie für das Optimize-Tag fest, dass es einmal pro Seite ausgelöst werden soll, und speichern Sie es.
  11. Veröffentlichen Sie den Tag Manager-Container, damit die Änderungen wirksam werden. 

Weitere Informationen finden Sie in diesem Hilfeartikel zum Erstellen von Tags für Optimize.

Hinweis:
  • Seiten können nicht richtig ausgeblendet werden, wenn für das Analytics-Tag „Seitenaufruf“ kein Trigger für Seitenaufrufe eingerichtet ist, weil die Ereignisse „DOM ist bereit“ und „Fenster geladen“ zu lange dauern, um den Optimize-Container zu laden.
  • Wenn Sie den Namen einer globalen Funktion anstelle einer Variablen für Universal Analytics-Einstellungen verwendet haben, können Sie den Wert aus dem Feld Name der globalen Funktion entfernen. Beim Speichern lässt sich die globale Funktion dann nur noch mithilfe einer Variablen für Universal Analytics-Einstellungen umbenennen.

Best Practices für die Platzierung von Snippets

Sie erzielen die beste Leistung, wenn Sie das Optimize-Snippet ganz oben im <HEAD>-Bereich aller Seiten einfügen, die Sie optimieren möchten.

Nur die folgenden Elemente dürfen vor dem Optimize-Snippet platziert werden:

  1. dataLayer-Initialisierungscode. Hinweis: Die dataLayer-Variable darf nach dem Snippet gegen Seitenflackern nicht neu zugewiesen werden.
  2. Alle Skripts, in denen JavaScript-Variablen und -Funktionen deklariert oder Cookies gesetzt werden, die Sie in Optimize verwenden, also z. B. eine jQuery- oder JavaScript-Bibliothek zur Implementierung oder für die Ausrichtung. Hinweis: jQuery wird nicht standardmäßig mit Optimize installiert.
  3. Das Snippet gegen Seitenflackern (optional).

 

Optimize-Installation überprüfen

Erstellen Sie am besten eine kleine Testpersonalisierung, um zu sehen, ob Optimize korrekt installiert ist. Sie können dann mit der Diagnose der Installation und dem Vorschaumodus feststellen, ob alles richtig funktioniert. Die Testpersonalisierung löschen Sie später einfach wieder.

Fehlerbehebung bei Seitenflackern

Die Anleitung oben gilt für die meisten Websites. Falls Seitenflackern auftritt, wenn Sie Optimize verwenden, verschieben Sie das allgemeine Website-Tag oder die Tag Manager-Verknüpfung weiter nach oben im <head>-Tag der Seite. Sollte das Seitenflackern immer noch bemerkbar sein, installieren Sie das Snippet gegen Seitenflackern und passen Sie es an.

Weitere Implementierungsmöglichkeiten

Das allgemeine Website-Tag (gtag.js) und Google Tag Manager werden als Tagging-Methoden für neue Implementierungen empfohlen. Wenn Sie Universal Analytics verwenden, können Sie in diesem Hilfeartikel nachlesen, wie Sie Optimize auf Ihrer Website mit analytics.js installieren. In dieser Anleitung erfahren Sie, wie Sie Optimize direkt auf der Seite zusammen mit Tag Manager installieren können.

Hinweis: Optimize funktioniert nicht mit der bisherigen ga.js-Bibliothek.

Erweiterte Tagging-Methoden

Dynamische Seiten und Web-Apps

Sie können Variablen auswählen, die festgelegt werden, nachdem das Optimize-Snippet z. B. mit dynamischen Seiten und Web-Apps geladen wurde. Verwenden Sie hierzu Aktivierungsereignisse.

Mehrere Optimize- oder Tag Manager-Container

Wenn Sie mehrere gtag-Befehle auf einer Seite verwenden möchten, fügen Sie einfach auf allen Seiten bis auf einer 'send_page_view': false ein.

Beispiel: Mehrere gtag-Befehle

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
 window.dataLayer = window.dataLayer || [];
 function gtag(){dataLayer.push(arguments);}
 gtag('js', new Date());


 gtag('config', 'GA_TRACKING_ID', { 'optimize_id': 'OPT_CONTAINER_ID_1', 'send_page_view': false});

 gtag('config', 'GA_TRACKING_ID', { 'optimize_id': 'OPT_CONTAINER_ID_2'});

</script>

 

Hinweise: Ersetzen Sie GA_TRACKING_ID durch Ihre Google Analytics-Tracking-ID sowie OPT_CONTAINER_ID_1 und OPT_CONTAINER_ID_2 durch Ihre Optimize-Container-IDs.

Wenn Sie das optionale Snippet zum Ausblenden von Seiten verwenden, müssen Sie es so konfigurieren, dass alle Container übergeben werden. Weitere Informationen zum Laden mehrerer Container finden Sie auf der Website für Optimize-Entwickler.

Benutzerdefinierter dataLayer-Name

Wenn Sie den dataLayer-Namen anpassen möchten, müssen Sie den Parameter "l" im Skript übergeben und auch die gtag-Funktion ändern.

Beispiel: Benutzerdefinierter dataLayer-Name

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID&l=myNewName"></script>
<script>
window.myNewName = window.myNewName || [];
function gtag(){myNewName.push(arguments);}
gtag('js', new Date());

gtag('config', 'GA_TRACKING_ID', { 'optimize_id': 'OPT_CONTAINER_ID'});
</script>

 

Hinweis: Ersetzen Sie GA_TRACKING_ID durch Ihre Google Analytics-Tracking-ID und OPT_CONTAINER_ID durch Ihre Optimize-Container-ID.

Im Beispiel oben sind drei Änderungen hervorgehoben:

  1. &l=myNewName wird im <script>-Tag eingefügt.
  2. window.myNewName = window.myNewName || [];
  3. function gtag(){myNewName.push(arguments);}

Wenn Sie das Snippet zum Ausblenden von Seiten verwenden, damit weniger Flackern auftritt, müssen Sie den dataLayer-Namen in der letzten Zeile ändern, falls Sie einen benutzerdefinierten dataLayer-Namen verwenden. Im Beispiel unten haben wir 'dataLayer' in 'myNewName' geändert.

Beispiel: Benutzerdefinierter dataLayer-Name mit Ausblenden von Seiten

<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','myNewName',4000,
{'OPT_CONTAINER_ID':true});</script>

Hinweis: Ersetzen Sie OPT_CONTAINER_ID durch Ihre Optimize-Container-ID.

War das hilfreich?
Wie können wir die Seite verbessern?
Suche
Suche löschen
Suche schließen
Google-Apps
Hauptmenü
Suchen in der Hilfe
true
101337
false