Adding Sumatra to your site
1. Add the Optimize snippet
Copy-paste this snippet inside the <head>
tag of your site. For best performance:
- Add the snippet above anything else in the
<head>
tag - Don't use Google Tag Manager for the installation. Add the snippet directly to the
<head>
tag in your sites HTML.
<!-- Sumatra Optimize SDK snippet (loads Sumatra and sends events to the API) -->
<script type="text/javascript">
!function(){var sumatra=window.sumatra=window.sumatra||[];sumatra.methods=["load","track","enrich","ready","personalize","registerAnalyticsSource"],sumatra.factory=function(t){return function(){sumatra.push([t].concat(Array.prototype.slice.call(arguments)))}};for(var t=0;t<sumatra.methods.length;t++){var r=sumatra.methods[t];sumatra[r]=sumatra.factory(r)}sumatra.loadJS=function(e,t){var r=document.createElement("script");r.type="text/javascript",r.async=!0,r.src="https://cdn.sumatra.ai/v1/sumatra-sdk.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(r,a)},sumatra.loadJS(),
sumatra.load("SUMATRA_API_KEY", "https://api.sumatra.ai")
sumatra.enrich('page');
}();
</script>
<!-- Sumatra Optimize SDK snippet end -->
<!-- Sumatra Optimize script (loads the overrides from the WYSIWYG) -->
<script type="text/javascript" src="https://optimizations.sumatra.ai/SUMATRA_TENANT_ID"></script>
<!-- Sumatra Optimize script end -->
Important
Replace SUMATRA_API_KEY
with your private API key and replace SUMATRA_TENANT_ID
with your workspace ID.
2. Recommended: Add the anti-flicker snippet
For most use cases, it is recommended to add the anti-flicker snippet. Copy-paste it in the <head>
section directly above the Optimize snippet.
<!-- Anti-flicker snippet -->
<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','sumatraOptimize',2000,
{});</script>
<!-- Anti-flicker snippet end -->
Multiple domains or subdomains
If your site uses multiple domains or subdomains, add the snippets above to each one. Visitors will be identified across subdomains with a first-party cookie.
Single-page Applications (SPA)
Single-page applications are fully compatible with Sumatra. Contact support for help getting started.