Zum Hauptinhalt springen

Chrome-Browser-Erweiterung

Zuletzt aktualisiert am 24. März 20263 Min. Lesezeit
Inhaltsverzeichnis

Kurz gesagt​

Mit der Varify Chrome-Erweiterung kannst du Varify lokal in deinem Browser testen, auch wenn das Code-Snippet noch nicht auf der Seite integriert ist. Außerdem kannst du damit prüfen, ob dein Script korrekt implementiert wurde. Der Responsive Device Switcher steht dir ebenfalls zur Verfügung, selbst wenn er standardmäßig auf deiner Website blockiert ist. Zusätzlich zeigt die Erweiterung alle aktiven Experimente an und bietet dir die Möglichkeit, mühelos zwischen den Varianten eines Experiments zu wechseln.

Installation der Chrome-Erweiterung​

  1. Erweiterung herunterladen:
  1. Installation und Aktivierung in Chrome:
  • Klicke auf „Hinzufügen“, um die Erweiterung zu installieren.
  • Aktiviere die Erweiterung nach der Installation.
  • Füge sie deiner Erweiterungsleiste in Chrome hinzu
Varify-Preview-Plugin meldet „Snippet found“ und listet vier aktive Experimente mit ihrer zugewiesenen Variante auf

Funktionen der Varify.io Chrome-Erweiterung​

Lokale Einbindung des Varify-Snippets​

Mit der Varify Chrome-Erweiterung kannst du das Varify-Code-Snippet nur lokal in deinem Browser ausführen, um den Editor und die Funktionen von Varify zu testen.

So funktioniert es:

  1. Öffne das Varify-Dashboard und suche nach "Get Snippet Here".
  2. Kopiere den dort angezeigten Varify-Snippet.
  3. Öffne die Varify.io Chrome-Erweiterung.
  4. Füge den kopierten Snippet in das Feld "Your Snippet Code" innerhalb der Erweiterung ein.
  5. Gib die Domain der Website, die du testen möchtest, in das Feld „Domain“ ein (Beispiel: test.com oder varify.io)
  6. Speichere den Snippet und die Domain, indem du auf „Save Snippet“ klickst
  7. Aktiviere den Schalter "Integrate Snippet", um den Snippet nur in deinem Browser auszuführen.
important

WichtigDiese Version gilt nur für deinen Browser und ist für andere Nutzer nicht sichtbar. Sobald der Varify-Snippet direkt in die Website integriert wurde, solltest du den Schalter wieder deaktivieren, um doppelte Implementierungen zu vermeiden.

Vorher und nachher: Bei aktiviertem „Integrate Snippet“ werden der Account-Snippet und die Domain eingegeben und mit „Save Snippet“ gespeichert

Beispiel 1: Varify Editor testen​

Du kannst den Varify Editor ausprobieren, ohne das Snippet direkt in deine Website zu integrieren. So kannst du dich mit den Funktionen vertraut machen und erste Änderungen testen.

Beispiel 2: Erste Test-Experimente erstellen​

Richte erste Experimente ein und zeige sie nur in deinem eigenen Browser an. So kannst du prüfen, wie Änderungen aussehen, bevor du das Snippet dauerhaft in die Website integrierst.

Integration des Code-Snippets prüfen​

Im oberen rechten Bereich der Varify Chrome-Erweiterung siehst du auf einen Blick, ob der Varify Code-Snippet bereits in den Website-Code integriert ist.

❗️Wichtig: Hierbei geht es um die Integration direkt im Website-Code, nicht um das Snippet, das du über die Chrome-Erweiterung eingefügt hast.

🟢 Grüner Punkt & „Snippet found“ → Das Snippet ist erfolgreich in die Website integriert.

🟠 Oranger Punkt & „Snippet not found“ → Das Snippet wurde nicht gefunden und muss noch integriert werden.

Der Plugin-Header in beiden Zuständen: „Snippet found“ mit einem grünen Punkt und „Snippet not found“ mit einem orangen

Umgehen von Problemen mit dem Responsive Device Switcher​

Der „Responsive Device Switcher“ im Visual Editor ermöglicht es dir, eine Website in verschiedenen Bildschirmbreiten anzuzeigen.

In manchen Fällen können Framing-Beschränkungen verhindern, dass der Device Switcher die Website lädt. In diesem Fall bietet die Varify Chrome-Erweiterung eine einfache Lösung:

  1. Aktiviere den Schalter „Allow Responsive Device Switcher“ in der Chrome-Erweiterung.
  2. Lade die Seite neu.
Varify-Editor mit ausgeschaltetem Device Switcher, der eine leere Seite zeigt, und mit eingeschaltetem Device Switcher, der die gerenderte Seite zeigt

Aktive Experimente​

Unter „Active Experiments“ siehst du alle aktiven Experimente auf der Seite, die du dir aktuell ansiehst. Sowie die Variante, der du gerade zugewiesen bist

Damit kannst du schnell prüfen, ob die Einstellungen für „Page Targeting“ und „Audience Targeting“ korrekt sind und ob das Experiment für dich wie vorgesehen ausgespielt wird.

Plugin mit der hervorgehobenen „Active Experiments“-Liste, die jedes laufende Experiment mit seiner ID und der Variante, die der Besucher sieht, benennt

Experiment-Varianten-Umschalter​

Der Experiment Variation Switcher in der Varify Chrome-Erweiterung ermöglicht es dir, deine zugewiesene Variante für die auf der Seite ausgespielten Experimente zu ändern.

So funktioniert es:

  1. Das Dropdown unter „Experiment Variation Switcher" listet alle aktiven Experimente auf der Seite auf. Wähle das Experiment aus, für das du die Variante ändern möchtest.
  2. Die aktuell aktive Variante wird im Dropdown unter „Active Variation" angezeigt. Wähle hier die Variante aus, zu der du wechseln möchtest.
  3. Klicke auf „Switch Variation", um sie zu ändern.
important

TIPP: Diese Funktion ist besonders hilfreich für die Qualitätssicherung, da du zwischen den Varianten wechseln und deren Darstellung überprüfen kannst.
Mehr dazu erfährst du hier: A/B-Testing - Qualitätssicherung

Plugin mit ausgewähltem Experiment „optimization (16848)“ und „variation-1 (23740)“ als aktiver Variante festgelegt, vor „Switch Variation“
Auf dieser Seite