Skip to main content

Automatic Page Enrichment

The browser SDK automatically enriches page events with contextual information:
  • Page URL and referrer
  • Page title
  • User agent
  • Screen dimensions
  • Locale and timezone
  • Campaign parameters (UTM tags)

Loading State

// Wait for analytics to be ready
analytics.ready(() => {
  console.log('Analytics is ready!')
  // Perform actions that depend on analytics
})

Plugin System

Extend the SDK with custom plugins:
const customPlugin = {
  name: 'Custom Plugin',
  type: 'enrichment',
  version: '1.0.0',

  isLoaded: () => true,
  load: async (ctx, analytics) => {
    console.log('Plugin loaded')
  },

  track: async (ctx) => {
    // Modify or enrich track events
    ctx.event.properties = {
      ...ctx.event.properties,
      custom_property: 'value'
    }
    return ctx
  }
}

analytics.register(customPlugin)

CDN Usage

Load the SDK directly from CDN:
<!DOCTYPE html>
<html>
<head>
  <script>
    !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Zixflow snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.src="https://cdn.zixflow.com/analytics.js/v1/"+key+"/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._loadOptions=e};analytics._writeKey="YOUR_API_KEY";analytics.SNIPPET_VERSION="4.15.3";
    analytics.load("YOUR_API_KEY");
    analytics.page();
    }}();
  </script>
</head>
<body>
  <h1>My Website</h1>
</body>
</html>