# Connect your shop

> Send products and orders from your shop's backend, and add the Emailit tracking script to record product views, carts and purchases and recognize visitors who come from your emails. Alpha: open to the Emailit team only.

A shop sends Emailit two kinds of data: the catalog and orders from its backend, with the API, and what visitors do on the site, with the tracking script of [Event tracking](/docs/events/). Use both for the full picture: the API is the reliable record of orders, and the script adds product views, carts and visitors who arrive from your emails.

> **Commerce is in alpha:** Commerce is open only to the Emailit team while we test it. The API and the tracking script work only in workspaces owned by the Emailit team. See [Who can use Commerce](/docs/commerce/#who-can-use-commerce).

## Before you begin

- An [API key](/docs/developers/api-keys/) for the backend calls. An **Events Only** key can send products, orders and carts, the same key that sends [events from your backend](/docs/events/send-events/). It can't read anything back, so its responses hold only `object`, `id` and `external_id`. Use a **Full Access** key to also read data, manage coupons or change settings.
- For the tracking script, permission to add a script to your shop's pages.

## Send data from your backend

### Products

Send your catalog with [Create or update products in bulk](/docs/api-reference/products/batch/), and again whenever products change. Each product is identified by your shop's product ID, so sending it again updates it.

```bash
curl https://api.emailit.com/v2/products/batch \
  -X POST \
  -H "Authorization: Bearer $EMAILIT_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "products": [{
      "id": "1234",
      "title": "Trail Runner GTX",
      "url": "https://shop.example.com/products/trail-runner",
      "image_url": "https://shop.example.com/images/trail-runner.jpg",
      "price": 139,
      "compare_at_price": 169,
      "currency": "EUR",
      "categories": ["Shoes", "Running"],
      "inventory_quantity": 40
    }]
  }'
```

Product feeds in emails leave out archived products and products with an inventory of 0, so keep `status` and `inventory_quantity` up to date.

### Orders

When an order is placed, send it with [Create or update an order](/docs/api-reference/orders/create/):

```bash
curl https://api.emailit.com/v2/orders \
  -X POST \
  -H "Authorization: Bearer $EMAILIT_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "id": "1001",
    "email": "jane@example.com",
    "currency": "EUR",
    "total": 125,
    "shipping": 5,
    "coupon_codes": ["WLC-8K2M4P"],
    "cart_id": "cart_789",
    "items": [{ "product_id": "1234", "title": "Trail Runner GTX", "quantity": 1, "price": 120 }]
  }'
```

- `id` is your shop's order number. Sending the same `id` again updates the order instead of adding another.
- Emailit credits the order to the email the buyer last clicked or opened. See [How orders are credited](/docs/commerce/#how-orders-are-credited-to-emails).
- The buyer becomes a contact if they aren't one. Add `"accepts_marketing": true` and an `audience_id` to also subscribe them, for example when they ticked a newsletter box at checkout. `"create_contact": false` skips creating a contact. The tracking script's `purchase` command never creates or subscribes a contact.
- `cart_id` marks that cart as converted.

When the order is paid, fulfilled, canceled or refunded, send the change with [Update an order](/docs/api-reference/orders/update/), or send the order again with its new `status`. Canceled orders don't count toward revenue, and refunds are subtracted.

### Past orders

Import your order history with [Import orders in bulk](/docs/api-reference/orders/batch/), up to 1,000 orders per request. Imports are historical by default: they fill purchase history, metrics and recommendations, but aren't credited to emails and don't start automations.

## The tracking script

The tracking script records what visitors do on your site: product views, the cart, purchases and visits. It also recognizes visitors who arrive from your emails, so their activity belongs to their contact.

### Add the script

1. **Create a tracking key.** On **Email API → Events**, open the **Tracking** tab and select **Create tracking key**. Under **Allowed origins**, list your shop's domains, for example `shop.example.com` or `*.example.com`. Leave it empty to accept any site.

2. **Add the snippet to every page,** before `</head>`. The **Tracking** tab shows it with your key filled in:

```html
<script>window.emailit=window.emailit||function(){(window._emailitq=window._emailitq||[]).push(arguments)};</script>
<script async src="https://js.emailit.com/track/TRACKING_KEY/events.js"></script>
```

   Tracking keys are public: they can only send events, never read data. If the [Emailit forms](/docs/forms/install/) script is already on the page, keep both.

To also record a page view on every page, add `data-autotrack="pages"` to the script tag. Page views update when the contact was last active on your site and their time zone; they aren't stored as events.

### Record shop activity

Call these where they happen:

```js
// Product page
emailit("product", { id: "1234", title: "Trail Runner GTX", url: location.href,
  image_url: "https://shop.example.com/images/trail-runner.jpg", price: 139, currency: "EUR",
  categories: ["Shoes", "Running"] });

// Every time the cart changes
emailit("cart", { id: "cart_789", currency: "EUR", checkout_url: "https://shop.example.com/checkout",
  items: [{ product_id: "1234", title: "Trail Runner GTX", quantity: 1, price: 139 }] });

// Order confirmation page
emailit("purchase", { id: "1001", total: 125, currency: "EUR",
  items: [{ product_id: "1234", quantity: 1, price: 120 }], coupon_codes: ["WLC-8K2M4P"] });
```

| Command | Records |
| --- | --- |
| `product` | A product view. A product that isn't in your catalog yet is added from these fields; products you send with the API aren't changed. |
| `cart` | The whole current cart, replacing the previous version. Without an `id`, the visitor's cart is tracked under an ID of its own. Send an empty `items` list when the cart is emptied. |
| `purchase` | An order, with the same fields as the [Orders API](/docs/api-reference/orders/create/). It also converts the visitor's cart. Prefer sending orders from your backend: ad blockers can stop browser calls. If you do both, use the same order `id` so the order isn't counted twice. The script never changes an order you sent from your backend, and never creates or subscribes a contact. |
| `page` | A page view. Sent on every page with `data-autotrack="pages"`. |

### Identify visitors

Activity counts for a contact once the script knows who the visitor is:

- **From an email link.** When a contact clicks a link in a campaign or automation email that leads to your site, the link carries a signed `_eit` parameter. The script stores it and removes it from the address bar. Links get it when click tracking is on and the link goes to an allowed origin of a tracking key, or, for keys without allowed origins, to your sending domain.
- **When they sign in or check out,** call `identify` with their email address or contact ID:

```js
emailit("identify", { email: "jane@example.com" });
```

- **When they sign out,** call `emailit("reset")` to forget them on that browser.

Product views and carts from before the visitor was identified are moved to the contact. The script also records the browser's time zone, which [Recipient's local time](/docs/campaigns/sending-options/#recipients-local-time) sending uses, and when the contact was last active on your site.

`emailit("debug", true)` logs what the script sends to the browser console.

### Where the activity shows up

Shop activity goes to the same event log as your other events. Product views become [`product.viewed`](/docs/webhooks/events/product/viewed/) events, new or changed carts [`cart.updated`](/docs/webhooks/events/cart/updated/), and purchases [`order.placed`](/docs/webhooks/events/order/placed/). You see them on **Email API → Events** and in the contact's activity, and webhooks can subscribe to them. `product.viewed` and `cart.updated` aren't part of **All events**, so subscribe to them by name. See [Commerce events](/docs/commerce/#events).

## Verify it worked

- **Email Marketing → Commerce** shows your products and orders, and **Carts** shows carts from the script.
- **Email API → Events** lists `product.viewed`, `cart.updated` and `order.placed` events as visitors browse and buy.
- Open a contact who ordered: the **Purchases** card shows their orders, total spent and recently viewed products.
- After a campaign, orders credited to it show on its **Revenue** tab.

## Related

  - [Commerce](/docs/commerce/): Attribution, settings and the Commerce pages.
  - [Orders API](/docs/api-reference/orders/create/): Every order field.

---
Source: https://emailit.com/docs/commerce/connect-your-shop/
