Client-side event tracker for Sort'd Collection Merchandiser
npm install @beefynachos/cm-trackerA lightweight JavaScript/React-friendly client-side tracking library for Sort’d Merchandiser.
This package provides the official tracking implementation required to power Sort’d analytics, scoring, automation insights, and merchandising optimisation.
It supports all required storefront events:
* Collection views
* Product views
* Product card (grid) impressions
* Add-to-cart actions
Purchase events are handled separately via a Shopify Pixel implemented by the Sort’d team.
---
``bash`
npm install @beefynachos/cm-trackeror
yarn add @beefynachos/cm-tracker
---
Create a global tracker instance and wrap your app with a provider:
`jsx
import {createContext, useContext, useEffect, useRef} from 'react';
import {CMEventTracker} from '@beefynachos/cm-tracker';
const CmTrackerContext = createContext(null);
export function CmTrackerProvider({children}) {
const trackerRef = useRef(null);
useEffect(() => {
if (typeof window === 'undefined') return;
trackerRef.current = new CMEventTracker({
store: 'your-store.myshopify.com',
endpoint: 'https://your-sortd-endpoint.example.com',
debug: false,
});
}, []);
return (
{children}
);
}
export function useCmTracker() {
return useContext(CmTrackerContext);
}
`
Use it anywhere in your components:
`jsx
const cmTracker = useCmTracker();
cmTracker?.trackCollectionView({
collectionId: 123456789,
});
`
---
For complete implementation instructions—including required events, Hydrogen/Next.js examples, testing guidance, and best practices—refer to the full documentation:
👉 Sort’d Headless Tracking Integration Guide
---
Checkout completion events are tracked automatically using a Shopify Pixel implemented and maintained by the Sort’d team.
No additional development is required in your storefront.
Your storefront domain must match your checkout complete domain for attribution to work correctly.
If they differ, contact your Sort’d representative for assistance.
If you'd like Sort’d to verify purchase tracking, please provide:
* Instructions for completing a test order
* Any required discount codes or bypass steps
* Details on which product(s) to use
---
To enable debug output:
`js``
new CMEventTracker({
store,
endpoint,
debug: true,
});
Inspect network events using Chrome DevTools → Network and filter by your endpoint URL.
---
If you have questions or need help implementing the tracker, the Sort’d team is here to assist.
---