# Ad and analytics pixels

Send wishlist adds to Google Analytics 4, Meta, TikTok or Google Tag Manager, so you can build retargeting audiences and measure saves next to your other events.

Nothing needs to be turned on in the app. When a shopper saves a product, the app embed publishes two events:

| Event | For | Data |
|---|---|---|
| `wishlist_item_added` | Shopify custom pixels | `productId`, `variantId` (or `null`), `listId` (or `null`), `currency` |
| `add_to_wishlist` | Google Tag Manager (`dataLayer`) | GA4 ecommerce format: `currency` and `items[0].item_id` (product ID), `items[0].item_variant` (variant ID) |

The app doesn't call Meta, Google or TikTok itself, so events sent by Shopify's own channel apps are never counted twice. The events fire for every add, including adds made with the [JavaScript API](https://wishlist.themivo.com/docs/js-api). They don't fire in the theme editor. Prices aren't included.

## Add a custom pixel

1. In Shopify admin, open **Settings → Customer events**.
2. Click **Add custom pixel**, name it (for example, `Wishlist`) and click **Add pixel**.
3. Paste one of the snippets below and replace the ID with yours.
4. Click **Save**, then **Connect**.

Under **Customer privacy**, choose the permission that matches the platform (usually **Marketing** for ads and **Analytics** for GA4). Shopify only runs the pixel for visitors who allowed it.

### Google Analytics 4

```js
const MEASUREMENT_ID = "G-XXXXXXXXXX";

const script = document.createElement("script");
script.src = `https://www.googletagmanager.com/gtag/js?id=${MEASUREMENT_ID}`;
script.async = true;
document.head.appendChild(script);
window.dataLayer = window.dataLayer || [];
function gtag() {
  dataLayer.push(arguments);
}
gtag("js", new Date());
// Page views already come from the Google & YouTube app.
gtag("config", MEASUREMENT_ID, { send_page_view: false });

analytics.subscribe("wishlist_item_added", (event) => {
  const { productId, variantId, currency } = event.customData;
  gtag("event", "add_to_wishlist", {
    currency,
    items: [{ item_id: productId, item_variant: variantId ?? undefined }],
  });
});
```

### Meta (Facebook and Instagram)

Paste the Meta Pixel base code from **Events Manager** first, without the `<script>` tags. Keep `fbq("init", "…")` and remove `fbq("track", "PageView")` if the Facebook & Instagram app already sends page views. Then add:

```js
analytics.subscribe("wishlist_item_added", (event) => {
  const { productId, currency } = event.customData;
  fbq("track", "AddToWishlist", {
    content_ids: [productId],
    content_type: "product_group",
    currency,
  });
});
```

`product_group` matches catalogs that group variants under the product ID. If your catalog items are variants, send `[variantId]` with `content_type: "product"` instead.

### TikTok

Paste the TikTok Pixel base code from **TikTok Events Manager** first, without the `<script>` tags. Then add:

```js
analytics.subscribe("wishlist_item_added", (event) => {
  const { productId, currency } = event.customData;
  ttq.track("AddToWishlist", {
    contents: [{ content_id: productId, content_type: "product" }],
    currency,
  });
});
```

## Google Tag Manager

If Google Tag Manager is installed in your theme, the `add_to_wishlist` event is pushed to its `dataLayer`. The app doesn't add Tag Manager itself; without it, only the custom pixel event is published.

1. In Tag Manager, create a **Custom Event** trigger with the event name `add_to_wishlist`.
2. Create a **Google Analytics: GA4 Event** tag with the event name `add_to_wishlist`, turn on **Send Ecommerce data** and use the trigger.
3. Use the same trigger for other platforms' tags.

Tag Manager in a custom pixel runs in Shopify's sandbox and can't see the theme's `dataLayer`. To use it there, subscribe to `wishlist_item_added` and push the event yourself.

## Check that it works

Open your store, save a product, then:

- **Custom pixels:** in **Settings → Customer events**, open the pixel's **⋯** menu and choose **Test**, or use your platform's test tool (GA4 DebugView, Meta Pixel Helper, TikTok Pixel Helper).
- **Tag Manager:** use **Preview** and look for `add_to_wishlist` in the event list.

For anything else, listen to the `wishlist:add` [DOM event](https://wishlist.themivo.com/docs/js-api#events) in your own script.