Sådan sender du shopperhændelser til Shoply AI fra en headless Shopify-butik

Shoply AI registrerer shoppernes adfærd (tilføjelse til kurv, betaling, produktvisninger osv.) for at forbedre søgerangering og anbefalinger. I almindelige Shopify-butikker sker dette automatisk via vores Web Pixel-udvidelse . Shopify Web Pixels kører dog ikke på headless-butikker, fordi de er afhængige af Shopifys gengivelsesmotor til at indsætte pixel-sandkassen.

Hvis du driver en headless Shopify-butik (f.eks. med Next.js, Hydrogen eller en brugerdefineret frontend), skal du sende disse hændelser direkte fra din frontend-kode.

Forudsætninger

Du har installeret Shoply AI, og Shoply AI-scriptet er indlæst i din butik.

Sådan sender du en hændelse

Når Shoply AI-scriptet er indlæst, eksponerer det automatisk window.shoplyLogEvent. Kald det direkte – du behøver ikke selv at håndtere sessions-id’er, butiksnøgler eller API-endepunkter:


window.shoplyLogEvent(eventName, data)

Strukturen af data-objektet afhænger af hændelsestypen (se nedenfor).

Hændelser, der skal være med, for at understøtte konverteringssporing

`product_added_to_cart`

Udløs denne, når en shopper føjer en produktvariant til sin kurv.


await window.shoplyLogEvent('product_added_to_cart', {
  "cartLine": {
    "cost": {
      "totalAmount": {
        "amount": 769,
        "currencyCode": "USD"
      }
    },
    "merchandise": {
      "id": "42553607094387",  // Variant ID
      "title": "25.5 Mondo",
      "price": {
        "amount": 769,
        "currencyCode": "USD"
      },
      "product": {
        "id": "7834124058739"  // Product ID
      }
    },
    "quantity": 1
  },
  "clientId": "35214700-144e-4022-974e-fe008736e973",  // Not used
  "referrer": "https://demo.shoplyai.ai/collections/all"
})

`checkout_completed`

Hvis du bruger Shopifys indbyggede betalingsside, har du normalt ikke brug for dette, da vi bruger webpixelhændelser til automatisk at spore gennemførte betalinger. Hvis du har dit eget betalingsforløb, skal du udløse denne, når en shopper gennemfører betalingen (f.eks. på din ordrebekræftelsesside).


await window.shoplyLogEvent('checkout_completed', {
  "token": "8cea7db9ce551f0a8c9113a0f7f2dce0",  // Not used
  "order": {
    "id": "7251060916339",  // Shopify Order ID
    "customer": {
      "id": "9903183265907",  // Shopify Customer ID
      "isFirstOrder": true
    }
  },
  "lineItems": [
    {
      "finalLinePrice": {
        "amount": 1538,
        "currencyCode": "USD"
      },
      "quantity": 2,
      "variant": {
        "id": "42553607094387",  // Variant ID
        "title": "25.5 Mondo",
        "price": {
          "amount": 769,
          "currencyCode": "USD"
        },
        "product": {
          "id": "7834124058739"  // Product ID
        }
      }
    },
    {
      "finalLinePrice": {
        "amount": 384.93,
        "currencyCode": "USD"
      },
      "quantity": 1,
      "variant": {
        "id": "42553643958387",
        "title": "157 CM",
        "price": {
          "amount": 384.93,
          "currencyCode": "USD"
        },
        "product": {
          "id": "7834140180595"
        }
      }
    }
  ],
  "clientId": "35214700-144e-4022-974e-fe008736e973",  // Not used
  "referrer": "https://demo.shoplyai.ai/cart"
})

Har du brug for hjælp?

Du er velkommen til at booke et møde med os , så hjælper vi dig med at integrere hændelsessporing i din headless-butik.