> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Tutorial | Send Tracking and Analytics Events

## Article: Tutorial | Send Tracking and Analytics Events

## Article Link: https://dev.wix.com/docs/develop-websites-sdk/get-started/tutorials/monitoring/tutorial-send-tracking-and-analytics-events.md

## Article Content:

# Tutorial | Send Tracking and Analytics Events

You can add tracking code to monitor how site visitors interact with your site. This gives you insight into your site visitors' online behavior and can help you optimize your online marketing strategies.

By the end of this tutorial, you'll have a site that sends custom events to an analytics tool (like Google Analytics) whenever a site visitor clicks the `download` button on your site.

You'll use the following steps to send a tracking event from your page code:

- [Connect your site to an analytics tool](#step-1--connect-an-analytics-tool)
- [Set up a simple page](#step-2--set-up-your-page)
- [Add code that sends a tracking event when a user performs a specific interaction](#step-3--add-tracking-code)

> The code in this article was written using the following module versions:
>
> - @wix/site-window (v1.3.8)
> - @wix/data (v1.0.241)
>
> Learn how to install npm packages [in the editor](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/work-with-npm-packages-in-the-editor.md) or [using the CLI](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/developer-environments/packages/npm/work-with-npm-packages-with-the-cli.md).

> **Note**
>
> - Tracking & Analytics requires you to have an account with an external analytics tool and only works with premium sites.
> - If your custom event isn't appearing in Google Analytics, you can use the [Google Tag Assistant](https://tagassistant.google.com/) to verify the event is being sent correctly.

## Step 1 | Connect an analytics tool

Connect the desired tracking and analytics tool to your site. This tutorial connects to [Google Analytics](https://support.wix.com/en/article/tracking-events-on-your-wix-site-with-a-google-analytics-property), but the same concepts apply when connecting to [Meta Pixel](https://support.wix.com/en/article/connecting-a-facebook-pixel-and-the-conversions-api-to-your-wix-site-7351813).

## Step 2 | Set up your page

1. Add page elements.

Add the following elements to your page:

- A repeater to display a title and download button for each document. Set the repeater ID to `docRepeater`.
- A text element (repeated) to display the document title. Set the text ID to `docTitle`.
- A button (repeated) to download the document. Set the button ID to `downloadButton`.
- A collection to store document data. Set the collection ID to `docData`.

2. Connect elements to your data.

   Query the `docData` collection and use the results to populate the repeater and its repeated elements.

   ```javascript
   import { items } from "@wix/data";

   $w.onReady(async function () {
     const { items } = await items.query("docData").find();

     $w("#docRepeater").data = items;

     $w("#docRepeater").onItemReady(($item, itemData) => {
       $item("#docTitle").text = itemData.title;
     });
   });
   ```

The result should look like this:

![Repeater with titles](https://wixmp-833713b177cebf373f611808.wixmp.com/images/38a99262e177152da44c3e763c6f4272.png)

## Step 3 | Add frontend code

1. Import the `window` module.

   Add this import statement at the top of your page code:

   ```javascript
   import { window } from "@wix/site-window";
   ```

2. Add an `onClick()` event to the repeated `download` button.

   Add an `onClick()` event handler to the repeater's `onReady()` handler:

   ```javascript
   $w("#docRepeater").onItemReady(($item, itemData) => {
     $item("#docTitle").text = itemData.title;

     $item("#downloadButton").onClick(async () => {
       // add the tracking code here in the next step
     });
   });
   ```

3. Call the `trackEvent()` method.

   Add the tracking code inside the `onClick()` event. This sends Google Analytics a custom event that indicates a download occurred.

   When sending a custom event to Google Analytics, use these parameters:

   | Key             | Value Type | Required | Usage                                   |
   | --------------- | ---------- | -------- | --------------------------------------- |
   | `eventCategory` | string     | yes      | Object that was interacted with         |
   | `eventAction`   | string     | yes      | Type of interaction                     |
   | `eventLabel`    | string     | no       | Event category                          |
   | `eventValue`    | number     | no       | Numeric value associated with the event |

   ```javascript
   $item("#downloadButton").onClick(async () => {
     await window.trackEvent("CustomEvent", {
       event: "Document Download",
       eventCategory: "Downloads",
       eventAction: "Download",
       eventLabel: itemData.title,
     });
   });
   ```

   Now, when a user clicks the download button, you'll see an event registered in your analytics tool.

## Complete code

Here's the complete code for your page:

```javascript
import { window } from "@wix/site-window";
import { items } from "@wix/data";

$w.onReady(async function () {
  const { items } = await items.query("docData").find();

  $w("#docRepeater").data = items;

  $w("#docRepeater").onItemReady(($item, itemData) => {
    $item("#docTitle").text = itemData.title;

    $item("#downloadButton").onClick(async () => {
      await window.trackEvent("CustomEvent", {
        event: "Document Download",
        eventCategory: "Downloads",
        eventAction: "Download",
        eventLabel: itemData.title,
      });
    });
  });
});
```

## See also

To learn more about the types of events you can send and their corresponding parameters, see [`trackEvent( )`](https://dev.wix.com/docs/sdk/frontend-modules/window/track-event.md) in the API Reference.