Installation

Add the Boxy tracking script to your website. It takes less than a minute.

Script Tag

Add the following snippet to the <head> section of your website. Replace YOUR_SITE_ID with the site ID from your dashboard.

<script defer src="https://useboxy.dev/tracker.js" data-site="YOUR_SITE_ID"></script>

Tip: The script is under 1KB and loads asynchronously with defer, so it won't affect your page load speed.

Plain HTML

For static HTML sites, add the script tag before the closing </head> tag:

<!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
  <script defer src="https://useboxy.dev/tracker.js" data-site="YOUR_SITE_ID"></script>
</head>
<body>
  <!-- Your content -->
</body>
</html>

Next.js

With the App Router, add the script to your root layout:

// app/layout.tsx
import Script from "next/script";

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          defer
          src="https://useboxy.dev/tracker.js"
          data-site="YOUR_SITE_ID"
        />
      </body>
    </html>
  );
}

Single-Page Apps

Boxy automatically detects client-side navigation via the History API. No extra configuration is needed for React Router, Vue Router, or similar frameworks. Just add the script tag and page views will be tracked on every route change.

Verify Installation

After adding the script, visit your site and check the Boxy dashboard. You should see your first pageview appear within a few seconds.

Not seeing data? Make sure the data-site attribute matches your site ID exactly. Check the browser console for any errors.