Skip to main content

Quick start guide

Quick start (plus modelling!)​

We recommend looking at the Advanced Analytics for Web accelerator to walk through tracking and modelling web events. It's a more in depth look at how to use Snowplow than this page.

Quick start (basic)​

Follow these instructions to quickly implement a Snowplow web tracker with default configuration, and track a page view.

Getting started with sending events using the JavaScript tracker is very similar to other web analytics vendors like Google Analytics, Adobe Analytics, etc.

The process involves the following high level steps:

  • Download the latest version of the Snowplow JavaScript tracker file, sp.js, which can be found here.
  • If you are already hosting static files somewhere on your own domain, it should just be a matter of downloading and adding the sp.js file. Otherwise you can follow our guides for self hosting, use another method of your choice, or leverage a Third Party CDN (useful for evaluation or testing).
  • Once you have a JS tracker available, you can add the tag snippet to your site. There are also alternative options described below for adding the tracker to your website.
  • If manually inserting the tag into your website or tag management solution: Snowplow BDP users can generate a tag snippet in the Snowplow BDP Console here. Other users can use and edit the standard tag here.
 ;(function(p,l,o,w,i,n,g){if(!p[i]){p.GlobalSnowplowNamespace=p.GlobalSnowplowNamespace||[]; p.GlobalSnowplowNamespace.push(i);p[i]=function(){(p[i].q=p[i].q||[]).push(arguments) };p[i].q=p[i].q||[];n=l.createElement(o);g=l.getElementsByTagName(o)[0];n.async=1; n.src=w;g.parentNode.insertBefore(n,g)}}(window,document,"script","{{URL to sp.js}}","snowplow"));

  • Once you’ve generated your tag add it to all the pages you’d like to track:

    • Place the tag directly into your codebase. Typically this will be placed into the <head> element of your page or in a similar, suitable, location if using a Single Page Application framework.
      • The JavaScript Tracker supports both synchronous and asynchronous tags. We recommend the asynchronous tags in nearly all instances, as these do not slow down page load times.
    • Load the tag using a Tag Management solution such as Google Tag Manager, usually triggered on page load.

  • Configure an instance of the tracker by calling newTracker with your desired properties.

window.snowplow('newTracker', 'sp1', '{{collector_url}}', {
  appId: 'my-app-id'
})
  • Then you can use the track methods to send some events. You can send a Page View event to all initialised trackers with just:
window.snowplow('trackPageView');

Rather than adding the tag snippet directly, you may wish to use an alternative option for loading the JavaScript Tracker.

What's tracked with the default configuration?​

Using just the initialization snippets above won't result in any events, unless trackPageView is called.

However, we recommend that activity tracking (page pings) is enabled immediately following initialization.

import {
  newTracker,
  trackPageView
} from '@snowplow/browser-tracker';

newTracker('sp', '{{collector_url_here}}', {
    appId: 'my-app-id',
});

enableActivityTracking({
  minimumVisitLength: 30,
  heartbeatDelay: 10
});

// trackPageView() can then be called

Adding this code to your site will cause page ping events to be automatically tracked and sent via POST.

If using the Browser tracker, the events will all have the webPage context entity attached, containing the page view ID. If using the JavaScript tracker, the page pings will have the webPage as well as performanceTiming, gaCookies, and clientHint entities. Read more about these entities here.