After registering, this guide will be customized for your account; please do not install the snippets below.

Reference Documentation

Documentation of optional features and functionality.


JavaScript Client Overview

Place the initialization snippet at the end of your HEAD tag. This snippet will setup the client, configure cookies and report a pageview.

<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->

Identities

To identify a user's browsing behaviors, add an identify command to your snippet when the user is logged in. CLIENT_ID should be replaced with a unique id for each user such as your own user_id, an email or any other consistent unique identifier. You can also pass optional meta information such as the user name or email. If you add the client_id to an event, an identity command will be sent automatically. Use this Identity command when you want to report extra information, or to report identities separate from events.

After initialization
_attio.identity({client_id: 'CLIENT_ID', meta: {name: 'ExampleName', total_orders: 4}});

Events from JavaScript

Report events on a thank-you or confirmation page. Be sure to set the transaction_id to avoid reporting duplicate events, as users browse forward/backward/refresh pages. When Client_id is set on an event an identity will be sent to connect the web activity with this client_id, if not already set.
You can add is_informational to set that an event is purely for informational purposes: it will show in the customer timeline and will not have attribution modeling run on it. Use this for things like contact forms or other non-marketing goal events that are still interesting.

Lead Gen lead gen
_attio.event({key: 'leadgen', transaction_id: 'UNIQUE_TRANSACTION_ID', client_id: 'CLIENT_ID', meta:{any: 'value'}});
purchase2 purchase also
_attio.event({key: 'PURCHASE_EVENT_KEY', transaction_id: 'UNIQUE_TRANSACTION_ID', client_id: 'CLIENT_ID', amount: 123.45, meta:{any: 'value'}});
Registration User registers for an account
_attio.event({key: 'aad9986718703ecf', transaction_id: 'UNIQUE_TRANSACTION_ID', client_id: 'CLIENT_ID', meta:{any: 'value'}});
Purchase User completes a purchase
_attio.event({key: 'ac73be8f555ce0a4', transaction_id: 'UNIQUE_TRANSACTION_ID', client_id: 'CLIENT_ID', amount: 123.45, meta:{any: 'value'}});

Debugging

To show debugging information in the browser console, add a debugging line to the initialization. The sooner you set debugging, the more debugging infomation you will see.

<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.debug({enabled:true});
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->

Cross Domain Tracking

The normal JavaScript client install will track pageviews and users across one top-level domain (e.g. example.com). All subdomains, such as landing.example.com or www.example.com will be tracked by default with no changes needed.

To enable cross-domain tracking, include the line below. This will add the permanent and session cookie values to the URL of second domain so that the session tracking continues without interruption. It is recommended to also setup the second domain to properly track clicks back to the first domain.

Note that this does not work for forms that use the GET.

On Domain 1
This appends links and forms to domain2.com
<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.linkDomain({domains:['domain2.com']});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->
On Domain 2
This appends links and forms to domain1.com
<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.linkDomain({domains:['domain1.com']});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->

AJAX Pageloading

AJAX page loading tools(e.g. Turbolinks, InstantClick, etc.) work by replacing the contents of the body tag and manually updating the URL. They can interfere with scripts that run on page load, since each additional pageview is controlled by the script.

The Attribution.io site uses AJAX and this client, feel free to look at the code there as a starting point for your own.

Attribution.io's client automatically does several things when loaded: fetches the library, sets cookies and reports pageviews. You can prevent pageview reporting by setting autoRun to false (example below). Place other commands after this one to ensure they aren't triggered immediately (e.g. identify & events )

<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.autoRun({enabled:false});
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->

When a page load completes (for example, after TurboLinks "page:change" event or InstantClick 'change' event), you can trigger a pageview manually via:

  <script>window._attio.pageview();</script>

If you need, you can bypass the entire AJAX loading functions by loading everything into the BODY tag, which is replaced and re-run on every pageview. Place your snippet into your body tag to erase and reload the Attribution.io client on every pageview. This snippet is the same as any other non-AJAX snippet.

<!-- Start Attribution.io Snippet -->
<script>
!function(){var t=window._attio=window._attio||[]
t.methods=["setAccount","debug","pageview","event","identity","load","linkDomain","autoRun", "honorDNT"],t.factory=function(e){return function(){return a=Array.prototype.slice.call(arguments)[0]||{},a.command=e,t.push(a),t}};for(var e=0;e<t.methods.length;e++){var n=t.methods[e];t[n]=t.factory(n)}t.load=function(t){var e=document.createElement("script");e.type="text/javascript",e.async=1,e.src="https://cdn.attribution.io/client.js.gz";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)
}
_attio.setAccount({public_key: 'REPLACE_THIS_VALUE'});
_attio.load();
}();
</script>
<!-- End Attribution.io Snippet -->

DoNotTrack

DoNotTrack is a setting that browsers can report that means they do not wish to be tracked anywhere. When this option is enabled, the client will honor the browsers setting and will not report anything nor set any cookies. We leave this as a non-default setting because most of the analytics ecosystem does not respect it, potentially causing metrics to vary wildly.

 _attio.honorDNT({enabled:true}) 

Server Side Event Reporting

To report server-side events send a POST request to

https://api.attribution.io/events
with the data in JSON format, like so:

{
  "client_id": "CLIENT_ID",
  "public_key": "REPLACE_THIS_VALUE",
  "event_public_key": "leadgen",
  "transaction_id": "TRANSACTION_ID",
  "amount": 0.0,
  "meta": {
    "free": "Any metadata you want to pass through, such as product category/color/sku/etc."
  },
  "location": "Any event reporting metadata that you want to pass through, such as \"after purchase billed & completed\""
}

Event Field Listing

The fields are:

  • client_id: Your identifier for this user, for example the ID of your user.
  • public_key: The public key for your account, this key goes into every one of your requests. Is is the same value as the "setAccount" command in the JavaScript snippets above.
  • event_name: An optional field that helps you know what event the event_public_key means.
  • event_public_key: A unique key that uniquely defines this type of event. This can be found in your event settings page, or in the JavaScript snippets above.
  • transaction_id: An optional (but highly recommended) field that ensures duplicate transactions aren't processed. Only the first unique transaction_id is kept.
  • amount: An optional field used to track purchases or other revenue-generating behaviors.
  • is_informational: An optional field used to indicate if an event is purely for informational purposes. Send true/false.
  • location: An optional field used to explain where the event was triggered. This is shown when browsing a customers timeline and can help non-technical users understand why it was sent. Could be a URL or a short description of the backend process that sent the event.
  • meta: An optional field used to pass in extra information about the event. This information is visible in the customer timeline, but is not part of any processing.