> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mention-me.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Order Tracking
> Track conversions by adding the order tracking tag or pixel to your order confirmation page
export const SignInNotice = ({message = "To see code snippets pre-filled with your partner code"}) => {
return
';
nav.parentNode.insertBefore(badge, nav);
badge.querySelector(".mm-partner-badge-reset").addEventListener("click", e => {
e.preventDefault();
e.stopPropagation();
if (source === "clerk" && window.Clerk && window.Clerk.signOut) {
clearMerchant();
const redirect = SIGN_IN_BASE + "?redirect_url=" + encodeURIComponent(window.location.href);
window.Clerk.signOut().then(() => {
window.location.href = redirect;
}).catch(() => {
window.location.reload();
});
return;
}
clearStoredPartner();
window.location.reload();
});
};
const removePartnerBadge = () => {
const el = document.getElementById(BADGE_ID);
if (el) el.remove();
};
const showNotices = () => {
document.querySelectorAll("[data-mm-sign-in]").forEach(el => {
el.style.display = "";
});
const redirect = SIGN_IN_BASE + "?redirect_url=" + encodeURIComponent(window.location.href);
document.querySelectorAll("[data-mm-sign-in-link]").forEach(a => {
a.href = redirect;
});
};
const hideNotices = () => {
document.querySelectorAll("[data-mm-sign-in]").forEach(el => {
el.style.display = "none";
});
};
const walkCodeBlocks = replacements => {
document.querySelectorAll("pre code").forEach(codeEl => {
let html = codeEl.innerHTML;
if (replacements) {
for (const [from, to] of replacements) {
html = html.split(from).join(escapeHtml(to));
}
}
const paramStyle = "color:inherit;filter:brightness(110%);font-weight:bold;text-decoration:underline;cursor:pointer";
html = html.replace(/(\?|&)([a-z_]+)=/g, (match, prefix, name) => {
const slug = name.replace(/_/g, "-");
const target = document.getElementById("param-" + slug);
if (!target) return match;
return prefix + '' + name + "=";
});
codeEl.innerHTML = html;
});
};
const observeTabSwitches = callback => {
let processing = false;
const observer = new MutationObserver(() => {
if (processing) return;
processing = true;
setTimeout(() => {
callback();
processing = false;
}, 50);
});
setTimeout(() => {
const tabs = document.querySelector("[role='tablist']");
if (tabs && tabs.parentElement) {
observer.observe(tabs.parentElement, {
attributes: true,
subtree: true,
childList: true
});
}
}, 500);
};
const pollForClerk = (onReady, onTimeout) => {
let n = 0;
const tick = () => {
if (window.Clerk && window.Clerk.loaded) {
return onReady(window.Clerk);
}
if (++n < 40) {
setTimeout(tick, 250);
} else {
onTimeout();
}
};
setTimeout(tick, 100);
};
const fetchMerchantFromAPI = () => {
return fetch(API_BASE + "/api/docs/context", {
credentials: "include",
cache: "no-store"
}).then(res => res.ok ? res.json() : null);
};
useEffect(() => {
let cancelled = false;
const urlPartner = captureQueryParams();
const onPersonalised = (merchant, source) => {
if (cancelled) return;
const replacements = [["YOUR_PARTNER_CODE", merchant.partnerCode]];
if (merchant.displayName) {
replacements.push(["YOUR_TRADING_NAME", merchant.displayName]);
}
hideNotices();
showPartnerBadge(merchant, source);
walkCodeBlocks(replacements);
observeTabSwitches(() => walkCodeBlocks(replacements));
};
const onUnauth = () => {
if (cancelled) return;
clearMerchant();
removePartnerBadge();
showNotices();
walkCodeBlocks(null);
observeTabSwitches(() => walkCodeBlocks(null));
};
const tryUrlFallback = () => {
if (cancelled) return;
if (urlPartner) {
onPersonalised(urlPartner, "url");
} else {
onUnauth();
}
};
if (!document.cookie.includes("__client_uat")) {
tryUrlFallback();
return;
}
pollForClerk(clerk => {
if (cancelled) return;
if (!clerk.session) {
tryUrlFallback();
return;
}
fetchMerchantFromAPI().then(data => {
if (data) {
publishMerchant(data);
onPersonalised(data, "clerk");
} else {
tryUrlFallback();
}
}).catch(() => tryUrlFallback());
}, () => {
if (!cancelled) tryUrlFallback();
});
return () => {
cancelled = true;
};
}, []);
return null;
};
## Overview
The order tracking tag captures conversion data when a customer completes a purchase. Place it on your order confirmation page alongside the [referrer tag](/developer-docs/integration/entry-points/referrer), or use it standalone if you only need conversion tracking without the referral overlay.
## Integration
Add this snippet to the bottom of the `` tag on your order confirmation page:
```html Demo theme={null}
```
```html Live theme={null}
```
If you cannot include the JavaScript tag on your order confirmation page (for example, if you're including it on a page without access to order details or with restricted scripting), you can use this alternative 1x1 tracking pixel.
```html Demo theme={null}
```
```html Live theme={null}
```
The pixel returns:
* **HTTP 204** (No Content) if the request was processed successfully
* **HTTP 404** (Not Found) if there is a problem with the parameters
In neither case will it cause an error or anything visible on the page.
## Parameters
Both the JavaScript tag and the tracking pixel accept the same parameters.
### Mandatory
The customer's email address. Please URL encode. Example: `doreen@example.com`
The unique order identifier from your system. Has a maximum of 50 characters. Example: `ORD-12345`
The order subtotal (excluding VAT/taxes and shipping) in the currency indicated by the `order_currency` parameter. If you can't remove VAT, let us know. Example: `49.99`
The three character (ISO 4217) currency code that the order total is in. Example: `GBP`
The coupon code used by the customer (if any). Example: `SAVE10`
### Recommended
The unique customer identifier from your system. Example: `CUST-789`
The number of items in the basket (if applicable). This helps us understand the type of purchase and can be a signal of advocacy. Example: `3`
The discount amount — our assumption is this has already been taken off the order subtotal provided. This allows us to calculate the Cost Per Acquisition for referral. Example: `5.00`
String representing a customer segment (for example one of: men, women) used to pass segmentation data about your customer to us. Has a maximum of 50 characters. Example: `vip`
Whether this order is for a subscription (recurring). This helps us qualify and categorise the revenue. Example: `true`
Whether this order is a gift (being bought for someone else). Gifts can be signals of advocacy. Example: `false`
Any piece of custom data you wish to pass to us.
The customer's address line 1 (if known).
The customer's address line 2 (if known).
The customer's address city (if known).
The customer's address county (if known).
The customer's address postcode (if known).
The customer's address country (if known).
A piece of text you can use to pass into sharing widgets, such as what the user bought or how much they saved.
The date and time the order was placed. The format must be in ISO 8601 format and URL encoded. If not provided or invalid, we will use the date and time at the point we received the tag.
In some cases it may be desirable to ensure that email addresses and other information is not in clear text. See [encrypted parameters](/developer-docs/integration/encrypted-parameters).
Locale code (e.g. `en_GB`).
## Verb Aliases in the URL
The verb in the URL path (`order`) can be replaced with `booking`, `signup`, or `transaction`, matching whichever term best describes the action on your site. All four verbs behave identically.
The same applies to the pixel form: `orderpixel` can be replaced with `bookingpixel`, `signuppixel`, or `transactionpixel`. Each pixel verb still ends with `/pixel.gif`.
For example, a signup pixel would look like:
```html theme={null}
```
## Parameter Aliases for Non-Ecommerce
If your business tracks bookings or signups rather than orders, you can use alternative parameter names. The tag behaviour is identical — only the parameter names differ.
Alias for `order_number`.
Alias for `order_subtotal`.
Alias for `order_currency`.
Alias for `order_date`.
Alias for `order_item_count`.
Alias for `order_is_subscription`.
Alias for `order_is_gift`.
Alias for `order_discount_amount`.
Alias for `order_number`.
Alias for `order_subtotal`.
Alias for `order_currency`.
Alias for `order_date`.
Alias for `order_item_count`.
Alias for `order_is_subscription`.
Alias for `order_is_gift`.
Alias for `order_discount_amount`.
```
```html Live theme={null}
```
```
## Parameter Aliases for Non-Ecommerce
If your business tracks bookings or signups rather than orders, you can use alternative parameter names. The tag behaviour is identical — only the parameter names differ.