Onsite content personaliseren met de group membership API van Klaviyo

Wat je leert

Leer hoe je de getGroupMembership-methode van het JavaScript-object klaviyo gebruikt, die je kunt gebruiken om onsite-personalisatie op je website te implementeren. Hiervoor moet je het klaviyo -object laden en een array met lijsten of segmenten doorgeven om te controleren. Dit levert output op die je kunt gebruiken voor onsite-personalisatie.

Voordat je van start gaat

Wanneer je onsite tracking van Klaviyo aan je site toevoegt, wordt alleen de browseactiviteit van "bekende browsers" bijgehouden (oftewel browsers die de site hebben bezocht, betrokken zijn geweest en zijn geïdentificeerd of "gecookied"). Onsite tracking van Klaviyo houdt geen anonieme browsers bij. Er zijn 3 belangrijke manieren waarop Klaviyo een websitebezoeker identificeert voor onsite tracking:

• Als iemand via een Klaviyo Email naar je website heeft doorgeklikt
• Als iemand zich heeft aangemeld via een Klaviyo-formulier
• Als iemand is ingelogd op je site en je tracking hebt geïnstalleerd

Bekijk onze video van Klaviyo over het gebruik van de API voor groepslidmaatschap.

Installeer Klaviyo.js en laad het Klaviyo-object

Je moet eerst Klaviyo.js installeren, als je dat nog niet hebt gedaan. Klaviyo.js, ook bekend als Klaviyo's Active on Site JavaScript, ondersteunt het klaviyo -object automatisch. Als je integraties met je Klaviyo-account hebt ingeschakeld of Klaviyo.js handmatig hebt geïnstalleerd, kun je het klaviyo -object initiëren om te luisteren naar relevante aanroepen.

Om het klaviyo -object direct bij het laden van de pagina te gebruiken, raden we aan om het onderstaande snippet handmatig op je site te installeren (naast het installeren van Klaviyo.js zoals hierboven vermeld). Het klaviyo -object hoeft maar één keer per pagina te worden geladen.

Om het klaviyo -object te laden:

 
!(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);
        });
    }
  }
})();

Om de getGroupMembership-methode van het JavaScript-object klaviyo te gebruiken voor personalisatie op de website:

1. Selecteer in je code de lijst- of segment-ID's waarvoor je het lidmaatschap wilt controleren. De limiet is 50 lijsten of segmenten.
2. Identificeer gebruikers op je site via een Klaviyo-formulier of op andere manieren.
3. Doe een call in de volgende indeling, met een array van de lijst- of segment-ID's waarvoor je het lidmaatschap wilt controleren:

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

De opgegeven uitvoer is een array met de lijst-/segment-ID's waar de geïdentificeerde gebruiker toe behoort, op voorwaarde dat die ID's in de invoerarray stonden. Als er een lege array wordt geretourneerd, betekent dit dat je te veel ID's hebt doorgegeven, of dat de gebruiker niet tot een van de lijsten of segmenten behoort die je hebt opgegeven.

Je kunt de geretourneerde segment- en lijstlidmaatschapsgegevens gebruiken om je site aan te passen met relevante producten, content en meer op basis van klantsegmenten uit Klaviyo.

Codevoorbeeld

Hier is een voorbeeld waarin wordt getoond hoe je de getGroupMembership-API kunt aanroepen met meerdere segment-ID's.

const customerSegments = await klaviyo.getGroupMembership([
  VIPSegmentID,
  UnEngagedSegmentID,
  DogLoversSegmentID
]);

Impact op siteprestaties

De API voor groepslidmaatschap heeft minimale invloed op de prestaties van je site. Het Javascript-bestand (d.w.z. web_personalization.js) dat Klaviyo op je site laadt, is slechts ongeveer 1,2KB en de bundelrequest voor dit bestand blokkeert de main thread niet, dus dit heeft geen invloed op de bruikbaarheid van pagina’s.

De gegevens die worden geladen om een site aan te passen op basis van het klantprofiel, worden in de browser gecachet nadat ze voor het eerst zijn opgevraagd, zodat extra verzoeken geen backend-API-calls vereisen.

Resultaat

Je kunt nu het klaviyo -JavaScript-object gebruiken met webpersonalisatietools en om content op je site te personaliseren op basis van segment- of lijstlidmaatschap.

Extra hulpbronnen