Chord CDP
...
CDP Destination Catalog
Contentsquare Heap (Pixel)
9 min
introduction the heap pixel destination loads the heap browser sdk directly in the visitor's browser (device mode) and sends events client side unlike the , device mode events originate from the browser, enabling heap's automatic interaction capture, session replay, and heatmap features use this destination alongside the for maximum coverage getting started this is a device mode destination the heap javascript sdk is loaded automatically — no manual script installation is required you will need app id (environment id) — found in account > manage > projects in the heap dashboard each project (environment) has its own app id connecting to the heap pixel cdp destination before connecting destinations in the chord cdp, please verify with all destination owners that all non chord cdp configured destinations are disabled running external destinations alongside configured chord cdp destinations can result in duplicate events downstream log into the chord data platform navigate to the cdp click the "add" button next to destinations select heap (device mode) from the destination catalog enter the destination name and app id click "create" to connect events event mapping chord event type heap sdk method notes track heap track(eventname, properties) event name and properties forwarded as is page heap track("page view", properties) page metadata included in properties identify heap identify(identity) + heap adduserproperties(traits) identity resolved from userid > email trait track events track events call heap track() with the event name and properties heap argument chord source notes eventname event (event name) properties properties all event properties forwarded page events page events call heap track("page view", ) with page metadata merged into properties heap argument chord source notes eventname (hardcoded) "page view" properties properties merged with page context includes url , path , referrer , title from context page identify events identify events call both heap identify() to set the user identity and heap adduserproperties() to attach traits heap method chord source (priority order) notes heap identify(identity) userid > context traits email > traits email if no identity can be resolved, the call is skipped heap adduserproperties(traits) traits merged with context traits all user traits forwarded initialization on first event, the plugin injects the heap sdk stub queue ( window\ heap ) into the page loads the heap sdk script from https //cdn heapanalytics com/js/heap 0 js calls heap load(appid) to initialize heap with your app id the plugin tracks sdk loading state ( fresh → loading → loaded / failed ) using a shared state flag ( window chordcdpheapstate ) to prevent duplicate script loads across concurrent events events that arrive while the sdk is loading are queued and processed after initialization completes if the sdk fails to load, subsequent events are silently dropped csp requirements if your site uses a content security policy, allow the following domains directive domain script src https //cdn heapanalytics com connect src https //cdn heapanalytics com https //heapanalytics com img src https //heapanalytics com combining with server side heap running both the heap pixel (device mode) and the provides redundancy device mode captures browser native interactions and enables session replay / heatmaps server side captures events that may be blocked by ad blockers or occur outside the browser heap deduplicates events that share the same identity and timestamp, so duplicate counting is generally not a concern when running both in parallel