HTML / CDN

Add Produl to any site with a single script tag. No build step, no dependencies.

Script tag

Paste this snippet before </body> on every page, replacing SITE_ID with the ID from your dashboard. The defer attribute means the script loads after the page without blocking rendering.

html

<script defer data-site="SITE_ID"
  src="https://app.produl.tech/tracker.min.js"></script>

Data attributes

All tracker options can be set as data-* attributes on the script tag. No JavaScript configuration is needed.

Attribute	Required	Description
`data-site`	Yes	Your site ID from the dashboard.
`data-disableAutoTrack="1"`	No	Disable automatic pageview tracking. Send pageviews manually via `window.ma`.
`data-endpoint`	No	Override the collection endpoint base URL. Defaults to the script's own origin (sending to `/api/collect`, `/api/ping`, `/api/vitals`).
`data-debug="1"`	No	Show a debug overlay listing every tracked event.

html

<!-- debug mode + custom endpoint -->
<script defer
  data-site="SITE_ID"
  data-endpoint="/analytics/collect"
  data-debug="1"
  src="https://app.produl.tech/tracker.min.js"></script>

Custom events

The tracker exposes a window.ma command queue for sending custom events. You can call it before the script has finished loading — any commands queued early are replayed once the tracker initializes.

html

<script>
  window.ma = window.ma || []

  // Track a custom event with optional properties
  window.ma.push(['track', 'signup', { plan: 'pro' }])
</script>

<script defer data-site="SITE_ID"
  src="https://app.produl.tech/tracker.min.js"></script>

Queue safety

Initializing window.ma = window.ma || [] before the script tag ensures calls made during page load are not lost. The tracker drains the queue on startup.

Remix

NPM package