Install on Framer | TrueStat

Steps

Open your project and go to Site settings.
Open Custom code.
Paste the tag into Start of <head> tag.
Publish.

<script
  defer
  data-website-id="ts_a1b2c3d4e5f6"
  data-domain="example.com"
  src="https://truestat.io/js/t.js"
></script>

Copy it from your site's install page in the app, with your key already substituted.

screenshot coming

The install page with the "Framer" platform tab selected, snippet with real site key. Light theme.

screenshot coming

Framer Site settings → Custom code, with the TrueStat snippet pasted into the "Start of <head> tag" field. Framer's own dark UI.

Publish, then check

Like Webflow, Framer applies custom code to the published site, not to the editor preview. Testing in the canvas or in Framer's preview mode will show nothing. Publish, then load the live URL.

Framer navigations

Framer sites navigate client-side between pages. The script handles that — it records a view on each path change with no extra configuration.

Custom events on Framer elements

Framer does not expose arbitrary HTML attributes on every element, so the attribute route is not always available. The JavaScript route always is. In a code component or an overlay:

window.truestat("signup");

Or with parameters:

window.truestat("initiate_checkout", {
  plan: "growth",
  price: 39,
});

See Tracking custom events for the naming rules — they are enforced, and an event that breaks them is dropped rather than corrected.

Verify

Publish, load the live site, and check the install page in the app. It flips to Connected within seconds.