Consenti

Hotjar & Others

Hotjar has no runtime consent flag to toggle and no dedicated Consenti output format — unlike Adobe, Meta, Clarity, or Segment. It's representative of a whole class of tools this way: Mixpanel, Amplitude, FullStory, Crazy Egg, Mouseflow, LogRocket, Plausible, self-hosted Matomo, and most other analytics/session-replay tools have no runtime consent API of their own either. For all of them, integration comes down to the same two steps: pick the getConsent() call that matches how you modeled the tool in your profile, then gate script loading. This guide uses Hotjar as the worked example.

Which getConsent() call should I use?

There's no getConsent('hotjar')vendor format, so there's no single right answer — it depends on the granularity you want. All three are real, independent calls (see API Methods for the full reference):

1. getConsent('purpose') — the common case

Hotjar cookies (_hjSessionUser_*, _hjSession_*, _hjid) are almost always tagged purpose: 'analytics' like most session-replay/heatmap tools. If you just want the coarse rollup:

typescript
const { analytics } = widget.getConsent('purpose')
// analytics: 'granted' | 'denied' | 'objected'

2. getConsent('category') — match the modal exactly

If Hotjar is bundled into a category alongside other tools and you want consent for exactly what the visitor toggled (not just the fixed taxonomy), read your own category ID instead (see Category type) — 'granted'only when every parameter in that category is granted, not just Hotjar's:

typescript
const categories = widget.getConsent('category')
// { 'cat-analytics': 'denied', 'cat-marketing': 'granted', ... }

if (categories?.['cat-analytics'] === 'granted') {
  // every parameter in that category is granted, not just Hotjar's
}

3. getConsent() / getConsent('default') — a dedicated cookie

If you gave Hotjar its own cookie parameter in the profile, read that one ID directly — no rollup at all:

typescript
const consent = widget.getConsent()
if (consent?.hotjar === 'granted') {
  // load Hotjar
}

This is the read-side counterpart to the dedicated-cookie gating pattern below.

Gate the Tracking Code

Whichever call you read from, loading still works the same way: wrap the standard Hotjar snippet in a CategoryScriptso it's never fetched — let alone executed — before consent exists. categoryId is your own authored category ID (see Category type) — 'analytics' below is the common convention:

hotjar.ts
typescript
import { CategoryScript } from '@consenti/ui'

new CategoryScript({
  categoryId: 'analytics',
  widget,
  unsafeInnerHTML: `
    (function(h,o,t,j,a,r){
      h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
      h._hjSettings={hjid:YOUR_HOTJAR_ID,hjsv:6};
      a=o.getElementsByTagName('head')[0];
      r=o.createElement('script');r.async=1;
      r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
      a.appendChild(r);
    })(window, document, 'https://static.hotjar.com/c/hotjar-', '.js?sv=');
  `,
  onLoad: () => console.log('Hotjar loaded'),
  onRevoke: () => console.log('Hotjar script removed'),
})
⚠️CategoryScript removes the <script>tag on revoke, but Hotjar's recorder — once started — keeps running for the rest of that page view regardless of the tag's presence in the DOM. Gate-on-consent (never start pre-consent) is reliable; gate-then-revoke mid-session only stops the next page load from starting Hotjar again, not the recording already in progress.

Alternative: gate a single named cookie

If Hotjar is one of several tools sharing the same analytics category and you want it to have its own opt-out granularity, define a dedicated cookie parameter for it in your profile (with purpose: 'analytics') and gate on that specific cookie ID instead of the whole category — the write-side counterpart to option 3 above:

typescript
import { ConsentScript } from '@consenti/ui'

new ConsentScript({
  cookieId: 'hotjar', // matches the cookie ID you defined in the profile
  widget,
  unsafeInnerHTML: `/* same Hotjar snippet as above */`,
})

Verifying

  1. Before consenting, check Network tab — no request to static.hotjar.com should fire.
  2. Accept analytics consent on the Consenti banner.
  3. Confirm the Hotjar script now loads, then check the Hotjar dashboard's Recordings tab — new sessions typically appear within a few minutes.
  4. Hotjar also exposes a small debug badge via window.hj — run typeof window.hj in the console; it should be 'undefined' pre-consent and 'function' after.

Frequently asked questions