Docs
Product
Developer

Script blocking & data-attributes

AdminUpdated Sep 15, 2026

Script blocking & data-attributes

Cookie Munch blocks trackers from firing before consent in two complementary ways: auto-blocking (a heuristic DOM interceptor that needs no markup changes) and manual markup (you mark a tag inert yourself, for precise control). Both feed the same reactivation mechanism once consent is granted.

Auto-blocking (data-blockingmode="auto", the default)

With auto-blocking, Cookie Munch patches Node.prototype.appendChild / insertBefore and installs a MutationObserver before your page's own scripts run, so it sees every <script>, <iframe>, <img>, <link>, <embed>, <object>, <audio>, <video>, and <source> element the instant it's inserted — whether by inline HTML, a tag manager, or your own JS.

Each element is checked against a bundled checklist of known tracker domains/patterns (Google Analytics, Meta Pixel, common ad networks, etc.). If it matches a category that isn't yet granted, the element is neutralized in place:

  • Scripts get type="text/plain" — the browser won't execute them.

  • Other resources get their src moved to data-cookieblock-src and removed — the browser won't fetch them.

  • Either way, data-cookieconsent="<category>" is written onto the element, recording why it was blocked.

You don't write any markup for this path — it's fully automatic. Two escape hatches:

Mechanism

Effect

data-cookieconsent="ignore" on an element

Never auto-blocked — useful for your own first-party scripts that happen to match a checklist pattern.

ignoreSelectors in the site's blocking config

CSS selectors that are never inspected at all (config-level allowlist, set via PUT /v1/sites/:cbid/config).

Manual markup (data-blockingmode="manual")

With manual mode, you take full control: mark each tracking tag inert yourself using the same attribute vocabulary the auto-blocker writes, and Cookie Munch reactivates it once the declared categories are granted.

<!-- Cookiebot-compatible: comma-separated standard categories -->
<script type="text/plain" data-cookieconsent="statistics"
  src="https://www.google-analytics.com/analytics.js"></script>

<!-- Requires BOTH categories before it runs -->
<script type="text/plain" data-cookieconsent="statistics,marketing"
  src="https://example.com/combined-pixel.js"></script>

<!-- Non-script resource: src goes in data-cookieblock-src -->
<iframe data-cookieblock-src="https://www.youtube.com/embed/xyz"
  data-cookieconsent="marketing"></iframe>

Attribute

Applies to

Values

Description

type="text/plain"

<script>

—

Marks the tag inert. Cookie Munch swaps it back to type="text/javascript" (re-creating the node, so the browser actually executes it) once granted.

data-cookieconsent

any blockable element

preferences, statistics, marketing (comma-separated), or ignore

The categories required before this element activates. All listed categories must be granted. ignore opts the element out of auto-blocking entirely (see above).

data-cookieblock-src

non-script resources (<iframe>, <img>, …)

a URL

Holds the real src while blocked; Cookie Munch restores it to src on activation.

data-fc-category

any blockable element

any category id, standard or custom (comma-separated)

Cookie Munch-native alternative to data-cookieconsent — use this when you need a custom category (Banner Studio v2 custom categories aren't valid data-cookieconsent values, which are limited to the four standard categories).

Note: data-cookieconsent only accepts the three user-toggleable standard categories (preferences, statistics, marketing) plus ignore — necessary and custom category ids are rejected there. If your site defines custom categories in Banner Studio, tag those scripts with data-fc-category="my-custom-id" instead.

Placeholder elements

For consent-gated embeds (e.g. "Enable this video" instead of just silently not loading), toggle visibility with these classes — no JS required:

<div class="cookieconsent-optin-marketing">
  <!-- shown once marketing is granted -->
</div>
<div class="cookieconsent-optout-marketing">
  Please accept marketing cookies to view this content.
  <!-- shown until marketing is granted -->
</div>

Cookie Munch toggles the hidden attribute on any element matching .cookieconsent-optin-<category> / .cookieconsent-optout-<category> every time consent is granted, withdrawn, or re-evaluated (categories: preferences, statistics, marketing).

Migrating from Cookiebot

data-cookieconsent, type="text/plain", and data-cookieblock-src are exact Cookiebot-compatible attribute names — existing manually-marked-up pages work unmodified after swapping the <script> tag. The only Cookie Munch-native addition is data-fc-category, needed solely for custom (non-standard) categories.

Next: JavaScript API to react to consent changes in your own code, or site config to set the blocking mode and ignoreSelectors via the REST API.

Was this page helpful?
Script blocking & data-attributes