> For the complete documentation index, see [llms.txt](https://docs.chord.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.chord.co/chord-oms/shopify/developer-tools/next-js/sdk-reference/useanalytics.md).

# useAnalytics

The `useAnalytics` hook returns a set of functions that send a tracking event to Chord CDP.

The starter sends most Chord CDP events about user actions automatically, when other hooks like `useCart` are used. However, some events need to be closely tied to the UI, like click tracking, and must be sent explicitly by React components. Functions for sending these events are available via the `useAnalytics` hook.

## Example

{% code title="useAnalytics" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const {
  trackCartViewed,
  trackCollectionClicked,
  trackEmailCaptured,
  trackProductClicked,
  trackProductViewed
} = useAnalytics()
```

{% endcode %}

## Returns

The `useAnalytics` hook returns an object with these properties:

| Property                 | Description                                                      |
| ------------------------ | ---------------------------------------------------------------- |
| `trackCartViewed`        | A function that sends a `Cart Viewed` event to Chord CDP.        |
| `trackCollectionClicked` | A function that sends a `Collection Clicked` event to Chord CDP. |
| `trackEmailCaptured`     | A function that sends an `Email Captured` event to Chord CDP.    |
| `trackProductClicked`    | A function that sends a `Product Clicked` event to Chord CDP.    |
| `trackProductViewed`     | A function that sends a `Product Viewed` event to Chord CDP.     |

## Functions

### trackCartViewed

The `trackCartViewed` function sends a `Cart Viewed` event to Chord CDP.

**Arguments:**

None.

**Returns:**

`undefined`

**Example:**

{% code title="trackCartViewed" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const { trackCartViewed } = useAnalytics()
trackCartViewed()
```

{% endcode %}

### trackCollectionClicked

The `trackCollectionClicked` function sends a `Collection Clicked` event to Chord CDP.

**Arguments:**

`trackCollectionClicked({ id, description, imageUrl, slug, title })`

| Argument               | Type   | Description                                    |
| ---------------------- | ------ | ---------------------------------------------- |
| `options.id`           | String | ID of the collection.                          |
| `options.description?` | String | (Optional) Description of the collection.      |
| `options.imageUrl?`    | String | (Optional) URL of an image for the collection. |
| `options.slug?`        | String | (Optional) Slug of the collection.             |
| `options.title?`       | String | (Optional) Title of the collection.            |

**Returns:**

`undefined`

**Example:**

{% code title="trackCollectionClicked" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const { trackCollectionClicked } = useAnalytics()
trackCollectionClicked({ id: 'red-collection', title: 'Red' })
```

{% endcode %}

### trackEmailCaptured

The `trackEmailCaptured` function sends an `Email Captured` event to Chord CDP.

**Arguments:**

`trackEmailCaptured({ email, placement })`

| Argument                        | Type   | Description                                               |
| ------------------------------- | ------ | --------------------------------------------------------- |
| `options.email`                 | String | Email that was captured                                   |
| `options.placement?.component?` | String | (Optional) Page component/module that captured the email. |
| `options.placement?.page?`      | String | (Optional) Page that captured the email.                  |

**Returns:**

`undefined`

**Example:**

{% code title="trackEmailCaptured" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const { trackEmailCaptured } = useAnalytics()
trackEmailCaptured({
    email: 'test@test.com',
    placement: {
        component: 'footer',
        page: '/shop'
    }
})
```

{% endcode %}

### trackProductClicked

The `trackProductClicked` function sends a `Product Clicked` event to Chord CDP.

**Arguments:**

`trackProductClicked({ productHandle })`

| Argument                | Type   | Description                            |
| ----------------------- | ------ | -------------------------------------- |
| `options.productHandle` | String | Shopify product handle of the product. |

**Returns:**

`undefined`

**Example:**

{% code title="trackProductClicked" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const { productClicked } = useAnalytics()
trackProductClicked({ productHandle: 'product-1' })
```

{% endcode %}

### trackProductViewed

The `trackProductViewed` function sends a `Product Viewed` event to Chord CDP.

**Arguments:**

`trackProductViewed({ productHandle })`

| Argument                | Type   | Description                            |
| ----------------------- | ------ | -------------------------------------- |
| `options.productHandle` | String | Shopify product handle of the product. |

**Returns:**

`undefined`

**Example:**

{% code title="trackProductViewed" %}

```javascript
import { useAnalytics } from '~/hooks/actions'

const { trackProductViewed } = useAnalytics()
trackProductViewed({ productHandle: 'product-1' })
```

{% endcode %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.chord.co/chord-oms/shopify/developer-tools/next-js/sdk-reference/useanalytics.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.