> ## Documentation Index
> Fetch the complete documentation index at: https://docs.depict.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Add to cart tracking

> You need to track both the add-to-cart button on your product page and, if applicable, on your product cards

You can either send `addToCart` events manually to Depict, or automatically by marking add-to-cart buttons in the DOM using the `depict-add-to-cart` class. The automatic tracking is limited to one product id per product detail page and product card. If your website uses size and color selectors before adding to cart, the imperative tracking is more reliable.

**Sending add-to-cart events imperatively**

<Note>
  Use the same variant-level `product_id` that our API returns in the displays
  — the same id vocabulary as [`setProductId`](/api-guide/tracking/product-pages).
  See [Which ID goes where](/api-guide/tracking/ids).
</Note>

Whenever a product was successfully added to the cart anywhere on your website (including surfaces not directly related to Depict), send an `addToCart` event with the corresponding product id. If you implement imperative tracking, skip the automatic tracking section below.

<CodeGroup>
  ```typescript dpq theme={null}
  dpq("addToCart", "[PRODUCT_ID_FOR_ADDED_PRODUCT]");
  ```

  ```typescript DPC instance theme={null}
  dpc.sendAddToCartEvent({ product_id: "[PRODUCT_ID_FOR_ADDED_PRODUCT]" });
  ```
</CodeGroup>

**Mark up your add-to-cart buttons for automatic tracking**

Add the `depict-add-to-cart` class to all add-to-cart buttons on your website, including product cards and product detail pages. Depict will automatically track clicks as necessary, using the [product id](/api-guide/tracking/product-pages) set on product detail pages or [result id](/api-guide/tracking/product-cards) for buttons inside product cards.

```html HTML theme={null}
<button class="depict-add-to-cart">Add to cart</button>
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.