@humlabs/embed
v0.4.0
Published
Lightweight embed script for Hum visitor counters (<script> tag install)
Maintainers
Readme
@humlabs/embed
Zero-config visitor tracking via a single <script> tag. No npm install, no bundler required.
Usage
Add the script tag anywhere on your page — the visitor is tracked automatically on load:
<script
src="https://api.humlabs.io/v1.js"
data-site-id="YOUR_SITE_ID"
></script>Optional attributes
| Attribute | Default | Description |
|---|---|---|
| data-site-id | (required) | Your Hum site ID |
| data-api-url | https://api.humlabs.io | Override the API base URL |
| data-template | — | Badge template slug (e.g. minimal-pill) recorded in dashboard analytics |
Badge elements
Add data-hum elements anywhere in your HTML and they update automatically after tracking:
<!-- Unique visitors (lifetime) -->
<span data-hum="YOUR_SITE_ID" data-hum-type="unique"></span> visitors
<!-- Total page views (lifetime) -->
<span data-hum="YOUR_SITE_ID" data-hum-type="views"></span> views
<!-- Currently online -->
<span data-hum="YOUR_SITE_ID" data-hum-type="online"></span> online nowdata-hum-type defaults to "unique" when omitted.
Full example
<!DOCTYPE html>
<html>
<head>
<script
src="https://api.humlabs.io/v1.js"
data-site-id="site_abc123"
data-template="my-page"
></script>
</head>
<body>
<p>
<span data-hum="site_abc123"></span> unique visitors ·
<span data-hum="site_abc123" data-hum-type="online"></span> online now
</p>
</body>
</html>React / npm
If you use React, use @humlabs/react instead — it provides hooks and components that integrate with your component tree.
License
MIT
