Jak odesílat události nakupujících do Shoply AI z headless obchodu Shopify

Shoply AI sleduje chování nakupujících (přidání do košíku, dokončení objednávky, zobrazení produktů atd.), aby zlepšila řazení ve vyhledávání a doporučení. V běžných obchodech Shopify k tomu dochází automaticky prostřednictvím našeho rozšíření Web Pixel . Shopify Web Pixels však v headless obchodech nefungují, protože k vložení pixelového sandboxu potřebují vykreslovací engine Shopify pro storefront.

Pokud provozujete headless obchod Shopify (např. s Next.js, Hydrogenem nebo vlastním frontendem), musíte tyto události odesílat přímo z kódu frontendu.

Předpoklady

Máte nainstalovaný Shoply AI a skript Shoply AI je načtený ve vašem storefrontu.

Odeslání události

Po načtení skriptu Shoply AI automaticky zpřístupní window.shoplyLogEvent. Zavolejte jej přímo — nemusíte sami spravovat ID relací, klíče obchodu ani koncové body API:


window.shoplyLogEvent(eventName, data)

Struktura objektu data závisí na typu události (viz níže).

Události, které je nutné podporovat pro sledování konverzí

`product_added_to_cart`

Tuto událost vyvolejte, když nakupující přidá variantu produktu do košíku.


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`

Pokud používáte nativní pokladnu Shopify, tuto událost obvykle nepotřebujete, protože dokončení objednávky automaticky sledujeme pomocí událostí webového pixelu. Pokud však máte vlastní průběh platby, vyvolejte tuto událost, když nakupující dokončí objednávku (např. na stránce s potvrzením objednávky).


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

Potřebujete pomoc?

Neváhejte si domluvit schůzku s naším týmem a my vám pomůžeme s integrací sledování událostí do vašeho headless storefrontu.