Skip to main content

Syncing cookie consent between Breakout and your CMP

T
Written by Tripti

Breakout can collect cookie consent from visitors inside the chat widget. If your website already collects consent through a Consent Management Platform (CMP) or cookie provider — such as OneTrust, Transcend, Cookiebot, or Google Tag Manager — Breakout can stay in sync with it in both directions, so visitors are never asked twice and your consent records stay consistent across systems.

There are two flows to set up:

  • Reading consent from your site — Breakout detects the choice a visitor already made through your CMP, and skips its own consent prompt.

  • Writing consent back to your CMP — When a visitor grants consent inside Breakout, Breakout notifies your website so you can record it in your CMP or analytics.

You can set up either flow on its own, or both together.

Enabling cookie consent in Breakout

By enabling this feature, you can require visitors to accept cookies before using the chat, either by locking the chat until they accept or by showing the chat alongside a notice.

  1. Click on your name to navigate to Settings and then click Cookie Consent.

  2. In that section, toggle the switch to turn on cookie consent gating.

Note: It is turned off by default.

Once enabled, the following fields become available:

Field

What it does

Mode

Whether the chat is blocked until the visitor accepts (Explicit) or shown with a notice (Implicit).

Consent State Variable

The variable on your page that holds the visitor's current consent choice.

Accepted Values

The values in that variable that mean consent has been given.

Consent Event

The browser event Breakout listens for to detect consent changes.

Privacy Policy Link

The privacy policy linked from the consent prompt.

Choosing a consent mode

Explicit — The visitor must click Accept before they can chat. Until they do, the chat input stays locked and shows your locked-input text.

Implicit — The chat is available immediately alongside a short notice. The visitor sending their first message is treated as their consent.

Telling Breakout about consent collected on your site

If a visitor has already accepted or declined cookies through your CMP or consent is set by default opt-in/opt-out, Breakout can read that choice and skip its own consent prompt. There are two ways to pass that choice to Breakout, and you can use either one or both.

Consent Event

Most cookie tools announce the visitor's choice on the page as a browser event. Enter that event name in the Consent Event field, and Breakout will listen for it on the window object. The moment it fires, Breakout knows whether the visitor accepted or declined.

Consent State Variable

Most cookie tools also store the current choice in a variable on the page. Enter that variable name in the Consent State Variable field — for example, OnetrustActiveGroups — and Breakout will check it periodically to read the latest choice.

Because every provider uses a different value to mean "accepted," you also need to tell Breakout which values count. Enter them in the Accepted Values field — for example, C0001, granted, or true. When the variable matches one of these values, Breakout treats consent as given. Anything else is treated as not given.

Note: Changes read from the data-layer variable can take up to 30 seconds to appear in the widget. If you need a change applied immediately, fire the consent event as well.

Firing the Consent Event

Dispatch your configured event on window as a CustomEvent, and include the visitor's current choice in detail.granted.

window.dispatchEvent(
new CustomEvent('YOUR_CONSENT_EVENT_NAME', {
detail: { granted: true } // true = accepted, false = declined/revoked
})
);

Payload

Field

Type

Required

Meaning

detail.granted

boolean

Yes

true — consent granted; the chat unlocks and tracking is allowed. false — consent declined or revoked.

Examples

// Visitor accepts / opts in
window.dispatchEvent(
new CustomEvent('YOUR_CONSENT_EVENT_NAME', {
detail: { granted: true }
})
);

// Visitor declines / opts out
window.dispatchEvent(
new CustomEvent('YOUR_CONSENT_EVENT_NAME', {
detail: { granted: false }
})
);

Rules to follow

  • Dispatch the event on window using window.dispatchEvent, and use a CustomEvent so that it carries a detail object.

  • The event name must match the Consent Event field exactly. It is case-sensitive.

  • granted must be a real boolean. A string such as "false" will be read as true.

  • Fire the event every time the visitor's choice changes — once when they accept, and again with granted: false if they later opt out. This is not a toggle: Breakout sets its state to exactly the value you send, so always send the current choice rather than assuming Breakout will flip it.

  • If you fire the event without a detail object, or without a granted field, Breakout treats it as granted. Always include granted: false when you mean revoked.

Bridging from your CMP

Most cookie tools fire their own events that don't use detail.granted. In that case, add a small bridge that listens for your provider's events and re-emits them in the format Breakout expects. For example if the Consent Event is breakout-consent, this is how you would do it

function tellBreakout(granted) {
window.dispatchEvent(
new CustomEvent('breakout-consent', {
detail: { granted }
})
);
}

// Example: Cookiebot
window.addEventListener('CookiebotOnAccept', () => tellBreakout(true));
window.addEventListener('CookiebotOnDecline', () => tellBreakout(false));

Then set Consent event name to breakout-consent.

Telling your CMP about consent collected in Breakout

When a visitor grants consent inside the chat widget, Breakout dispatches a one-time consent event on the window object as a BO::EVENT CustomEvent. By listening for this event, you can update your CMP or cookie provider so your overall consent state stays in sync.

Depending on your mode, this event is triggered when:

  • Explicit mode: The visitor clicks Accept inside the chat.

  • Implicit mode: The visitor sends their first message in the chat widget.

Event payload

The consent event is identified by event_type: "breakout_consent_granted". You can access the event details through event.detail.

{
"event_type": "breakout_consent_granted",
"metadata": {
"source": "command_bar",
"mode": "explicit", // "explicit" (Accept clicked) or "implicit" (first message sent)
"prospect_id": "…", // Included when available
"page_url": "…",
"user_email": "…"
}
}

Implementation guide

To capture this event and sync it with your CMP or analytics setup, add a window event listener to your website's header or tag manager script.

Example code

<script>
window.addEventListener('BO::EVENT', function (e) {
var evt = e.detail || {};

// Filter for the Breakout consent event
if (evt.event_type !== 'breakout_consent_granted') return;

// 1. Example: Push to Google Tag Manager dataLayer
if (window.dataLayer) {
window.dataLayer.push({
event: 'breakout_consent_granted',
consentMode: evt.metadata ? evt.metadata.mode : 'unknown'
});
}

// 2. Example: Trigger your CMP's custom API (OneTrust, Transcend, etc.)
// myCMP.updateConsent({ analytics: true, marketing: true });
});
</script>

Note: Ensure that the event listener script is initialized on the page before the Breakout widget loads, so that no consent events are missed.

When cookie consent collection is enabled, Breakout can automatically notify your website whenever a visitor grants consent inside the chat widget.

By listening for this event, you can seamlessly update your Consent Management Platform (CMP) or cookie provider (such as OneTrust, Transcend, or Google Tag Manager) to ensure your overall consent state stays in sync across systems.

Did this answer your question?