Quickstart Guide

Get Narrowbeam up and running on your website in less than 30 seconds.

Prerequisites

You'll need a Narrowbeam account. Sign up for free if you haven't already.

Step 1: Get Your Organization Key

First, you need to get your organization key from your Narrowbeam dashboard:

  1. Go to your Narrowbeam dashboard
  2. Navigate to the Installation page
  3. Copy your organization key - it looks like 11fb6556-c018-4432-accf-bedf89aa345f

Step 2: Add the Script

Add this script to the <head> section of your website, replacing YOUR_ORG_KEY with your actual organization key:

<script>
  (function(w,d,e,s,n) {
    w=w[n]=w[n]||{q:[],onReady:function(c){w.q.push(c)}}
    e=d.createElement(e);e.async=1;e.src=s
    s=d.getElementsByTagName('script')[0];s.parentNode.insertBefore(e,s)
  })(window,document,'script','https://unpkg.com/@narrowbeam/browser/dist/narrowbeam.min.js','narrowbeam')

  window.narrowbeam.onReady(function() {
    window.narrowbeam.init({
      orgKey: 'YOUR_ORG_KEY'
    })
  })
</script>

Using a framework?

For React, Vue, Next.js, or Nuxt, you can use the @narrowbeam/browser npm package. See framework-specific guides below.

Step 3: Verify Installation

That's it! Your website is now tracking analytics. To verify everything is working:

  1. Visit your website in a browser
  2. Open your browser's developer console (F12)
  3. Look for a message like: Narrowbeam: Page view tracked
  4. Go back to your dashboard and refresh - you should see data appearing within seconds

Framework-Specific Instructions

If you're using a specific framework, check out these guides for the best way to integrate Narrowbeam:

What Gets Tracked Automatically?

Once installed, Narrowbeam automatically tracks:

  • Page views - Every time a page loads
  • SPA navigation - Client-side route changes in single-page apps
  • Referrer information - Where visitors came from
  • UTM parameters - Campaign tracking parameters
  • Page metadata - URL, path, device, browser, location

Next Steps