Web Tracker

Add analytics to any website with a lightweight JavaScript tracker.

Installation

Add the tracking script to your website. Choose your framework for specific instructions.

index.html

<script
  defer
  src="https://cdn.himetrica.com/tracker.js"
  data-api-key="YOUR_API_KEY"
></script>

Add this script to the <head> or before the closing </body> tag.

Install with AI

Copy this prompt and paste it into ChatGPT, Claude, or any AI assistant to install the tracker for you.

Install Himetrica analytics on my website. Himetrica is a client-side analytics tracker — it must run in the browser (frontend only), not on the server.

1. Add this script tag to the <head> or before </body> on every page:
<script defer src="https://cdn.himetrica.com/tracker.js" data-api-key="YOUR_API_KEY"></script>

2. Optionally add Web Vitals monitoring:
<script defer src="https://cdn.himetrica.com/vitals.js" data-api-key="YOUR_API_KEY"></script>

3. Optionally add Error tracking:
<script defer src="https://cdn.himetrica.com/errors.js" data-api-key="YOUR_API_KEY"></script>

4. To track custom events, call from client-side JavaScript:
window.himetrica.track('event_name', { key: 'value' })

5. To identify users after login, call from client-side JavaScript:
window.himetrica.identify({ name: 'User Name', email: '[email protected]' })

Both track() and identify() are available globally on window.himetrica after the script loads. All code must run in the browser — do not add these to any server-side or backend code.

Custom Events

Use the global himetrica object to track custom events with properties.

javascript

// Script tag: use the global himetrica object
window.himetrica.track('button_clicked', {
  button_name: 'signup',
  location: 'header'
});

// NPM package: use the client instance
himetrica.track('purchase_completed', {
  product_id: 'pro_plan',
  price: 9.99,
  currency: 'USD'
});

// React hooks
const trackEvent = useTrackEvent()
trackEvent('button_clicked', { button_name: 'signup' })

Event Properties

Properties can be strings, numbers, or booleans
Keep property names consistent across events
Avoid sending sensitive information (passwords, tokens)

User Identification

Call identify after a user logs in to associate their activity.

javascript

// Script tag
window.himetrica.identify({
  name: 'John Doe',
  email: '[email protected]',
  plan: 'pro',
  signup_date: '2024-01-15'
});

// NPM package
himetrica.identify({
  name: 'John Doe',
  email: '[email protected]',
});

Privacy Note

Only identify users who have consented to tracking. Avoid sending PII unless necessary.

Page Views

The tracker automatically detects page navigation in SPAs. For custom tracking:

javascript

// The tracker automatically tracks page views, but you can
// manually track them with additional properties
himetrica.pageview({
  title: 'Custom Page Title',
  path: '/custom-path',
  referrer: 'https://google.com'
});

API Reference

Method	Description
track(name, props?)	Track a custom event with optional properties
identify(user)	Associate analytics with a user profile
trackPageView(path?)	Manually track a page view
getVisitorId()	Get the current visitor's ID
flush()	Send any pending page view and duration data
destroy()	Clean up the tracker instance (NPM only)

Issue Tracking

Also see

Web Vitals