Skip to content

Parse.ly Tracker: Alternative Setup Methods

Below are alternative methods for adding Parse.ly tracking to your site, if the default is not possible. Always replace ###### in the examples with your site id, e.g. mysite.com, as its registered with Parse.ly.

Load the tracker via JavaScript

Use this method when you can’t add custom HTML to your templates, or if your tag management system only allows JavaScript.

The following code dynamically creates an HTML <script> element, then loads the Parse.ly tracker in the standard way:

(function(d) {
  var b = d.body;
  var e = d.createElement('script');

  e.id = 'parsely-cfg';
  e.src = '//cdn.parsely.com/keys/######/p.js';
  e.setAttribute('async','');
  e.setAttribute('defer','');
  b.appendChild(e);
})(document);

Load the tracker in an iframe element

Use this method if you are unable to insert the Parse.ly tracker directly into the HTML markup of your pages, and must instead insert it into an iFrame:

First, on your server create a file called parsely.html with the following markup:

<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<!-- START Parse.ly Include: Standard -->
//cdn.parsely.com/keys/######/p.js
<!-- END Parse.ly Include: Standard -->
</body>
</html>

Then, add an iframe element to all the trackable pages, with the src pointing to that HTML file.

<a href="/path/to/parsely.html">/path/to/parsely.html</a>

The parsely.html file should be accessible on the same protocol (http/https), domain, and port as the page which contains the iframe itself or the JavaScript will fail to execute due to cross-site scripting limitations.

The Enhanced JavaScript Snippet

In many integration contexts, it’s easy to set up the basic integration to configure Parse.ly tracking after it has loaded. In some other contexts, getting the relative load order of various components right is more difficult. Integrations based on Google Tag Manager are one context in which this issue can arise.

For such situations, Parse.ly provides an “enhanced” JavaScript snippet that provides an abstraction over the timing of the Parse.ly tracker’s load sequence. To use the enhanced snippet, replace the Basic Parse.ly integration code on your webpage with the following (replacing ###### with your Parse.ly site id, e.g. mysite.com):

<script type="text/javascript">(function(){
var parsely=window.PARSELY=window.PARSELY||{};if(parsely._snippetVersion="1.0.0",!parsely.loaded)if(parsely._snippetInvoked)try{window.console&&console.error&&console.error("Parsely snippet included twice")}catch(e){}else{parsely._snippetInvoked=!0,parsely._stubs={onStart:[]},parsely._buildStub=function(e){return function(){parsely._stubs[e].push(arguments)}};for(var curStub in parsely._stubs)parsely._stubs.hasOwnProperty(curStub)&&(parsely[curStub]=parsely._buildStub(curStub))}parsely._load=function(e,s){s=void 0===s?"cdn.parsely.com":s;var r=document.createElement("script");r.id="parsely-cfg",r.type="text/javascript",r.async=!0,r.setAttribute("data-parsely-site",e),r.src="//"+s+"/keys/"+e+"/p.js",document.body.appendChild(r)};

// Parse.ly users: put your site id (aka apikey) in the call to _load() here (example: parsely._load("mysite.com"))
parsely._load("######");
})();</script>

This allows you to perform setup and configuration in PARSELY.onStart. For example, you might disable autotracking and then call trackPageView directly:

<script type="text/javascript">!(function(){
  PARSELY.onStart(function() {
    PARSELY.autotrack = false;
    PARSELY.beacon.trackPageView();
    });
  })
();</script>

When using the enhanced snippet, calls to onStart should be included on your webpage immediately after the snippet.

The enhanced snippet is only supported in tracker versions above 1.6.0. If you’re unsure of your tracker version, contact support@parsely.com

Configure the tracker to always use browser localStorage instead of cookies

By default, the Parse.ly tracker uses cookies to keep track of visitors and sessions. However, this data can be stored in each browser’s window.localStorage instead.

To use localStorage instead of cookies, simply make sure PARSELY.use_localstorage = true prior to loading the tracker, as in this example:

<script>
  window.PARSELY = window.PARSELY || {
    // ... other Parsely configuration options
    use_localstorage: true
    // ... other Parsely configuration options
  };
</script>

<!-- START Parse.ly Include -->
<!-- ...insert the parse.ly tracker code here... -->
<!-- END Parse.ly Include -->

One major limitation of localStorage is that, unlike cookies, data does not persist across subdomains. This means that if your site spans multiple subdomains (such as blog.parsely.com and help.parsely.com), cookies can use the same visitor and session data as a user navigates between them, but localStorage cannot. That difference would result in higher visitor counts and more new visitors in the Parse.ly dashboard and API when using localStorage.

The Parse.ly tracker automatically uses localStorage in browsers such as Safari where cookie expiration would otherwise prevent accurate data collection. No additional configuration is required for this behavior.

Configure the tracker for each subdomain to have its own first-party Cookie Pool

The Parsely JS SDK doesn’t always set cookies on subdomains. It actually sets its first-party cookies on the smallest domain possible. For example, if you load the Parse.ly tracker bundle on something.domain.com, the cookie will be set for domain.com.

This behavior is configurable. On every pageload, before the bundle loads, you can set PARSELY.cookieDomain = <current subdomain>;. This will make the bundle set cookies on the explicitly provided subdomains instead of its default of the smallest possible domain. Here is an example of what that can look like:

<script>
  	window.PARSELY = window.PARSELY || (window.PARSELY = {});
	PARSELY.cookieDomain = window.location.host;
</script>

<!-- START Parse.ly Include -->
<!-- ...insert the parse.ly tracker code here... -->
<!-- END Parse.ly Include -->

Last updated: October 16, 2024