Web Setup

Install the Hardal tracker script on your website to collect page views through your first-party URL.

Before you install

Set up your first-party URL and wait for its DNS record to resolve. The tracker script and its collection requests should both use that URL.

Then open Setup in the Dashboard. Copy the generated snippet so the first-party URL, Tenant ID, and Source ID match your account.

Install the script

Put the script before the closing </body> tag:

<script
  async
  src="https://analytics.yourdomain.com/tracker.js"
  data-host-url="https://analytics.yourdomain.com"
  data-tenant-id="your-tenant-id"
  data-source-id="your-source-id"
  data-auto-track="true"
  data-spa="true">
</script>

Add the tracker once in your root layout:

import Script from "next/script";

const VIRGO_URL = "https://analytics.yourdomain.com";
const VIRGO_TRACKER_SRC = VIRGO_URL + "/tracker.js";
const VIRGO_TENANT_ID = "your-tenant-id";
const VIRGO_SOURCE_ID = "your-source-id";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          id="virgo-tracker"
          strategy="afterInteractive"
          src={VIRGO_TRACKER_SRC}
          data-host-url={VIRGO_URL}
          data-tenant-id={VIRGO_TENANT_ID}
          data-source-id={VIRGO_SOURCE_ID}
          data-auto-track="true"
          data-spa="true"
        />
      </body>
    </html>
  );
}

Use the exact generated values from the Dashboard. Do not copy the placeholder IDs or domain from this page.

Script attributes

Attribute	What it does
`src`	The tracker script, served from your first-party URL.
`data-host-url`	Your first-party collection URL. Events are sent here.
`data-tenant-id`	The Tenant ID shown for this installation in Setup.
`data-source-id`	The Source ID shown for this installation in Setup.
`data-auto-track`	Controls the initial page view. It defaults to `true`; set it to `false` to disable automatic tracking.
`data-spa`	Controls History API and hash route tracking. It defaults to `true`; set it to `false` to disable it.

Privacy by default

The base tracker can collect anonymous first-party analytics without attaching a known user identity. Your consent and disclosure requirements still depend on your implementation, destinations, and applicable law.

When a visitor grants consent, send the consent state so Hardal can link activity according to your configuration.

Consent Signals

How to send a granted or denied signal, and what each one changes.

What gets tracked automatically

With data-auto-track="true", the script sends page_view when the page first loads.

With data-spa="true", it also sends page_view after client-side route changes, including history and hash changes. It skips duplicate page views for the same URL.

Do not assume scrolls, outbound clicks, form submissions, or purchases are collected automatically.

Send a page view manually

If you disable automatic page views or manage route changes yourself, use the tracker’s page-view helper:

virgo.pageview();

Pass a URL and optional page data when the tracked URL differs from the current browser location:

virgo.pageview("https://www.yourdomain.com/pricing", {
  route_name: "pricing"
});

The helper skips a duplicate page view for the same URL.

Send additional events

Send purchases, leads, and other business events explicitly. For events confirmed on your server, use the API & Server-side setup. Use the event guides below to choose consistent names and parameters.

Standard Events

Use consistent names and parameters for commerce and lead events.

Custom Events

Define an event name and fields for interactions specific to your product.

Content Security Policy

If your site uses Content Security Policy, allow the first-party URL for both the script and collection requests:

script-src 'self' https://analytics.yourdomain.com;
connect-src 'self' https://analytics.yourdomain.com;

Verify it works

Open your site and check the browser Network panel:

tracker.js loads from your first-party URL.
On a normal page load, the tracker sends a POST request to /collect/. The endpoint returns 202.
The request uses text/plain, which avoids a JSON preflight.
The body contains tenantId, an anonymousSessionId, and an events array. The automatic page view has type: "page_view" and eventName: "page_view".
The event payload uses the Source ID shown in Setup.

Then open Sources in the Dashboard. A source with recent events confirms that data is reaching Hardal.

Verify Your Setup

Use the Onboarding page to review source installation and first-data verification.

Was this page helpful?