Deploying the Permutive JavaScript Tag

In this article

a general guide to successfully deploy the Permutive tag.

Overview

Integrating Permutive with your website is simple. The deployment consists of deploying a JavaScript tag on your website, after which Permutive will begin collecting event data. Once deployed, you can enable and configure our integrations with your favourite tools.

For new customers, our team will typically work closely with you to configure the tag to pick up details about your content. Finally, we'll work with you to verify a successful deployment.

Prerequisites

  • Permutive Project - You should already have a Permutive project. If you are not yet a customer, get in touch!
  • Public API Key - You should have a public API key assigned to your Permutive project. An API key is automatically created on all new projects and can be found in the dashboard.
  • Web Addon - Your project should have the web addon enabled. This addon is enabled on all new projects by default - however you can check this in the dashboard.

Setup

The JavaScript Tag

Our team will provide you with the latest version of the Permutive JavaScript tag. The tag will look similar to the below example but will be configured for deployment on your site.

The Permutive JavaScript tag should be deployed on your website on all pages where you want Permutive to run. The basic version of our tag enables our default web collectors which will track a set of basic events, such as Pageviews:

<script>
!function(n,e,o,r,i){if(!e){e=e||{},window.permutive=e,e.q=[],e.config=i||{},e.config.projectId=o,e.config.apiKey=r,e.config.environment=e.config.environment||"production";for(var t=["addon","identify","track","trigger","query","segment","segments","ready","on","once","user","consent"],c=0;c<t.length;c++){var f=t[c];e[f]=function(n){return function(){var o=Array.prototype.slice.call(arguments,0);e.q.push({functionName:n,arguments:o})}}(f)}}}(document,window.permutive,"<PROJECT_ID>","<API_KEY>",{});
permutive.addon("web", {});
</script>
<script async src="https://cdn.permutive.com/<PROJECT_ID>-web.js"></script>

Note: you must ensure you replace all occurrences of PROJECT_ID and API_KEY appropriately.  If you are unsure of your Project ID and API_KEY, please contact support

 

Best Practices

  • When deploying the script, ensure it is placed in between your <head> and </head> tags on each page. We recommend our customers deploy Permutive early on the page, i.e. above other scripts in the <HEAD> section where possible. This helps ensure Permutive loads as quickly as possible and is able to update targeting information on the page. This is especially important when using our advertising integrations, as we need to process data in real-time before ad requests are made.
  • We strongly recommend against deploying our tag via tag managers, such as GTM. While Permutive can be deployed in this way, doing so can cause significant delays and prevent Permutive from loading quickly. Note that our script loads asynchronously, so should not impact page load times or page performance.

DFP / Google Ad Manager

Many of our customers use Permutive's Google Ad Manager integration. If you intend to use the GAM integration in future, an additional deployment step is needed at this stage. 

We recommend all customers deploy a small piece of JavaScript which reads Permutive targeting data from the browser cache, and ensures it is passed into GAM early on page load. By doing this, we can guarantee that cached Permutive segments are sent into GAM on every ad request.

The JavaScript required for this is shown below. This script should be placed after googletag  is defined but before a call is made to googletag.enableServices() .

<script>
window.googletag = window.googletag || {}
window.googletag.cmd = window.googletag.cmd || []

window.googletag.cmd.push(function() {
  if (window.googletag.pubads().getTargeting('permutive').length == 0) {
    var kvs = window.localStorage.getItem('_pdfps');
    window.googletag.pubads().setTargeting('permutive', kvs ? JSON.parse(kvs) : []);
  }
});
</script>
 

Note: This article assumes that you already have a Permutive project and have been provided with our JavaScript tag for deployment on-site. If this is not the case, then please get in touch!

For more information on the technical details and advanced deployment options, please see our developer docs.

If you have any questions, please contact customer support by emailing support@permutive.com or chat to the Customer Operations Team via the LiveChat icon in the bottom right corner of your screen.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request