Så här kan du anpassa innehåll på webbplatsen med Klaviyo API för gruppmedlemskap

Du kommer att lära dig

Lär dig hur du använder Klaviyo -JavaScriptobjektets metod getGroupMembership för att kontrollera om en identifierad besökare är medlem i en lista eller ett segment och använda resultatet för att anpassa din webbplats. Detta kräver att du laddar Klaviyo -objektet och skickar med en matris med lista- eller segment-ID:n att kontrollera.

Innan du börjar

Du behöver tillgång till din webbplats kod. Arbeta med en utvecklare om du behöver hjälp med JavaScript, att installera kodsnuttarna eller att tillämpa personalisering på din webbplats.

API:t för gruppmedlemskap kräver att Klaviyo identifierar besökarens webbläsare och matchar den till en profil. Det kan inte returnera list- eller segmentmedlemskap för en oidentifierad besökare. Vanliga sätt som Klaviyo identifierar en besökare på är:

• Om någon har klickat sig vidare till din webbplats via ett Klaviyo Email
• Om någon har prenumererat via ett Klaviyo-formulär
• Om din webbplats använder anpassad spårning för att identifiera någon för Klaviyo när de loggar in

Se Klaviyos video om hur du använder API:t för gruppmedlemskap.

Installera Klaviyo.js och läs in Klaviyo-objektet

Installera först Klaviyo.js om du inte redan har gjort det. Klaviyo.js, även känt som Klaviyo’s Aktiv på webbplatsen JavaScript, har stöd för klaviyo -objektet. Om din e-handelsintegrationer har installerat Klaviyo.js på din webbplats behöver du inte installera det igen. Annars installerar du det manuellt innan du använder klaviyo -objektet.

För att använda klaviyo -objektet direkt när sidan laddas rekommenderar vi att du manuellt installerar kodsnutten nedan på din webbplats (utöver att installera Klaviyo.js enligt ovan). klaviyo -objektet behöver bara laddas en gång per sida.

För att läsa in klaviyo -objektet:

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

Kontrollera medlemskap i lista eller segment

För att använda klaviyo -JavaScript-objektets metod getGroupMembership för personalisering på webbplatsen:

1. I din kod väljer du de list- eller segment-ID:n som du vill kontrollera medlemskap för. Du kan skicka upp till 50 ID:n totalt per anrop.
2. Identifiera besökaren på din webbplats via ett Klaviyo-formulär eller en annan identifieringsmetod. Om du anropar klaviyo.identify i din kod ska du vänta tills det har slutförts innan du kontrollerar medlemskap.
3. Gör ett anrop i följande format, med en array med de list- eller segment-ID:n som du vill kontrollera medlemskap för:

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

Metoden returnerar ett Promise som resulterar i en array som bara innehåller de ID:n från din indataarray som den identifierade besökaren tillhör. Använd .then() för att arbeta med resultatet, som visas nedan, eller await resultatet i en async-funktion. En tom array kan betyda att besökaren inte tillhör någon av de listor eller segment du angav, att besökaren inte kunde identifieras, att du skickade fler än 50 ID:n eller att begäran misslyckades. Ett tomt resultat i sig skiljer inte mellan de här fallen.

Använd de returnerade list- och segment-ID:na i webbplatsens kod eller i ett verktyg för webbpersonalisering för att välja relevanta produkter, innehåll och mer. Lägg till logiken som ändrar sidan när resultatet är tillgängligt och behåll standardinnehåll när inga matchande ID:n returneras.

Kodexempel

Det här exemplet kontrollerar medlemskap i flera segment. Ersätt platshållarsträngarna med dina segment-ID:n. Koden i .then() körs när resultatet är tillgängligt; lägg till webbplatsens anpassningskod där det anges.

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

Påverkan på webbplatsens prestanda

Klaviyo läser in webbpersonaliseringsskriptet asynkront. Låt webbplatsens standardinnehåll vara tillgängligt medan medlemskapsbegäran slutförs och tillämpa sedan personalisering när du har fått resultatet.

Medlemskapssvar kan cachelagras av webbläsaren, vilket gör att upprepade begäranden för samma besökare och ID:n kan återanvända det cachelagrade svaret. En annan begäran eller en utgången cache kan kräva ett nytt API-anrop, så resultatet är inte garanterat att omedelbart återspegla en medlemskapsändring.

Utfall

Du kan nu använda JavaScript-objektet klaviyo med webbpersonaliseringverktyg och för att anpassa innehåll på webbplatsen baserat på segment- eller listmedlemskap.

Ytterligare resurser