Shopify-integration

Værdien ved integrationen 

Styrket loyalitet 
Marketing automation og personlige beskeder gør det muligt for webshops at engagere besøgende og kunder med skræddersyet indhold, hvilket skaber en dybere forbindelse og øget loyalitet.  

Forbedret kundeoplevelse 
Ved at sende rettidige og relevante beskeder baseret på realtidsdata kan webshops forbedre den samlede oplevelse ved at tilbyde værdifuld information, kampagner og tilbud, der matcher kundernes interesser og behov. 

Målrettet kommunikation 
Avancerede segmenteringsmuligheder gør det muligt at kommunikere målrettet, så webshops kan nå specifikke målgrupper med personliggjorte budskaber tilpasset disses demografi, præferencer og adfærd. 

Forudsigelse og forebyggelse af frafald
Marketing automation-værktøjer hjælper med at identificere medlemmer i risiko for frafald ved at analysere deres engagement og besøgsadfærd og muliggør proaktive strategier for at fastholde dem gennem målrettede kampagner og incitamenter.

Effektiviserede processer
Ved at automatisere marketingprocesser og bruge personlige beskeder kan webshops effektivisere driften, spare tid og ressourcer og samtidig levere relevante og effektfulde budskaber til deres målgruppe.

Gør dine webshopbesøgende til loyale kunder. Med 2-vejsintegrationen mellem Heyloyalty og Shopify kan du lave effektiv e-mailmarketing og marketing automation baseret på data fra din webshop. 

Inden du starter

For at gøre det nemmest for dig selv anbefaler vi, at du læser de ofte stillede spørgsmål og finder de forskellige dokumenter, id’er, loginoplysninger o.lign. frem, som du skal bruge til opsætningen. Se mere herunder.

Ofte stillede spørgsmål

Skal jeg bruge en udvikler?  
Nej. Men hvis du er usikker på, hvordan du installerer en extension fra Shopify app, kan det give mening at alliere sig med en kollega. 

Hvor lang tid tager det at sætte integrationen op?
Fem minutter plus et par minutters forberedelse, hvor du finder tingene på listen nedenfor frem.

Henter integrationen bagudrettet data? 
Ja, hvis du lige trykker på en enkelt knap i løbet af opsætningen. 

Skal jeg bruge adgang til andre systemer?
Det er nemmest, hvis du allerede har en aktiv konto ved Heyloyalty. Du kan dog godt oprette en Heyloyalty-konto, når du opsætter integrationen. I så fald skal du bruge firmanavn, fornavn, efternavn, e-mail, telefonnummer og CVR-nummer.

Hvilke data bliver importeret? 
Læs afsnittet Felter i integrationen nederst på denne side for at få det fulde overblik. 

Kan jeg segmentere på data, der kommer via integrationen? 
Ja. Alt data, der kommer via integrationen, kan du bruge til at segmentere din fremtidige kommunikation. Du kan også bruge denne data til at starte og stoppe dine flows. 

Det skal du bruge til at sætte integrationen op 

Skal jeg bruge en udvikler? Nej.

Kan jeg selv sætte det op? Ja.

Du bør have Heyloyalty og Shopify-shoppen åbne i hver sin fane i din browser. I Heyloyalty skal du bruge følgende:

• Hvis du har en Premium- eller Premium+-licens i Heyloyalty:
  Trackingintegration på førnævnte liste
  Hvis du har en Basic-licens, kan du ignorere dette.

• API-nøgle (i Heyloyalty: Indstillinger → Kontooplysninger → API nøgle)

• API-secret (i Heyloyalty: Indstillinger → Kontooplysninger → API secret)

Integrationen opererer via Shopifys API og Heyloyaltys trackingdatabase. Læs mere om Tracking her. 

Opsætning af integrationen 

Med ovenstående forberedelse er du nu klar til at opsætte integrationen mellem Shopify og Heyloyalty. 

Tracking (hvis du har en Premium- eller Premium+-licens)

Inden du opsætter integrationen til Shopify, skal du have opsat en trackingintegration. Du kan læse her, hvordan du sætter den op. Når du opsætter trackingintegrationen, skal du vælge, hvilken liste trackingdata skal overføres til. Da integrationen endnu ikke har oprettet en liste, skal du bare bruge en midlertidig liste. Hvis du ikke har en liste, kan du læse her, hvordan du opretter en.

Spring dette trin over, hvis du har en Basic-licens.

Opsæt Tracking ved at klikke på Integrationer → Listeintegrationer → Tracking → Opsæt integration → Opret ny Tracking.

Udfyld felterne. Sørg for at tilknytte et produktfeed. Antal besøg på kategori og Antal dage besøgene er over er vigtige at forholde sig til, da de har betydning for, hvornår en kategoriinteresse trigger. En tommelfingerregel – der kan være mere eller mindre god afhængigt af dine gæsters typiske købsmønstre og -frekvenser – er at sætte Antal besøg på kategori til tre og Antal dage besøgene er over til syv.

Sessionstid skal være et tal, og det skal være det samme som i dit script. Vi anbefaler typisk 45 minutter, så hvis du følger den anbefaling, skal du skrive 45 i feltet.

Opsætning af integrationen 

Find Heyloyalty-appen i Shopify. Log ind i Shopify → Apps → Tilføj apps → Udforsk mere i Shopify App Store.

Et nyt vindue åbnes.

Søg efter Heyloyalty, og klik på Installér. Et nyt vindue åbnes. Klik nu på Installer.

Et nyt vindue åbnes igen.

Har du allerede en konto ved Heyloyalty?  

Du skal nu forholde dig til, om du har en aktiv konto ved Heyloyalty eller ej.  

Du har allerede en konto ved Heyloyalty 

Vælg Click here to setup, hvis du allerede har en aktiv konto.

Klik på Click here to log in, og log ind i Heyloyalty for at finde din API-nøgle og API-secret. Dem har du forhåbentlig allerede fundet frem under punktet Det skal du bruge til at sætte integrationen op.

Udfyld API Key og API Secret, og afslut med Save connection info.

Den tænker nu i nogle sekunder. Når du ser denne besked, kan du klikke på Close.

Gå herefter til Aktivér webhooks.

Du har ikke en konto ved Heyloyalty

Hvis du ikke har en aktiv konto ved Heyloyalty, skal du vælge Create my account og udfylde felterne:

Aktivér webhooks 

Du skal nu aktivere webhooks ved at klikke på knappen Activate webhooks.

Herefter kan du se beskeden Shopify Webhooks is active.

Import af bagudrettet data 

For at importere bagudrettet data skal du blot klikke på Import all data.

Afhængigt af hvor meget data du har i din webshop, kan det tage et stykke tid. Importen er dog sat i kø, og du kan gå videre til at indsætte dit trackingscript.

BEMÆRK: Trackingscriptet, som du kan hente i boksen nedenfor, virker ikke. For at indsætte trackingscriptet skal du gå til afsnittet Indsæt tracking script.

Indsæt tracking script

For at du kan få data i Heyloyalty om, hvilke produkter dine brugere besøger, hvilke produkter de lægger i kurven, og hvilke produkter de køber, skal du indsætte nedenstående trackingscript på din webshop.

Bemærk: Du skal indsætte APIkey og integrationId. Du kan kopiere scriptet og søge efter de to ord. Det er XXXXX, der skal erstattes med de korrekte værdier.

APIKey findes her i Heyloyalty:
Brugermenu 👤⚙️ → Kontooplysninger → API informationer → API nøgle

Tracking id findes her i Heyloyalty:
Integrationer → Listeintegrationer → Tracking → Rediger integration → *Find dit Tracking id i fjerde kolonne*

(function () {
    // Helper function to generate a unique ID
    function generateUUID() {
      return 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
        const r = (Math.random() * 16) | 0;
        const v = c === 'x' ? r : (r & 0x3) | 0x8;
        return v.toString(16);
      });
    }
  
    // Helper function to get or set a cookie
    function getOrSetCookie(name, value, minutes) {
      const existingCookie = document.cookie.split('; ').find((row) => row.startsWith(name + '='));
      if (existingCookie) {
        return existingCookie.split('=')[1];
      }
      if (value) {
        const expires = new Date();
        expires.setTime(expires.getTime() + minutes * 60 * 1000);
        document.cookie = `${name}=${value}; expires=${expires.toUTCString()}; path=/;`;
        return value;
      }
      return null;
    }
  
    // Generate or retrieve the CookieID (persistent for 1 year)
    const HLcookieID = getOrSetCookie('HLcookieID', generateUUID(), 365 * 24 * 60); // 1 year in minutes
  
    // Generate or retrieve the SessionID (valid for 5 minutes)
    const HLsessionID = getOrSetCookie('HLsessionID', generateUUID(), 45); // 45-minute lifetime
  
    // Log the IDs for debugging
    //console.log('HLCookieID:', HLcookieID);
    //console.log('HLSessionID:', HLsessionID);
    const APIkey = "XXXXXXXX";
    const integrationId = "XXXXX";
  
    // Example: Dispatch a custom Shopify event with the IDs
    analytics.subscribe('page_viewed', () => {
      const eventPayload = {
        event_name: 'page_viewed',
        HLsessionID: HLsessionID,
        HLcookieID: HLcookieID,
      };
      //console.log('Custom Page Viewed Event:', eventPayload);
      
  });
  var productView = false;
  analytics.subscribe("product_viewed", event => {
  // Example: Send this data to an external tracking service (optional)
  const productId = event.data.productVariant.id;
  const url = event.context.window.location.href;
    productView = true;
  protocol = "https:" == document.location.protocol ? "https://" : "http://",
  source = protocol + 'tracking.heyloyalty.com/' + "visit" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&productId=" + productId + '&url=' + url,
  xhr = new XMLHttpRequest();
  xhr.open('GET', source, true);
  xhr.send();

  if (url.indexOf("hlId=")>-1){
    const queryString = window.location.search;
    const urlParams = new URLSearchParams(url);
    const email = urlParams.get('hlId')

    protocol = "https:" == document.location.protocol ? "https://" : "http://",
    source = protocol + 'tracking.heyloyalty.com/' + "pairEmail" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&email=" + email + '&url=' + url,
    xhr = new XMLHttpRequest();
    xhr.open('GET', source, true);
    xhr.send();
  } 

});
  


  analytics.subscribe("page_viewed", event => { 
    const url = event.context.window.location.href;
    //console.log(productView)
  if(productView){
    return
  }

  protocol = "https:" == document.location.protocol ? "https://" : "http://",
  source = protocol + 'tracking.heyloyalty.com/' + "visit" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + '&url=' + url,
  xhr = new XMLHttpRequest();
  xhr.open('GET', source, true);
  xhr.send();
  console.log("side-set");

  if (url.indexOf("hlId=")>-1){
    const queryString = window.location.search;
    const urlParams = new URLSearchParams(url);
    const email = urlParams.get('hlId')

    protocol = "https:" == document.location.protocol ? "https://" : "http://",
    source = protocol + 'tracking.heyloyalty.com/' + "pairEmail" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&email=" + email + '&url=' + url,
    xhr = new XMLHttpRequest();
    xhr.open('GET', source, true);
    xhr.send();
  } 

});
  
  analytics.subscribe("product_added_to_cart", event => { 
    const productId = event.data.cartLine?.merchandise.product.id;
    const url = event.context.window.location.href;
    const basketId = event.data.cartLine?.merchandise.id;
    const itemAmount = event.data.cartLine?.quantity;
    const categoryId = event.data.cartLine?.merchandise.product.type;
  
    protocol = "https:" == document.location.protocol ? "https://" : "http://",
    source = protocol + 'tracking.heyloyalty.com/' + "addtobasket" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&productId=" + productId + "&amount=" + itemAmount + "&categoryId=" + "&basketId=" + basketId + '&url=' + url,
    xhr = new XMLHttpRequest();
    xhr.open('GET', source, true);
    xhr.send();

  });
  
  analytics.subscribe("product_removed_from_cart", event => { 
    const productId = event.data.cartLine?.merchandise.product.id;
    const url = event.context.window.location.href;
    const basketId = event.data.cartLine?.merchandise.id;
    const itemAmount = event.data.cartLine?.cost.totalAmount.amount;
    const categoryId = event.data.cartLine?.merchandise.product.type;
    
    protocol = "https:" == document.location.protocol ? "https://" : "http://",
    source = protocol + 'tracking.heyloyalty.com/' + "removefrombasket" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&productId=" + productId,
    xhr = new XMLHttpRequest();
    xhr.open('GET', source, true);
    xhr.send();

  });
  
  analytics.subscribe("checkout_completed", event => { 
    const basketAmount = event.data.checkout.subtotalPrice?.amount;
    const url = event.context.window.location.href;
    const basketId = event.data.checkout.order?.id;
    
    protocol = "https:" == document.location.protocol ? "https://" : "http://",
    source = protocol + 'tracking.heyloyalty.com/' + "purchasebasket" + '/' + APIkey + '?' + "cookie=" + HLcookieID + "&session=" + HLsessionID + "&integrationId=" + integrationId + "&basketPrice=" + basketAmount + "&order_number=" + basketId + '&url=' + url,
    xhr = new XMLHttpRequest();
    xhr.open('GET', source, true);
    xhr.send();

  });
    
  })();

Når du har indsat APIkey og IntegrationsId, er du klar til at indsætte scriptet i din Shopify-shop. Det gør du ved at gå til din Shopify-shop og herefter til indstillinger:

Derefter skal du gå til Kundehenvendelser → Flere visninger → Tilpassede pixels og herefter trykke på Tilføj tilpasset pixels:

Herefter navngiver du din pixel. Vi anbefaler, at du kalder den Tracking Heyloyalty. Tryk herefter på Tilføj pixel.

På denne side kan du indsætte dit trackingscript i feltet kode:

Når scriptet er indsat, kan du gemme det. Når du har trykket på gem, kan du trykke på Tilslut:

Når scriptet er tilsluttet, skal du indsætte den nyoprettede liste fra integrationen på din trackingintegration. Det gør du ved at gå ind under: Integrationer → Listeintegrationer → Tracking → Opsæt integration → Opret ny Tracking

Når listen er ændret, kan du tjekke, om der kommer events ind fra din webshop. Det ser du i activity feedet, som du finder her: statistik → activityfeed.

Produkter i dine kampagner

For at du kan indsætte dine produkter i dine kampagner, skal du bruge en Shopify-app, der kan generere et produktfeed. Det kan være, at du allerede har en app til dette – hvis ikke, kan du spørge dit webbureau.

Alternativt findes der et gratis modul her: https://apps.shopify.com/product-feeds-generator. Her kan du generere et produktfeed.

Bemærk: Heyloyalty understøtter følgende feedtyper: XML, JSON, CSV, FTP/SFTP, Zip CSV og Open Graph.

Når du har genereret dit produktfeed, kan du opsætte feedet i Heyloyalty. Du kan læse her, hvordan du sætter dit feed op.

Generelt om integrationen  

Værd at vide om integrationen 

Når integrationen er sat op, kan du hente alle historiske købsdata med et enkelt klik.

Heyloyalty opretter en kontakt, når der bliver oprettet en kontakt i Shopify, der har sagt ja tak til nyhedsbrevet.  

• Kontakten bliver automatisk opdateret i trackingdatabasen. Det betyder, at du bl.a. kan segmentere på, om kontakterne i Heyloyalty har købt inden for de seneste syv dage eller ej, har købt for mere end et givet beløb eller har købt mere end et bestemt antal gange, for blot at nævne nogle af dine muligheder.

• Der bliver tracket data på ukendte medlemmer, og når et ukendt medlem tilmelder sig nyhedsbrevet, laver Heyloyalty automatisk en bagudrettet parring af alle personens data, så du får hele historikken med.

Felter i integrationen

Hvis du vil have et komplet overblik over felterne i integrationen, kan du se felterne på den liste, du har koblet integrationen op på.

Lister → ⋮ → Redigér liste. Scroll ned i bunden, og se alle de customfelter, der ligger på listen, og som du har mappet som en del af integrationen.

---