Projekt erstellen

Kameleoon führt Kampagnen und Feature Flags pro Projekt durch, daher erstellen Sie ein Projekt für jede Website, Web-App oder mobile App, bevor Sie Kameleoon darauf installieren können. Der neue Projektfluss fragt, wofür Sie das Projekt nutzen möchten, erfasst seine Hauptinformationen und führt Sie dann durch die Installation.

​

Neues Projekt hinzufügen

Sie können so viele Projekte in Ihrem Konto einrichten, wie Ihr Plan erlaubt. Ein Projekt kann eine Website, eine mobile App oder jede beliebige Umgebung sein (zum Beispiel Staging oder Produktion), die Sie intern verwenden. So fügen Sie ein neues Projekt hinzu:

1. Melden Sie sich bei Ihrem Kameleoon-Konto an.
2. Klicken Sie auf Admin > Projects.
3. Klicken Sie auf New project.
4. Wählen Sie unter What do you want to use this project for? einen Projekttyp aus. Nach dem Erstellen des Projekts können Sie dessen Typ nicht mehr ändern.
   • Web Experimentation: Führen Sie Web-Kampagnen auf Ihrer Website mit Prompt-Based Experimentation (PBX) oder einem Code Editor durch. Sie wählen in einem späteren Schritt, wie Kameleoon auf Ihrer Website installiert wird.
   • Feature Experimentation: Testen und aktivieren Sie Features mithilfe von Frontend-, Backend- oder Mobile-SDKs. Sie installieren Kameleoon mit den Kameleoon-SDKs.
   • All campaign types: Erstellen und verwalten Sie alle Kampagnentypen aus einem Projekt. Sie installieren Kameleoon auf Ihrer Website und mit SDKs für Feature Experimentation.

5. Wenn Sie Feature Experimentation ausgewählt haben, wählen Sie unter What platform is this project for? die Option Web / Backend oder Mobile app:
   • Web / Backend: Testen Sie Experimente auf Websites und Backend-gesteuerten Features.
   • Mobile app: Testen Sie native Mobile-App-Erfahrungen.

6. Klicken Sie auf Next.
7. Geben Sie die Hauptinformationen des Projekts ein:
   • Main project domain: Die Hauptdomain, die dem Projekt zugeordnet ist. Kameleoon kann Experimente und Personalisierungen über mehrere Domains und Subdomains hinweg durchführen, daher konfiguriert Kameleoon standardmäßig Ihr JavaScript-Snippet auf der Hauptdomain. Ein Projekt mit der Plattform Mobile app hat kein Feld Main project domain.
   • Color: Wählen Sie eine Farbe für das Projekt.
   • Project name (optional): Ein klarer, aussagekräftiger Name, der das Projekt in Dashboards und Listen leichter auffindbar macht. Kameleoon zeigt diesen Namen auf der gesamten Plattform statt die Projekt-URL an. Wenn Sie das Feld leer lassen, zeigt Kameleoon die Projekt-URL an. Ein Projekt mit der Plattform Mobile app erfordert einen Projektnamen.
   • Description (optional): Details, die Ihrem Team helfen, den beabsichtigten Verwendungszweck des Projekts zu verstehen.
   • Tags: Klicken Sie auf Add tag, um ein Tag hinzuzufügen.

8. Klicken Sie auf Next und führen Sie die verbleibenden Schritte durch. Siehe Projektsetup-Schritte.

Sie können die Hauptinformationen jederzeit auf der Registerkarte Overview bearbeiten.

​

Projektsetup-Schritte

Ein Schritt-für-Schritt-Formular führt Sie durch die Installation von Kameleoon auf einem neuen Projekt. Bei einem bestehenden Projekt öffnen sich dieselben Schritte, wenn Sie auf Edit im Bereich Installation method oder Technical configuration der Registerkarte Setup eines bestehenden Projekts klicken, ohne den Schritt Main information. Die Schritte, die Sie sehen, hängen vom Projekttyp und der Installationsmethode ab, die Sie wählen.

​

Schritte nach Projekttyp

Zwei Installationswahlmöglichkeiten ändern die Schritte weiter. Wenn Sie Shopify als Installationsmethode auswählen, überspringt Kameleoon den Schritt Technical configuration. Wenn Sie Tag Manager wählen, werden die Optionen für Loading mode und die Optionen für dynamische Websites nicht angezeigt. Klicken Sie auf dem Schritt Main information auf Next, um fortzufahren, oder auf Cancel, um zu beenden. Klicken Sie auf den Schritten Installation method und Technical configuration auf Back, um zum vorherigen Schritt zurückzukehren, auf Next, um fortzufahren, oder auf Save for later, um Ihren Fortschritt zu speichern. Klicken Sie auf dem Schritt Checklist auf Back oder auf Complete setup, wenn Sie Ihre Aufgaben beendet haben. Wenn Sie die Schritte auf der Registerkarte Setup eines bestehenden Projekts öffnen, ist die letzte Schaltfläche Save changes statt Complete setup. Wenn Sie auf Save for later klicken, speichert Kameleoon das Projekt als Entwurf. Das Projekt erscheint auf der Seite Projects mit dem Status Draft. Wenn Sie auf Complete setup klicken, speichert Kameleoon das Projekt und setzt seinen Status auf Enabled. Um einen Entwurf abzuschließen, klicken Sie auf Edit in der Zeile des Projekts und führen Sie dann die erforderlichen Informationen im Projektablauf aus.

​

Installationsmethode

Der Schritt Installation method definiert, wie Kameleoon auf Ihrer Website läuft. Er gilt für Projekte des Typs Web Experimentation und All campaign types. Wählen Sie unter Installation method eine der folgenden Optionen:

• Code snippet pasted on your site (empfohlen): Installieren Sie Kameleoon, indem Sie das HTML/JavaScript-Snippet zu Ihren Seiten hinzufügen, einschließlich Websites, die mit Server-seitigen Frameworks erstellt wurden.
• Tag Manager (GTM, Tealium iQ, Adobe DTM, …): Stellen Sie Kameleoon über Ihr Tag-Verwaltungssystem bereit, ohne Seitencode zu bearbeiten.
• Shopify: Installieren Sie Kameleoon über Ihr Shopify-Theme oder Ihre App-Einrichtung.

Kameleoon ist mit allen großen Tag-Verwaltungssystemen kompatibel. Kameleoon empfiehlt jedoch dringend, dass Sie Kameleoon nicht mit einem Tag-Manager installieren, da dies die Wahrscheinlichkeit von Flackern in Ihren Kampagnen erhöht. Weitere Informationen finden Sie unter Flackerverwaltung und Leistung. Wenn Sie Code snippet pasted on your site auswählen, zeigt der Schritt auch Loading mode an, das definiert, wie Kameleoon auf Ihrer Website geladen wird:

• Asynchronous with anti-flickering (empfohlen): Lädt Kameleoon asynchron, um die Seitengeschwindigkeit zu erhalten, während eine temporäre CSS-Regel sichtbares Flackern minimiert.
• Asynchronous: Lädt Kameleoon asynchron, ohne die Seite zu blockieren, aber sichtbares Flackern kann auftreten, wenn die Seite vor der Scriptausführung gerendert wird.
• Synchronous: Lädt Kameleoon synchron, um Flackern zu verhindern, blockiert aber die Seite bis zur Ausführung. Kameleoon empfiehlt diesen Modus generell nicht.

Details zu jedem Lademodus finden Sie unter Standardimplementierung.

​

Technische Konfiguration

Der Schritt Technical configuration definiert, wie Ihre Website, Domains und Hosting mit Kameleoon zusammenarbeiten. Dieser Schritt gilt für Projekte des Typs Web Experimentation und All campaign types, außer wenn Sie Shopify als Installationsmethode auswählen. Mit der Installationsmethode Tag Manager beginnt der Schritt direkt mit Resource hosting.

​

Unterstützung für dynamische Websites

Mit der Installationsmethode Code snippet pasted on your site beginnt der Schritt mit der Frage Is your website a dynamic website (SPA or PWA)?. Eine Single-Page-App (SPA) oder Progressive Web App (PWA) lädt Inhalte dynamisch ohne Neuladen der Seite. Das Aktivieren der Unterstützung für dynamische Websites stellt sicher, dass Kameleoon URL-Änderungen erkennt und Scripts für A/B-Tests, Personalisierung und Tracking korrekt ausführt.

• Enable support for dynamic websites: Aktivieren Sie diesen Toggle, wenn Ihre Website eine Web-App mit virtuellen URLs ist.
• Enable dynamic website support for: Wählen Sie den Bereich aus. Sie müssen einen Bereich auswählen, wenn der Toggle aktiviert ist. Die Optionen sind Entire website und Chosen elements in the visual editor.
• Set a custom attribute (optional): Wenn Ihre Website keine eindeutigen IDs für jedes HTML-Element generiert oder dynamische IDs generiert, geben Sie einen Attributnamen ein (zum Beispiel custom-id), den Kameleoon verwendet, um die geänderten Elemente eindeutig zu identifizieren.
• Avoid dynamic IDs selectors (optional): Standardmäßig vermeidet Kameleoon HTML-IDs, die Zahlen mit mehr als 5 Ziffern enthalten. Geben Sie Ihren eigenen regulären Ausdruck ein, um andere IDs auszuschließen.

Der Toggle My site uses a server-side framework (Next.js, Nuxt, SvelteKit, etc.) befindet sich in einer eigenen Karte unterhalb der Optionen für dynamische Websites. Wenn Sie ihn aktivieren, bietet die Aufgabe Add JavaScript snippet to your website im Schritt Checkliste zusätzlich zum JavaScript-Snippet eine empfohlene Installation für Server-Side-Rendering-(SSR-)Frameworks an. Weitere Informationen finden Sie unter Experimente auf einer Single-Page-App einrichten und enableSinglePageSupport-Referenz.

​

Ressourcen-Hosting

Standardmäßig stellt Kameleoon seine Ressourcen vom Kameleoon-CDN bereit. Wenn Sie sich dafür entscheiden, diese selbst zu hosten, werden Sicherheit und Verfügbarkeit Ihre Verantwortung. Jede Option hat einen Link zu View documentation.

• Self-host the script file: Stellt das Haupt-Kameleoon-Script von Ihrem eigenen Server oder CDN bereit. Geben Sie die vollständige URL, unter der Sie die Scriptdatei hosten, in Script file URL ein.
• Self-host images: Stellt Kameleoon-Bild-Assets von Ihrem eigenen Server oder CDN bereit. Geben Sie die Basis-URL, unter der Sie Bilddateien hosten, in Image base URL ein. Verwenden Sie das Self-Hosting von Bildern nur über ein CDN, das einen integrierten Replikationsmechanismus bietet.

Weitere Informationen finden Sie unter Einfaches Self-Hosting und On-Premises-Optionen.

​

Domains und Subdomains

Standardmäßig erlaubt Kameleoon nur Ihre Hauptdomain und ihre Subdomains (*.example.com). Nur aufgelistete Domains und Subdomains können den Grafikeditor verwenden. Sie gelten auch, wenn das Experiment-Targeting auf Besucherdaten beruht, die in Echtzeit zwischen der Hauptdomain und ihren Subdomains freigegeben werden. Kameleoon füllt die Liste mit einem Wildcard-Eintrag für Ihre Hauptdomain vor. Um eine weitere Domain hinzuzufügen, geben Sie diese in das Feld unterhalb der Liste ein und klicken Sie auf Add domain. Um eine Domain zu entfernen, klicken Sie auf das X am Ende ihrer Zeile. Aktivieren Sie unter Cross-domain tracking den Toggle Track visitors across listed subdomains, um Besucherdaten über die aufgelisteten Domains hinweg freizugeben und für Echtzeit-Targeting zu nutzen. Kameleoon verwendet lokalen Speicher, um Sitzungsdaten zu verfolgen, die Sie beim Kampagnen-Targeting verwenden können. Cross-Domain-Tracking ermöglicht es, Besucher auf verschiedenen Subdomains zu verfolgen (zum Beispiel example.com und payment.example.com). Kameleoon behandelt Ihre Besucher nicht als neue Besucher, wenn sie zwischen Ihren Domains und Subdomains navigieren, und ihre Erfahrungen bleiben über Ihre digitalen Eigenschaften hinweg konsistent. Cross-Domain-Tracking ist nur erforderlich, wenn Sie beabsichtigen, Sitzungsdaten über alle Ihre Domains für erweitertes Verhaltens-Targeting zu verwenden. Weitere Informationen finden Sie unter Sitzungsdatenspeicherung über Subdomains hinweg einheitlich gestalten.

​

Checkliste

Der Schritt Checklist listet die erforderlichen Aufgaben auf, die Sie ausführen, um mit der Durchführung von Experimenten zu beginnen. Er kann auch optionale Aufgaben auflisten. Öffnen Sie eine Aufgabe, um ihre Anweisungen anzuzeigen, und klicken Sie auf Mark as completed, wenn Sie fertig sind. Jede Aufgabengruppe zeigt an, wie viele ihrer Aufgaben Sie abgeschlossen haben, zum Beispiel 0 of 2 tasks completed. Wenn Sie fertig sind, klicken Sie auf Complete setup. Die Aufgaben werden in bis zu zwei Gruppen angezeigt:

• For your A/B tests and personalizations: Aufgaben zur Installation von Kameleoon auf Ihrer Website. Diese Gruppe erscheint für Projekte vom Typ Web Experimentation und All campaign types.
• For your flags and feature experiments: Aufgaben zur Installation eines Kameleoon-SDK. Diese Gruppe erscheint für Projekte vom Typ Feature Experimentation und All campaign types.

​

Aufgaben für Web-Experimente und Personalisierung

Die Gruppe For your A/B tests and personalizations listet die Aufgaben zur Installation von Kameleoon auf Ihrer Website auf. Die Aufgaben hängen von der von Ihnen ausgewählten Installationsmethode ab.

​

Aufgaben für Codefragmente

Mit der Installationsmethode Code snippet pasted on your site enthält die Checkliste die folgenden Aufgaben. Add JavaScript snippet to your website installiert Kameleoon auf Ihren Seiten. Klicken Sie auf Copy, fügen Sie das Snippet direkt nach dem <head>-Tag in Ihren Webseiten, vor allen anderen Scripts, ein und klicken Sie auf Mark as completed. Ein Link zum Implementation guide öffnet die Installationsanweisungen. Wenn Sie My site uses a server-side framework im Schritt Technical configuration aktiviert haben, hat die Aufgabe zwei Optionen. SSR Framework (empfohlen) ist die native Installation für Ihr Framework: Sie verwenden den Projekt-Sitecode, um ihn zu initialisieren. Die Aufgabe zeigt den Project sitecode mit einer Kopierschaltfläche. Wählen Sie Next.js, Nuxt oder SvelteKit in Select your SSR framework und klicken Sie auf Apply. Das Framework erscheint in einer Tabelle unterhalb der Liste mit einem Link zu seiner Dokumentation. JavaScript snippet ist die Standardinstallation: Klicken Sie auf Copy und fügen Sie das Snippet direkt nach dem <head>-Tag in Ihren Webseiten, vor allen anderen Scripts, ein. Set up file synchronization umfasst die Aktualisierung einer selbst gehosteten Kopie der Kameleoon-Anwendungsdatei. Die Anwendungsdatei ist dynamisch: Ihr Inhalt ändert sich jedes Mal, wenn sich ein Experiment- oder Personalisierungsstatus auf der Plattform ändert, und jedes Mal, wenn Sie die Konfiguration ändern. Richten Sie die Synchronisierung zwischen der auf Ihrem Server oder CDN gehosteten Datei und der ursprünglichen Datei, die Kameleoon generiert, ein und klicken Sie dann auf Mark as completed. Ihr CDN bietet eine eigene Schnittstelle für diese Konfiguration. Auf einem Standard-HTTP-Server wie nginx oder Apache verwenden Sie einen Cron-Job, der einen wget-Befehl ausführt, um die Datei alle 5 Minuten abzurufen. Befehle und Details finden Sie unter Self-Hosting von Anwendungsdatei und öffentlichen Ressourcen. Die Aufgabe erscheint für die Codefragment- und Tag-Manager-Installationsmethoden, und ein Link zum Implementation guide öffnet die Anweisungen.

​

Aufgaben für Tag Manager

Mit der Installationsmethode Tag Manager enthält die Checkliste die folgenden Aufgaben. Add this code to your Tag Manager installiert Kameleoon über Ihr Tag-Verwaltungssystem. Klicken Sie auf Copy, fügen Sie den Code in Ihre Tag-Manager-Schnittstelle ein und klicken Sie auf Mark as completed. Ein Link zum Implementation guide öffnet die Anweisungen. Set up file synchronization umfasst die Aktualisierung einer selbst gehosteten Kopie der Kameleoon-Anwendungsdatei. Es ist die gleiche Aufgabe wie beim Codefragment: Richten Sie die Synchronisierung zwischen der auf Ihrem Server oder CDN gehosteten Datei und der ursprünglichen Datei, die Kameleoon generiert, ein und klicken Sie dann auf Mark as completed. Nach dem Abschluss der Tag-Manager-Aufgabe listet die Checkliste diese als nächste erforderliche Aufgabe auf.

​

Shopify-Aufgaben

Mit der Installationsmethode Shopify hat die Gruppe eine einzelne Aufgabe. Installation via the Shopify app installiert Kameleoon über die Kameleoon-Integration im Shopify App Store. Kopieren Sie den Projekt-Sitecode, verwenden Sie ihn in Shopify, um Kameleoon auf Ihrer Website zu installieren, und klicken Sie auf Mark as completed. Ein Link in der Aufgabe öffnet die Installationsrichtlinien.

​

Aufgabe zum Cross-Subdomain-Tracking

Wenn Sie Track visitors across listed subdomains im Schritt Technical configuration aktiviert haben, enthält die Checkliste auch Host the Kameleoon static HTML file. Die Aufgabe ermöglicht Cross-Subdomain-Targeting über Ihre aufgelisteten Subdomains hinweg. Laden Sie die HTML-Datei herunter, laden Sie sie in das Verzeichnis mit statischen Dateien Ihrer Hauptdomain hoch, damit es öffentlich zugänglich ist, geben Sie die vollständige URL der gehosteten Datei ein und klicken Sie auf Mark as completed.

​

Aufgaben für Flags und Feature-Experimente

Die Gruppe For your flags and feature experiments listet die Aufgaben zur Installation eines Kameleoon-SDK auf.

​

Aufgabe zum Installieren des SDK

Install the SDK ist eine erforderliche Aufgabe. Folgen Sie der SDK-Installationsanleitung für Ihre Programmiersprache und verwenden Sie den Sitecode, der mit Ihrem Projekt verknüpft ist, um das SDK zu initialisieren. Die Aufgabe zeigt den Project sitecode mit einer Kopierschaltfläche. Wählen Sie Ihr SDK in der Liste Select your SDK und klicken Sie auf Apply. Das SDK wird in einer Tabelle unterhalb der Liste mit einem Link zu seiner Dokumentation auf der linken Seite der Tabelle angezeigt. Klicken Sie auf Mark as completed, wenn Sie fertig sind. Um Kameleoon auf einer Website, Web-App oder mobilen App mit einem SDK zu installieren, lesen Sie die Dokumentation unter Client-seitige und Mobile-SDKs.

​

Optionale Tag-Manager-Aufgabe

Add this code to your Tag Manager ist eine optionale Aufgabe. Kopieren Sie den Code, fügen Sie ihn in Ihre Tag-Manager-Schnittstelle ein, um Kameleoon auf Ihrer Website zu installieren, und klicken Sie auf Mark as completed. Die Aufgabe erscheint nicht in einem Projekt mit der Plattform Mobile app, dessen Checkliste nur die Aufgabe Install the SDK enthält. Verwalten Sie nach Abschluss der Einrichtung die Einstellungen, das Einverständnis, die Scripts und die Installation des Projekts unter Projekte verwalten.