Cum să trimiteți evenimentele cumpărătorilor către Shoply AI dintr-un magazin Shopify headless

Shoply AI urmărește comportamentul cumpărătorilor (adăugarea în coș, finalizarea comenzii, vizualizările produselor etc.) pentru a îmbunătăți ordinea rezultatelor căutării și recomandările. În magazinele Shopify standard, acest lucru se întâmplă automat prin extensia noastră Web Pixel . Cu toate acestea, Shopify Web Pixels nu rulează în magazinele headless, deoarece se bazează pe motorul de randare al magazinului Shopify pentru a injecta sandbox-ul pixelului.

Dacă rulați un magazin Shopify headless (de exemplu, cu Next.js, Hydrogen sau un frontend personalizat), trebuie să trimiteți aceste evenimente direct din codul frontendului.

Cerințe preliminare

• Ați instalat Shoply AI, iar scriptul Shoply AI este încărcat în magazinul dvs.

Trimiterea unui eveniment

După încărcarea scriptului Shoply AI, acesta expune automat window.shoplyLogEvent. Apelați-l direct — nu este nevoie să gestionați singur ID-urile sesiunilor, cheile magazinului sau endpointurile API:

window.shoplyLogEvent(eventName, data)

Structura obiectului data depinde de tipul evenimentului (consultați mai jos).

Evenimente obligatorii pentru a susține urmărirea conversiilor

product_added_to_cart

Declanșați acest eveniment atunci când un cumpărător adaugă în coș o variantă de produs.

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

Dacă utilizați checkout-ul nativ al Shopify, de obicei nu aveți nevoie de acest eveniment, deoarece folosim automat evenimentele web pixel pentru a urmări finalizarea checkout-ului. Cu toate acestea, dacă aveți propriul flux de checkout, declanșați acest eveniment atunci când un cumpărător finalizează checkout-ul (de exemplu, pe pagina de confirmare a comenzii).

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"
})

Aveți nevoie de ajutor?

Nu ezitați să programați o întâlnire cu noi , iar noi vă vom ajuta să integrați urmărirea evenimentelor în magazinul dvs. headless.