Track events using the Coveo app for Shopify

This is for:

Developer

Coveo Analytics events are crucial for analyzing your storefront performance and powering Coveo Machine Learning (Coveo ML) models.

This article explains how the Coveo AI Search and Discovery app tracks commerce events. If you’re not using the app, see Custom implementations: Track events without the Coveo AI Search & Discovery app.

Types of events

There are four types of commerce events:

Note

Under the Coveo Event Protocol (EP), the Commerce API logs search events server-side automatically for you.

How to track events

The Coveo Atomic and Headless libraries each log certain types of events. You’ll have to use a web pixel to track the other events.

The following table summarizes how commerce events are tracked:

Event Atomic [1] Headless

Click

Logged automatically by Atomic

Logged by Headless controllers [2]

Cart

Logged by Coveo web pixel

Product view

Purchase

Logged by Coveo web pixel

1. Be sure to initialize the web pixel as soon as possible.

2. Headless event logging:

Coveo web pixel

The Coveo AI Search & Discovery app uses a web pixel to log certain commerce events based on your implementation approach.

The web pixel must be initialized before it can log events, so initialize it after you synchronize your Shopify product catalog with Coveo. The earlier you initialize the web pixel, the earlier it can start logging events to power your Coveo ML models.

Initialize the web pixel

  1. Create a snippet named initialize-analytics.liquid and paste the following code:

    <!-- snippets/initialize-analytics.liquid -->

<script type="module">
  import {init, fetchAppProxyConfig} from 'https://static.cloud.coveo.com/shopify/v1/headless/commerce.esm.js';

  const config = await fetchAppProxyConfig({ 1
    marketId: {{ localization.market.id | encode_url_component }},
  });

  init(config); 2
</script>
    1 The Coveo Shopify app contains an App Proxy endpoint that returns an object containing the access token, organization ID and tracking ID, which are required to initialize the web pixel.
    2 The init function initializes the web pixel with the configuration returned by the App Proxy endpoint (see @coveo/shopify).

  2. Include this snippet in your theme.liquid file, just before the closing </head> tag:

    {% render 'initialize-analytics' %}

  3. Verify your setup by loading a storefront page and confirming that cart events, product view events, and purchase events appear in your analytics.

Web pixel lifecycle

The lifecycle of the Coveo AI Search & Discovery app web pixel is as follows: