@kntnt/engagement-metrics-gtag

Google Analytics 4 (gtag.js) add-on for @kntnt/engagement-metrics. Sends reading and scanning progress events to GA4 at configurable thresholds.

Installation

npm install @kntnt/engagement-metrics @kntnt/engagement-metrics-gtag

Usage

ESM (bundler)

import { createMeasurer } from '@kntnt/engagement-metrics'
import { registerGtag } from '@kntnt/engagement-metrics-gtag'

const measurer = createMeasurer({ selector: 'article p' })
registerGtag(measurer, {
  readingThresholds: [10, 25, 50, 75, 90, 100],
  scanningThresholds: [25, 50, 75, 100],
})
measurer.start()

IIFE (script tag)

<script src="https://unpkg.com/@kntnt/engagement-metrics/dist/kntnt-engagement-metrics.min.js"></script>
<script src="https://unpkg.com/@kntnt/engagement-metrics-gtag/dist/kntnt-engagement-metrics-gtag.min.js"></script>
<script>
  KntntEngagementMetrics.measurer = KntntEngagementMetrics.start({ selector: 'article p' })
  KntntEngagementMetrics.gtag.register()
</script>

Documentation

See the main repository for full documentation, including how to register custom dimensions in GA4 and view engagement data in your reports.

License

MIT — Copyright (c) 2026 Kntnt Sweden AB