Get started

Get started

Install the script

The one script tag Calmstats needs, where to put it, and the options it takes.

Add the script

Paste this tag into the <head> of every page on your site:

index.html
<script defer
  data-website-id="YOUR-SITE-ID"
  src="https://calmstats.com/script.js"></script>

Replace YOUR-SITE-ID with your website ID. The tag with your ID is in Settings → Tracking, ready to copy.

The script is about 2 KB, loads with defer so it never blocks your page, and works with any site or framework.

What it tracks

With nothing else added, the script records:

  • Pageviews, including client-side navigation in single-page apps.
  • Sources: referrers, UTM parameters (utm_source, utm_medium, utm_campaign, utm_term, utm_content) and channels.
  • Visitors and sessions: device, screen size and country. Sessions end after 30 minutes without activity.
  • Engagement: time on site, bounces, outbound link clicks, scroll depth and who is online now.

It sets no cookies. Visitors get a site-scoped ID in localStorage, and IP addresses are only used in memory for a daily salted hash. See the privacy notice for the details.

Check the install

  1. Open your site in a normal browser window, not one with an ad blocker that blocks analytics.
  2. In Calmstats, go to Settings → Tracking and click Verify installation.
  3. Your visit shows up in the Realtime report within a few seconds.

Nothing showing? See Visits are not showing.

Options

The tag takes a few optional attributes, such as respecting Do Not Track or excluding private pages:

AttributeExampleWhat it does
data-respect-dntdata-respect-dnt="true"Skip visitors whose browser sends Do Not Track.
data-spa-trackingdata-spa-tracking="false"Turn off pageviews on client-side URL changes (on by default for single-page apps).
data-excludedata-exclude="/app/**,/share/*"Stop tracking on matching paths; * is one path segment, ** is anything.
data-scroll-depthdata-scroll-depth="false"Turn off scroll depth (on by default).
data-host-urldata-host-url="https://stats.example.com"Send events to a different origin than the one serving the script.

More examples are in Script options.

Before the script loads

To send custom events with calmstats.track() before the script has finished loading, add this optional queue script just before the main tag. Calls made while the page loads are sent once Calmstats loads.

HTML
<script>window.calmstats=window.calmstats||{q:[]};["track","goal","identify"].forEach(function(m){window.calmstats[m]=window.calmstats[m]||function(){window.calmstats.q.push([m].concat([].slice.call(arguments)))}});</script>