{"componentChunkName":"component---src-templates-markdown-template-jsx","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/javascript/","result":{"data":{"pageMetadata":{"title":"JavaScript","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/javascript/","sourceCode":null,"metadataParent":{"title":"SDKs","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/","sourceCode":null,"hasVersionPicker":null,"metadataChildren":[{"title":"SDKs Introduction","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/introduction/","order":6.1,"label":null},{"title":"React Native","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/react-native/","order":6.2,"label":null},{"title":"iOS","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/iOS/","order":6.3,"label":null},{"title":"Android","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/android/","order":6.4,"label":null},{"title":"Java","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/java/","order":6.4,"label":null},{"title":"JavaScript","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/javascript/","order":6.5,"label":null},{"title":"Python","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/python/","order":6.6,"label":null},{"title":"Object API","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/object-api/","order":6.7,"label":null}],"metadataParent":{"title":"Developer Docs","path":"/guides/analytics/analytics-deprecated/developer-docs/","metadataChildren":[{"title":"Introduction","path":"/guides/analytics/analytics-deprecated/developer-docs/introduction/","order":1,"label":null},{"title":"Integrations","path":"/guides/analytics/analytics-deprecated/developer-docs/integrations/","order":4,"label":null},{"title":"Data Warehouses and Data Lakes","path":"/guides/analytics/analytics-deprecated/developer-docs/data-warehouses-lakes/","order":5,"label":null},{"title":"APIs","path":"/guides/analytics/analytics-deprecated/developer-docs/apis/","order":6,"label":null},{"title":"SDKs","path":"/guides/analytics/analytics-deprecated/developer-docs/sdks/","order":6,"label":null},{"title":"Developer Basics","path":"/guides/analytics/analytics-deprecated/developer-docs/developer-basics/","order":7,"label":null}],"metadataParent":{"title":"Analytics (Deprecated)","path":"/guides/analytics/analytics-deprecated/","metadataChildren":[{"title":"Introduction","path":"/guides/analytics/analytics-deprecated/introduction/","order":1.1,"label":null},{"title":"Developer Docs","path":"/guides/analytics/analytics-deprecated/developer-docs/","order":4,"label":null},{"title":"Identity Providers","path":"/guides/analytics/analytics-deprecated/identity-providers/","order":null,"label":null},{"title":"Settings","path":"/guides/analytics/analytics-deprecated/settings/","order":null,"label":null}],"metadataParent":{"title":"Analytics","path":"/guides/analytics/","metadataChildren":[{"title":"Introduction","path":"/guides/analytics/introduction/","order":1,"label":null},{"title":"Core Analytics (Beta)","path":"/guides/analytics/core-analytics/","order":1.1,"label":null},{"title":"Analytics Free Trial","path":"/guides/analytics/analytics-free-trial/","order":2,"label":null},{"title":"Setup","path":"/guides/analytics/setup/","order":3,"label":null},{"title":"Settings","path":"/guides/analytics/settings/","order":4,"label":null},{"title":"Analytics Data Manager","path":"/guides/analytics/data-manager/","order":5,"label":null},{"title":"Analyses","path":"/guides/analytics/analyses/","order":6,"label":null},{"title":"Query Builder","path":"/guides/analytics/query-builder/","order":6,"label":null},{"title":"User Aliasing","path":"/guides/analytics/user-aliasing/","order":7,"label":null},{"title":"Dashboards","path":"/guides/analytics/dashboards/","order":8,"label":null},{"title":"Analytics Resources","path":"/guides/analytics/resources/","order":10,"label":null},{"title":"User Segments","path":"/guides/analytics/user-segments/","order":10,"label":null},{"title":"Tutorials","path":"/guides/analytics/tutorials/","order":11,"label":null},{"title":"APIs","path":"/guides/analytics/apis/","order":12,"label":null},{"title":"Analytics (Deprecated)","path":"/guides/analytics/analytics-deprecated/","order":13,"label":null}],"metadataParent":{"title":"Guides","path":"/guides/","metadataChildren":[{"title":"Platform Overview","path":"/guides/platform-overview/","order":0.5,"label":null},{"title":"Getting Started","path":"/guides/getting-started/","order":1,"label":null},{"title":"mParticle Agent","path":"/guides/mparticle-agent/","order":1.5,"label":null},{"title":"Oversight","path":"/guides/oversight/","order":2,"label":null},{"title":"Data Platform","path":"/guides/data-platform/","order":3,"label":null},{"title":"Data Warehouse","path":"/guides/data-warehouse/","order":4,"label":null},{"title":"Customer 360","path":"/guides/customer-360/","order":5,"label":null},{"title":"Analytics","path":"/guides/analytics/","order":6,"label":null},{"title":"Audiences","path":"/guides/audiences/","order":7,"label":null},{"title":"Settings","path":"/guides/settings/","order":8,"label":null},{"title":"Troubleshooting mParticle","path":"/guides/troubleshooting/","order":10,"label":null},{"title":"Default Service Limits","path":"/guides/default-service-limits/","order":11,"label":null},{"title":"Glossary","path":"/guides/glossary/","order":12,"label":null}]}}}}}},"markdownRemark":{"html":"<aside class=\"warning\">\n<strong>Analytics Sunset</strong><br />\nWe began sunsetting mParticle Analytics on October 1, 2026. As a result, the features and workflows described on this page may no longer be available. This documentation is retained for reference. If you have questions about how this change affects your account, contact your mParticle account representative.\n</aside>\n<aside>\n  <strong>Note:</strong> The JavaScript SDK is available to legacy Indicative customers\n  only. mParticle customers should use\n  <a href=\"https://docs.mparticle.com/developers/\">the mParticle developer documentation.</a>\n</aside>\n<p>To get started with JavaScript, you can add an HTML script snippet to each page in your application. By default, this will start tracking Web Session and Page View events, and will allow you to start sending custom events.</p>\n<p>The JavaScript SDK is great for client-side tracking and can be used in conjunction with our API to send server-side events.</p>\n<h2 id=\"installation\" style=\"position:relative;\"><a href=\"#installation\" aria-label=\"installation permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Installation</h2>\n<h3 id=\"script-for-non-amd-sites\" style=\"position:relative;\"><a href=\"#script-for-non-amd-sites\" aria-label=\"script for non amd sites permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Script for Non-AMD Sites</h3>\n<p>Please note, the instructions in this section are only valid for sites that don’t use AMD (e.g. require.js). </p>\n<p>First, you’ll need to asynchronously load our script into your site. Add this script in either your site’s <head> or <body>tag:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">&lt;script type=&quot;text/javascript&quot;&gt;\n        (function(apiKey) {\n                var ind = document.createElement(&#39;script&#39;);\n                ind.src = &#39;//cdn.indicative.com/js/1.0.2/Indicative.min.js&#39;;\n                ind.type = &#39;text/javascript&#39;;\n                ind.async = &#39;true&#39;;\n                var ind_init = false;\n                ind.onload = ind.onreadystatechange = function() {\n                    var rs = this.readyState;\n                    if (ind_init || (rs &amp;&amp; rs != &#39;complete&#39; &amp;&amp; rs != &#39;loaded&#39;)) return;\n\n                    ind_init = true;\n                    Indicative.initialize(apiKey);\n                    Indicative.buildEvent(&#39;Page View&#39;);\n                };\n\n                var s = document.getElementsByTagName(&#39;script&#39;)[0];\n                s.parentNode.insertBefore(ind, s);\n        })(&quot;YOUR_API_KEY_GOES_HERE&quot;);\n&lt;/script&gt;</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></pre></div>\n<p>This script tag asynchronously loads Indicative.js from our CDN and initializes the JavaScript code with your unique API key. You will need to set your API key in quotes where it says “YOUR_API_KEY_GOES_HERE”. You can find a list of all of your projects and appropriate API keys <a href=\"https://app.indicative.com/#/settings/organization/projects\">here</a>.</p>\n<p>To choose between your site’s <head> or <body> tags, note the pros and cons of each. The <head> tag will allow you to access the Analytics object earlier (on load), however your site will not load until everything in the <head> tag is loaded. So, if you do not need the Analytics object immediately, we recommend putting this snippet in the <body> tag.</p>\n<p>If you would like a version of the script that does not ask require.js, please reach out to <a href=\"mailto:support@mparticle.com\">support@mparticle.com</a>. </p>\n<h3 id=\"example-module-for-requirejs-enabled-sites\" style=\"position:relative;\"><a href=\"#example-module-for-requirejs-enabled-sites\" aria-label=\"example module for requirejs enabled sites permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Example Module for Require.js Enabled Sites</h3>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">requirejs.config({    paths: {        Indicative: &#39;//cdn.indicative.com/js/1.0.2/Indicative.min&#39;,    }});define([&#39;Indicative&#39;], function (Indicative) {    Indicative.initialize(&#39;5b440efe-603a-494d-8c89-4c55a4d489f6&#39;);    Indicative.buildEvent(&#39;Page View&#39;);});</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<h2 id=\"building-and-sending-an-event\" style=\"position:relative;\"><a href=\"#building-and-sending-an-event\" aria-label=\"building and sending an event permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Building and Sending an Event</h2>\n<p>Recording an event is easy and customizable. It can be as simple as:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.buildEvent(&#39;event-name&#39;);</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<p>The above line will build and send an event named ‘event-name’ with a unique ID set as a random UUID.</p>\n<p>You can also add your own user IDs and important properties to every event to further enrich your data for more impactful analyses like in the example below.</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.buildEvent(&#39;Purchase&#39;, &#39;unique-user-id&#39;, {    billing_status: &#39;Premium&#39;,     payment_plan: &#39;Annual&#39;});</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<p>Some properties may be stored as a persistent cookie, so that every page can share some common properties or unique ID instead of explicitly passing them every time you build an event. Additionally, Indicative automatically tracks some properties by default; learn more. </p>\n<h2 id=\"validating-integration\" style=\"position:relative;\"><a href=\"#validating-integration\" aria-label=\"validating integration permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Validating Integration</h2>\n<p>Open up the <a href=\"https://app.indicative.com/#/data/console\">Debug Console in Analytics</a> to view all incoming events. You should expect to see your data in Analytics</p>\n<h2 id=\"additional-information\" style=\"position:relative;\"><a href=\"#additional-information\" aria-label=\"additional information permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Additional Information</h2>\n<p>For advanced JavaScript settings, please refer to our documentation.</p>\n<p>For a full list of our Analytics Object API, please click here.</p>\n<h2 id=\"advanced-settings\" style=\"position:relative;\"><a href=\"#advanced-settings\" aria-label=\"advanced settings permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Advanced Settings</h2>\n<h3 id=\"callbacks\" style=\"position:relative;\"><a href=\"#callbacks\" aria-label=\"callbacks permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Callbacks</h3>\n<p>Indicative also allows callbacks, which will be fired after a successful or unsuccessful stat post. You can include a callback function in any of the buildEvent methods, like so:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">var callbackFn = function () {\n        console.info(&quot;callback!&quot;);\n};\n\nIndicative.buildEvent(&#39;event-name&#39;, callbackFn);\nIndicative.buildEvent(&#39;event-name&#39;, &#39;unique-user-id&#39;, callbackFn);\nIndicative.buildEvent(&#39;event-name&#39;, &#39;unique-user-id&#39;, {propertyName: &#39;propertyValue&#39;}, callbackFn);\nIndicative.buildEvent(&#39;event-name&#39;, {propertyName: &#39;propertyValue&#39;}, callbackFn);</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></pre></div>\n<p>With so many different ways to build an event, you’ll have a lot of flexibility to build and send any custom events you need. For further references, refer to the Analytics object API table below.</p>\n<h3 id=\"stateful-variables\" style=\"position:relative;\"><a href=\"#stateful-variables\" aria-label=\"stateful variables permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Stateful Variables</h3>\n<p>We allow you to set stateful variables across every page. Stateful variables are stored as a persistent cookie, so every page will be able to share the same common properties and a uniqueID for the user triggering events on your site. Anywhere in your JavaScript, after Analytics was initialized, call:</p>\n<p><code class=\"language-text\">Indicative.setUniqueID(&quot;unique-user-id&quot;);</code></p>\n<p>This will allow you to log events without having to refer to a unique ID every time you build an event. Analytics also allows for stateful properties, as well, which can be added with the following calls:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.addProperty(&#39;propertyName&#39;, &#39;propertyValue&#39;);\nIndicative.addProperties({propertyName: &#39;propertyValue&#39;, propertyName2: &#39;propertyValue2&#39;});\nIndicative.addProperties([{propertyName: &#39;propertyValue&#39;}, {propertyName2: &#39;propertyValue2&#39;}]);</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span><span></span><span></span></span></pre></div>\n<p>These properties will be appended to subsequent event calls. They will not override the properties passed into a buildEvent call, rather append to the list of properties. If a common property isn’t applicable anymore, call:</p>\n<p><code class=\"language-text\">Indicative.removeProperty(&#39;propertyName&#39;);</code></p>\n<p>This will remove a single property. It’s just as easy to clear the entire common properties list:</p>\n<p><code class=\"language-text\">Indicative.clearProperty();</code></p>\n<h3 id=\"how-to-track-links\" style=\"position:relative;\"><a href=\"#how-to-track-links\" aria-label=\"how to track links permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>How to Track Links</h3>\n<p>Tracking href link clicks can be challenging, because once the page changes we lose our chance to fire an event. To solve this problem, we’ve added a callback to our build object. Use the following function to track link clicks and then send the user to the linked page:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">function linkClick (event, linkName) {\n        var url = event.target.getAttribute(&#39;href&#39;);\n        console.info(event);\n        event.preventDefault();\n\n        Indicative.buildEvent(&quot;Link Click&quot;, {Link_Name: linkName}, function () {\n            console.info(&quot;go to site&quot;);\n            if (url) {\n                window.location = url;\n            }\n        });\n}</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></pre></div>\n<p>To call this function in your HTML, set up a link like so: </p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">&lt;a onclick=&quot;linkClick(event, &#39;home&#39;)&quot; href=&quot;home.html&quot;&gt;Home&lt;/a&gt;</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<h3 id=\"how-to-track-web-sessions\" style=\"position:relative;\"><a href=\"#how-to-track-web-sessions\" aria-label=\"how to track web sessions permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>How to Track Web Sessions</h3>\n<p>We’ve implemented Web Sessions in our JavaScript SDK track users’ web sessions with just a slight change to one line of your code. If a user has no activity for 30 minutes (no events are fired locally), upon any new event activity, the JavaScript SDK will also fire a “Web Session” event to indicate the start of a new Web Session.</p>\n<p>Note: The window of inactivity is customizable, but defaults to 30 minutes, with industry standards.</p>\n<h3 id=\"how-to-integrate\" style=\"position:relative;\"><a href=\"#how-to-integrate\" aria-label=\"how to integrate permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>How to Integrate</h3>\n<p>Where you see the line in this snippet:</p>\n<p><code class=\"language-text\">Indicative.initialize(apiKey);</code></p>\n<p>Alter it to read:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.initialize(apiKey, {recordSessions: true});</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<p>If you want to alter the inactive session length, change the line to be this instead:</p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.initialize(apiKey, {recordSessions: true, sessionsThreshold: 5});</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<p>where 5 signifies 5 minutes.</p>\n<h3 id=\"automatic-tracking\" style=\"position:relative;\"><a href=\"#automatic-tracking\" aria-label=\"automatic tracking permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Automatic Tracking</h3>\n<p>We automatically track the following properties:</p>\n<ul>\n<li>browser: browser</li>\n<li>operating system: browser_os</li>\n<li>device: browser_device</li>\n<li>referrer: browser_referrer</li>\n<li>language: browser_language</li>\n<li>page title: page_title</li>\n<li>url: page_url</li>\n</ul>\n<p>We also automatically track marketing channels provided by UTM search parameters. You’ll be able to see the following properties if you have users loading your page with UTM properties in the URL: campaign_source,campaign_medium, campaign_term, campaign_content, and campaign_name. We will also provide these channel properties in their own section of the data panel, titled as User Properties - UTM (category).</p>\n<h3 id=\"how-to-track-users-across-subdomains\" style=\"position:relative;\"><a href=\"#how-to-track-users-across-subdomains\" aria-label=\"how to track users across subdomains permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>How to Track Users Across Subdomains</h3>\n<p>We support tracking user sessions across various subdomains through the use of our SDK. If the option ‘cookiesOnMainDomain’ is set to true, it will store the cookie on the root domain.</p>\n<p>Where you see this line in the snippet: </p>\n<p><code class=\"language-text\">Indicative.initialize(apiKey);</code></p>\n<p>Alter it to read: </p>\n<div class=\"gatsby-highlight\" data-language=\"text\"><pre style=\"counter-reset: linenumber NaN\" class=\"language-text line-numbers\"><code class=\"language-text\">Indicative.initialize(apiKey, {recordSessions: true, sessionsThreshold: 30, cookiesOnMainDomain: true });</code><span aria-hidden=\"true\" class=\"line-numbers-rows\" style=\"white-space: normal; width: auto; left: 0;\"><span></span></span></pre></div>\n<p>Whenever the cookiesOnMainDomain option is set to true, it is recommended that you include the base domain name. If it is not set, our SDK will attempt to figure it out by taking the last two tokens of the domain name, and in some cases it may be invalid values (e.g. .com.mx).</p>\n<p>To explicitly add the domain name, add the domainName to the initialization parameters. </p>\n<p>Indicative.initialize(apiKey, {recordSessions: true, sessionsThreshold: 30, cookiesOnMainDomain: true, domainName: ‘example.com.mx’ })</p>\n<p>Warning: Changing or enabling this option <em>may</em> break existing cookie tracking.</p>\n<h3 id=\"aliasing\" style=\"position:relative;\"><a href=\"#aliasing\" aria-label=\"aliasing permalink\" class=\"anchor before\"><svg width=\"16px\" height=\"17px\" viewBox=\"0 0 16 17\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                <g id=\"Symbols\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                    <g id=\"Icon/Link\" fill=\"#98A0A3\" fill-rule=\"nonzero\">\n                        <g id=\"link\">\n                            <path d=\"M9.5,12.4 C9.6,12.4 9.7,12.4 9.9,12.4 C9.8,12.5 9.8,12.5 9.7,12.6 L7.5,14.8 C5.8,16.5 3,16.5 1.3,14.8 C-0.4,13.1 -0.4,10.3 1.3,8.6 L3.5,6.4 C3.6,6.3 3.6,6.3 3.7,6.2 C5,5 6.9,4.8 8.4,5.5 C8.8,5.7 9.3,6 9.6,6.4 C10,6.7 10.2,7.2 10.5,7.6 C10.2,7.9 9.9,8 9.5,8 C9.4,8 9.2,8 9.1,7.9 C8.9,7.5 8.5,7.2 8.1,6.9 C7,6.2 5.5,6.4 4.5,7.3 L3.8,8 L2.3,9.5 C1.2,10.6 1.2,12.5 2.3,13.6 C3.4,14.7 5.3,14.7 6.4,13.6 L7.9,12.1 C8.4,12.3 8.9,12.4 9.5,12.4 Z M14.7,1.3 C13,-0.4 10.2,-0.4 8.5,1.3 L6.3,3.5 C6.2,3.6 6.2,3.6 6.1,3.7 C6.7,3.7 7.4,3.7 8,3.9 L9.5,2.4 C10.6,1.3 12.5,1.3 13.6,2.4 C14.7,3.5 14.7,5.4 13.6,6.5 L12.1,8 L11.4,8.7 C10.4,9.7 8.9,9.8 7.8,9.1 C7.4,8.9 7.1,8.5 6.8,8.1 C6.7,8.1 6.5,8 6.4,8 C6,8 5.6,8.2 5.4,8.4 C5.6,8.8 5.9,9.3 6.3,9.6 C6.6,10 7.1,10.2 7.5,10.5 C9,11.2 10.9,11 12.3,9.8 C12.4,9.7 12.4,9.7 12.5,9.6 L14.7,7.4 C16.4,5.7 16.4,3 14.7,1.3 Z\" id=\"Shape\"></path>\n                        </g>\n                    </g>\n                </g>\n            </svg></a>Aliasing</h3>\n<p>Analytics supports aliasing between anonymous IDs and user IDs to allow customers to unify event streams submitted with separate unique keys. <a href=\"/guides/analytics/analytics-deprecated/developer-docs/developer-basics/aliasing/\">Click here</a> for a full walkthrough of Analytics’ aliasing protocol.</p>","frontmatter":{"title":"JavaScript","order":6.5,"seoTitle":null,"seoDescription":null},"parent":{"__typename":"File","modifiedTime":"October 12, 2026"}}},"pageContext":{"slug":"/guides/analytics/analytics-deprecated/developer-docs/sdks/javascript/"}},"staticQueryHashes":["2950460867"]}