Cookie consent - Navattic Documentation

By default, Navattic tracks analytics events and persists form data as soon as a visitor loads an embedded demo. If your site uses a cookie consent banner (OneTrust, Cookiebot, or similar), you can configure Navattic to hold all tracking until the visitor gives consent.

How it works

There are two parts to the integration:

Admin setting — Turn off cookie tracking by default for your workspace or for individual demos. This ensures embedded demos fire no analytics on load.
Consent callback — After the visitor accepts your consent banner, send a postMessage to the Navattic iframe to enable tracking.

Step 1: Disable tracking by default

You can set the default at the workspace level (applies to all demos) or override it per demo. Workspace-wide: Go to Settings > Defaults > toggle on Cookie tracking, then set it to Off. Per-demo: Open the demo in the Product Demos tab > click the three dots > Edit details > toggle Cookie tracking to Off. When tracking is off, the demo fires no analytics events and does not persist form submission data until consent is received.

After the visitor accepts your consent banner, send a postMessage to the Navattic iframe:

JavaScript

const iframe = document.querySelector('iframe[src*="navattic"]')
iframe.contentWindow.postMessage(
  { kind: 'navattic:set-cookie-consent', value: { events: true, forms: true } },
  '*'
)

To revoke consent (for example, if the visitor opts out):

JavaScript

iframe.contentWindow.postMessage(
  { kind: 'navattic:set-cookie-consent', value: { events: false, forms: false } },
  '*'
)

The demo picks up the change on the next tracked event — no page reload required.

Value payload reference

The value field accepts an object with two optional boolean flags:

Field	Type	Description
`events`	boolean	Controls analytics and engagement tracking
`forms`	boolean	Controls persistence and pre-fill of form submission data

You can also pass the string preset 'all', which is equivalent to { events: true, forms: true }.

The string preset 'necessary' enables event tracking (events: true). It does not suppress analytics. To turn off all tracking, send { events: false, forms: false } — not 'necessary'.

Provider examples

OneTrust
Cookiebot
Generic banner

Fire the postMessage from the OptanonWrapper callback, which OneTrust calls whenever consent changes.

JavaScript

function OptanonWrapper() {
  // OneTrust exposes accepted group IDs in window.OnetrustActiveGroups
  // Adjust the condition based on your cookie category IDs
  const analyticsConsented = window.OnetrustActiveGroups?.includes('C0002')

  const iframe = document.querySelector('iframe[src*="navattic"]')
  if (!iframe) return

  iframe.contentWindow.postMessage(
    {
      kind: 'navattic:set-cookie-consent',
      value: { events: analyticsConsented, forms: analyticsConsented },
    },
    '*'
  )
}

Fire the postMessage from the CookiebotOnAccept event.

JavaScript

window.addEventListener('CookiebotOnAccept', function () {
  const statisticsConsented = Cookiebot.consent.statistics

  const iframe = document.querySelector('iframe[src*="navattic"]')
  if (!iframe) return

  iframe.contentWindow.postMessage(
    {
      kind: 'navattic:set-cookie-consent',
      value: { events: statisticsConsented, forms: statisticsConsented },
    },
    '*'
  )
})

Call this function from your site’s own consent-accepted handler.

JavaScript

function onConsentAccepted(analyticsEnabled) {
  const iframe = document.querySelector('iframe[src*="navattic"]')
  if (!iframe) return

  iframe.contentWindow.postMessage(
    {
      kind: 'navattic:set-cookie-consent',
      value: { events: analyticsEnabled, forms: analyticsEnabled },
    },
    '*'
  )
}

FAQs

What happens if I don't send the postMessage?

The demo continues with no tracking until a postMessage is received. Analytics events are silently dropped and form data is not persisted.

Does the visitor need to reload the page after accepting?

No. The change takes effect on the next tracked event after the postMessage is received. No reload is needed.

Can I track events but not form data?

Yes. Send { events: true, forms: false } to enable analytics tracking while keeping form submission data from being persisted or pre-filled.

What if my page has multiple Navattic demos?

The selector document.querySelector('iframe[src*="navattic"]') only finds the first matching iframe. Use document.querySelectorAll and loop over each iframe to send the message to all embedded demos.

Navattic Forms

Learn how form data is collected and persisted in demos.

Demo defaults

Configure workspace-wide defaults for cookie tracking and other settings.

​How it works

​Step 1: Disable tracking by default

​Step 2: Wire your consent banner to the demo

​Value payload reference

​Provider examples

​FAQs

​Related

Navattic Forms

Demo defaults

How it works

Step 1: Disable tracking by default

Step 2: Wire your consent banner to the demo

Value payload reference

Provider examples

FAQs

Related