Automatic extensions

The takt.auto.js bundle tracks four common behaviours with zero code: outbound clicks, file downloads, 404 errors and events declared in HTML. You enable only what you need through the data-auto attribute.

Installation

Swap takt.js for takt.auto.js and list the extensions you want in data-auto:

<script defer
  src="https://cdn.jsdelivr.net/npm/@vskstudio/takt-core/dist/takt.auto.js"
  data-domain="example.com"
  data-auto="outbound,downloads,tagged,404"></script>

Without data-auto, takt.auto.js behaves exactly like takt.js: a single pageview, nothing more. Every extension is opt-in. If you only want pageviews, keep takt.js (< 1 KB).

The four extensions

`data-auto` value	Event sent	Property
`outbound`	`Outbound Link: Click`	`url` (absolute href)
`downloads`	`File Download`	`url` (absolute href)
`404`	`404`	`path` (page path)
`tagged`	custom (see below)	via `data-takt-prop-*`

Outbound clicks & downloads

Every click on an <a href> link is inspected: a link to another domain emits Outbound Link: Click, a link pointing to a known file type emits File Download. Middle-click / new-tab clicks are covered, and delivery is guaranteed even when navigation leaves the page.

Default extension list: pdf, xlsx, docx, pptx, csv, zip, gz, rar, 7z, dmg, exe, apk, mp3, mp4, wav, mov, avi, mkv, txt. Override it with data-downloads-ext:

<script defer src="…/takt.auto.js" data-domain="example.com"
  data-auto="downloads" data-downloads-ext="pdf,csv,epub"></script>

Tagged events (events in HTML)

Add data-takt-event to any clickable element to send a named event, with no JavaScript. data-takt-prop-<key> attributes become properties.

<button data-takt-event="Cta" data-takt-prop-zone="hero">
  Get started
</button>

The reserved name pageview is rejected, just like with window.takt(...).

data-takt-prop-* values are sent as-is. Never put personal data in them (email, user id, name): keep them to non-identifying labels (zone, variant, category).

404 errors

Detection happens on page load, in a hybrid way:

Real HTTP status via the Navigation Timing API (recent Chrome/Edge) — zero config on a genuine 404 page.
Marker fallback, for Firefox/Safari and error pages served as HTTP 200 (rendered server-side): add data-takt-404 on the <body> or a <meta name="takt:404"> tag in the <head> of your error page.

<body data-takt-404>
  …your 404 page…
</body>

The 404 event (property path) is sent only once, on load.

Detection only runs on the initial load. For a SPA whose "not found" page renders after a client-side navigation, emit the event yourself: window.takt('404', { props: { path: location.pathname } }).

Where this data shows up

These are ordinary named events: they appear in event-property breakdowns and can be used as a goal target. No extra dashboard setup.

What’s next

The script — the base snippet and window.takt.
Events & payload — the exact format sent to ingestion.