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({ userId: 'usr_123', name: 'User Name', email: 'user@email.com' })
The userId parameter is optional but enables cross-device visitor merging — when two visitors identify with the same userId, they are automatically merged into one.
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({
userId: 'usr_123', // optional — stable external user ID
name: 'John Doe',
email: 'john@example.com',
plan: 'pro',
signup_date: '2024-01-15'
});
// NPM package
himetrica.identify({
userId: 'usr_123',
name: 'John Doe',
email: 'john@example.com',
});Parameters
userId— Optional. A stable external user ID for cross-device visitor merging. When two visitors identify with the same userId, they are automatically merged into one.name— Optional. The user's display name.email— Optional. The user's email address.- Any additional key-value pairs are stored as metadata.
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({userId?, name?, email?, ...}) | Associate analytics with a user profile. Pass userId for cross-device merging. |
| 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) |