Script tag

<script>
  !function(w,d,src,key,auto){
    if(w.outlit&&w.outlit._loaded)return;
    var o=w.outlit=w.outlit||{_q:[]};
    function stub(target,prefix,methods){
      for(var i=0;i<methods.length;i++){
        var m=methods[i];
        target[m]=target[m]||function(mm){
          return function(){o._q.push([prefix?prefix+"."+mm:mm,[].slice.call(arguments)])};
        }(m);
      }
    }
    stub(o,"",["init","track","identify","enableTracking","disableTracking","isTrackingEnabled","getVisitorId","setUser","clearUser"]);
    o.user=o.user||{};
    stub(o.user,"user",["identify"]);
    var s=d.createElement("script");s.async=1;s.src=src;
    s.dataset.publicKey=key;if(auto!==undefined)s.dataset.autoTrack=auto;
    (d.body||d.head).appendChild(s);
  }(window,document,"https://cdn.outlit.ai/stable/outlit.js","pk_your_public_key");
</script>

<script
  src="https://cdn.outlit.ai/stable/outlit.js"
  data-public-key="pk_your_public_key"
  async
></script>

<script>
  !function(w,d,src,key,auto){
    if(w.outlit&&w.outlit._loaded)return;
    var o=w.outlit=w.outlit||{_q:[]};
    function stub(target,prefix,methods){
      for(var i=0;i<methods.length;i++){
        var m=methods[i];
        target[m]=target[m]||function(mm){
          return function(){o._q.push([prefix?prefix+"."+mm:mm,[].slice.call(arguments)])};
        }(m);
      }
    }
    stub(o,"",["init","track","identify","enableTracking","disableTracking","isTrackingEnabled","getVisitorId","setUser","clearUser"]);
    o.user=o.user||{};
    stub(o.user,"user",["identify"]);
    var s=d.createElement("script");s.async=1;s.src=src;
    s.dataset.publicKey=key;if(auto!==undefined)s.dataset.autoTrack=auto;
    (d.body||d.head).appendChild(s);
  }(window,document,"https://cdn.outlit.ai/stable/outlit.js","pk_your_public_key",false);
</script>

<script>
  // Called by your consent management tool when user accepts
  function onConsentAccepted() {
    window.outlit.enableTracking()
  }
</script>

<script
  src="https://cdn.outlit.ai/stable/outlit.js"
  data-public-key="pk_your_public_key"
  data-auto-track="false"
  async
></script>

// Check if tracking is currently enabled
if (window.outlit.isTrackingEnabled()) {
  console.log('Tracking is active')
}

window.outlit.track('button_clicked', {
  buttonId: 'cta-hero',
  page: '/pricing'
})

window.outlit.track('video_played', {
  videoId: 'demo-video',
  duration: 120
})

window.outlit.identify({
  email: 'jane@example.com',
  userId: 'usr_12345', // optional
  traits: {
    name: 'Jane Doe',
    company: 'Acme Inc',
    plan: 'enterprise'
  }
})

// After user logs in
window.outlit.setUser({
  email: 'jane@example.com',
  userId: 'usr_12345',
  traits: {
    name: 'Jane Doe',
    plan: 'pro'
  }
})

window.outlit.clearUser()

// After user completes onboarding
window.outlit.track('onboarding_completed', { flow: 'onboarding' })

const visitorId = window.outlit.getVisitorId()
// Returns: "a1b2c3d4-e5f6-7890-abcd-ef1234567890"

<script>
  !function(w,d,src,key,auto){
    if(w.outlit&&w.outlit._loaded)return;
    var o=w.outlit=w.outlit||{_q:[]};
    function stub(target,prefix,methods){
      for(var i=0;i<methods.length;i++){
        var m=methods[i];
        target[m]=target[m]||function(mm){
          return function(){o._q.push([prefix?prefix+"."+mm:mm,[].slice.call(arguments)])};
        }(m);
      }
    }
    stub(o,"",["init","track","identify","enableTracking","disableTracking","isTrackingEnabled","getVisitorId","setUser","clearUser"]);
    o.user=o.user||{};
    stub(o.user,"user",["identify"]);
    var s=d.createElement("script");s.async=1;s.src=src;
    s.dataset.publicKey=key;if(auto!==undefined)s.dataset.autoTrack=auto;
    (d.body||d.head).appendChild(s);
  }(window,document,"https://cdn.outlit.ai/stable/outlit.js","pk_your_public_key");
</script>

<!-- This works immediately, even before the SDK loads -->
<script>
  window.outlit.track('early_event', { page: 'landing' });
</script>

<!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
</head>
<body>
  <h1>Welcome</h1>
  
  <form id="contact-form">
    <input name="email" type="email" placeholder="Email" />
    <input name="name" type="text" placeholder="Name" />
    <button type="submit">Contact Us</button>
  </form>

  <button id="cta" onclick="handleCTA()">Get Started</button>

  <script>
    function handleCTA() {
      window.outlit.track('cta_clicked', {
        location: 'hero',
        page: window.location.pathname
      });
    }

    // Identify after form submission
    document.getElementById('contact-form').addEventListener('submit', function(e) {
      const email = e.target.querySelector('[name="email"]').value;
      const name = e.target.querySelector('[name="name"]').value;
      
      window.outlit.identify({
        email: email,
        traits: { name: name }
      });
    });
  </script>

  <script>
    !function(w,d,src,key,auto){
      if(w.outlit&&w.outlit._loaded)return;
      var o=w.outlit=w.outlit||{_q:[]};
      function stub(target,prefix,methods){
        for(var i=0;i<methods.length;i++){
          var m=methods[i];
          target[m]=target[m]||function(mm){
            return function(){o._q.push([prefix?prefix+"."+mm:mm,[].slice.call(arguments)])};
          }(m);
        }
      }
      stub(o,"",["init","track","identify","enableTracking","disableTracking","isTrackingEnabled","getVisitorId","setUser","clearUser"]);
      o.user=o.user||{};
      stub(o.user,"user",["identify"]);
      var s=d.createElement("script");s.async=1;s.src=src;
      s.dataset.publicKey=key;if(auto!==undefined)s.dataset.autoTrack=auto;
      (d.body||d.head).appendChild(s);
    }(window,document,"https://cdn.outlit.ai/stable/outlit.js","pk_your_public_key");
  </script>
</body>
</html>