Anleitung zum Personalisieren von Onsite-Inhalten mit der Gruppenmitgliedschafts-API von Klaviyo

Übersicht

Erfahre, wie du die Methode getGroupMembership des JavaScript-Objekts klaviyo verwendest, um die Listen- oder Segmentzugehörigkeit eines identifizierten Besucher*in zu prüfen und die Ergebnisse zu nutzen, um deine Website zu personalisieren. Dafür musst du das klaviyo -Objekt laden und ein Array mit Listen- oder Segment-IDs übergeben, die geprüft werden sollen.

Bevor du anfängst

Du benötigst Zugriff auf den Code deiner Website. Arbeite mit einer*m Entwickler*in zusammen, wenn du Hilfe bei JavaScript, beim Installieren der Snippets oder beim Anwenden von Personalisierung auf deiner Website brauchst.

Die API für Gruppenmitgliedschaften erfordert, dass Klaviyo den Browser der Besucher*innen identifiziert und ihn einem Profil zuordnet. Es kann keine Listen- oder Segmentzugehörigkeit für eine*n nicht identifizierte*n Besucher*in zurückgeben. Zu den gängigen Arten, wie Klaviyo Besucher*innen identifiziert, gehören:

• Wenn jemand über eine Klaviyo Email auf deine Website geklickt hat
• Wenn sich jemand über ein Klaviyo-Formular angemeldet hat
• Wenn deine Website benutzerdefiniertes Tracking verwendet, um jemanden bei der Anmeldung in Klaviyo zu identifizieren

Sieh dir Klaviyos Video zur Verwendung der Group-Membership-API an.

Klaviyo.js installieren und das Klaviyo-Objekt laden

Installiere zuerst Klaviyo.js, falls du das noch nicht getan hast. Klaviyo.js, auch bekannt als Klaviyos „aktiv vor Ort“-JavaScript, unterstützt das klaviyo -Objekt. Wenn deine E-Commerce-Integration Klaviyo.js auf deiner Website installiert hat, musst du es nicht erneut installieren. Andernfalls installiere es manuell, bevor du das klaviyo -Objekt verwendest.

Um das klaviyo -Objekt sofort beim Laden der Seite zu verwenden, empfehlen wir, das unten stehende Snippet manuell auf deiner Website zu installieren (zusätzlich zur Installation von Klaviyo.js, wie oben erwähnt). Das klaviyo -Objekt muss nur einmal pro Seite geladen werden.

So lädst du das Klaviyo -Objekt:

 
!(function () {
  if (!window.klaviyo) {
    window._klOnsite = window._klOnsite || [];
    try {
      window.klaviyo = new Proxy(
        {},
        {
          get: function (n, i) {
            return "push" === i
              ? function () {
                  var n;
                  (n = window._klOnsite).push.apply(n, arguments);
                }
              : function () {
                  for (
                    var n = arguments.length, o = new Array(n), w = 0;
                    w < n;
                    w++
                  )
                    o[w] = arguments[w];
                  var t =
                      "function" == typeof o[o.length - 1] ? o.pop() : void 0,
                    e = new Promise(function (n) {
                      window._klOnsite.push(
                        [i].concat(o, [
                          function (i) {
                            t && t(i), n(i);
                          },
                        ]),
                      );
                    });
                  return e;
                };
          },
        },
      );
    } catch (n) {
      (window.klaviyo = window.klaviyo || []),
        (window.klaviyo.push = function () {
          var n;
          (n = window._klOnsite).push.apply(n, arguments);
        });
    }
  }
})();

Listen- oder Segmentmitgliedschaft prüfen

So verwendest du die Methode getGroupMembership des klaviyo -JavaScript-Objekts für Onsite-Personalisierung:

1. Wähle in deinem Code die Listen- oder Segment-IDs aus, für die du die Mitgliedschaft prüfen möchtest. Du kannst pro Aufruf insgesamt bis zu 50 IDs übergeben.
2. Identifiziere die*n Besucher*in auf deiner Website über ein Klaviyo-Formular oder eine andere Identifizierungsmethode. Wenn du klaviyo.identify in deinem Code aufrufst, warte, bis es abgeschlossen ist, bevor du die Mitgliedschaft überprüfst.
3. Führe einen Aufruf im folgenden Format aus, mit einem Array der Listen- oder Segment-IDs, deren Mitgliedschaft du prüfen möchtest:

klaviyo.getGroupMembership(['listID1', 'listID2', 'listID3'])

Die Methode gibt ein Promise zurück, das zu einem Array aufgelöst wird, das nur die IDs aus deinem Eingabearray enthält, zu denen die identifizierte Besucher*in gehört. Verwende .then(), um mit dem Ergebnis zu arbeiten, wie unten gezeigt, oder warte in einer async-Funktion auf das Ergebnis. Ein leeres Array kann bedeuten, dass der*die Besucher*in zu keiner der Listen oder Segmente gehört, die du angegeben hast, dass der*die Besucher*in nicht identifiziert werden konnte, dass du mehr als 50 IDs übergeben hast oder dass die Anfrage fehlgeschlagen ist. Ein leeres Ergebnis allein unterscheidet diese Fälle nicht.

Verwende die zurückgegebene Liste und Segment-IDs im Code deiner Website oder in einem Web-Personalisierungstool, um relevante Produkte, Inhalte und mehr auszuwählen. Füge die Logik hinzu, die deine Seite ändert, nachdem das Ergebnis verfügbar ist, und halte Standardinhalte verfügbar, wenn keine passenden IDs zurückgegeben werden.

Codebeispiel

Dieses Beispiel prüft die Mitgliedschaft in mehreren Segmenten. Ersetze die Platzhalter-Strings durch deine Segment-IDs. Der Code innerhalb von .then() wird ausgeführt, nachdem das Ergebnis verfügbar ist; füge deinen Personalisierungs-Code für deine Website wie angegeben hinzu.

klaviyo.getGroupMembership([
  'VIPSegmentID',
  'UnEngagedSegmentID',
  'DogLoversSegmentID'
]).then((customerSegments) => {
  if (customerSegments.includes('VIPSegmentID')) {
    // Add code to display your VIP content here.
  }
});

Auswirkungen auf die Performance der Website

Klaviyo lädt das Web-Personalisierungsskript asynchron. Halte den Standardinhalt deiner Website verfügbar, während die Mitgliedschaftsanfrage abgeschlossen wird, und wende anschließend die Personalisierung an, nachdem du das Ergebnis erhalten hast.

Mitgliedschaftsantworten können vom Browser zwischengespeichert werden, sodass wiederholte Anfragen für dieselbe Besucher*in und dieselben IDs die zwischengespeicherte Antwort wiederverwenden können. Eine andere Anfrage oder ein abgelaufener Cache kann einen weiteren API-Aufruf erfordern, daher ist nicht garantiert, dass das Ergebnis eine Änderung der Mitgliedschaft sofort widerspiegelt.

Ergebnis

Du kannst jetzt das klaviyo -JavaScript-Objekt mit Web-Personalisierungstools verwenden und Onsite-Inhalte basierend auf der Zugehörigkeit zu einem Segment oder einer Liste personalisieren.

Weitere Ressourcen