grip-cdp-tracker
v0.1.14
Published
Grip CDP Tracker
Downloads
108
Keywords
Readme
Grip CDP Tracker
If you're hosting events with Grip, you can get further insights into exhibitors' and visitors' use of your own event site by using this Customer Data Platform package.
Installation
with NPM/Yarn
npm install @grip/cdp-tracker
yarn install @grip/cdp-tracker
Old-School JS Snippet
In HTML <head>
:
<script src="https://cdn.jsdelivr.net/npm/@grip/cdp-tracker/..."></script>
<script>
gripCdpTracker.init({
/* ... */
});
gripCdpTracker.trackPageView();
// ...etc.
</script>
Usage
import * as GripCDP from '@grip/cdp-tracker';
Initialization
GripCDP.init({
app_id: 123,
container_id: 123,
registration_id: "N1408",
});
init()
takes one object parameter with various properties.
You'll need to let us know the app_id
and container_id
. (Note that the container_id
may also be called Event ID in some places.)
You can also set the registration_id
if known. The from_id
is actually preferred, but it's unlikely to be known unless the user is logged into a Grip app or website.
Tracking Page Views
GripCDP.trackPageView();
trackPageView()
takes the following parameters
meta
(optional)- an object with any additional data which needs to be tracked
URL
(optional)- The
document.URL
value will be used unless you pass in an alternative string
- The
Tracking Page Visibility
GripCDP.trackPageVisibility();
As the page is shown/hidden, the document.URL
will be recorded along with page-shown
/page-hidden
. The document unload
event is unreliable so we watch visibility instead, with the assumption that when it's invisible it has been closed.
GripCDP.startHeartbeat();
Every second that the page is visible, we'll record the fact. You can optionally pass a number of milliseconds between each "heartbeat".
Every time this is called it will stop any existing heartbeat (using stopHeartbeat()
) and start a new one.
Tracking Link Clicks
GripCDP.trackLinkClicks({
content_title: "",
content_type: "",
track: "",
session_id: 0,
source: "",
});
This will find all regular <a href="...
tags on the page and track when they've been clicked, automatically noting the href
value.
You can optionally add any meta (applied to all links on the page).
You will probably need to rerun this after each navigation event if you're using a Single Page App or any other dynamic content loading approach.
Tracking custom events
GripCDP.trackEvent("start", "stream", 123, {
title: "Never Gonna Give You Up!",
});
trackEvent()
takes the following parameters
event
- a string (verb) describing what's happened
to_type
- a string naming the event subject's type, e.g.
session
/advert
etc
- a string naming the event subject's type, e.g.
to_id
- a number/string identifying whatever is being acted upon
meta
(optional)- an object with any further information