Script blocking

Automatic Blocking (Default)

In automatic mode, CookieHug detects and blocks third-party scripts, iframes, and tracking pixels using hostname-based domain matching and a MutationObserver. The observer monitors both new DOM elements and src attribute changes on existing elements. Known tracking domains are automatically categorized (statistics, marketing, preferences) and blocked until consent is given.

Hostname matching: Patterns are matched against the URL's hostname (not the full URL), preventing false positives — e.g., segment.com will not accidentally block my-segment.com. Patterns containing a path (e.g., facebook.com/tr) are matched against the full URL. Relative URLs (first-party scripts) are never blocked.

Covered services include: Google Analytics (including region1), Google Tag Manager, Google Ads, Meta/Facebook Pixel, TikTok, Snapchat, LinkedIn, Twitter/X, Pinterest, Bing Ads, Reddit, Quora, Amazon Ads, Hotjar, Clarity, Plausible, Matomo, Amplitude, FullStory, Mouseflow, Fathom, Datadog RUM, LogRocket, YouTube, Vimeo, Google Maps, Intercom, Crisp, LiveChat, Tawk.to, Drift, HubSpot, Zendesk, Freshworks, and more.

Whitelisted scripts (e.g., jQuery, Bootstrap, common CDN libraries) are never blocked.

Important: The CookieHug script must be placed in <head> before any third-party scripts. Scripts loaded before CookieHug cannot be retroactively blocked.

Manual Script Tagging

Use data-cookiehug-consent to manually control which scripts require consent. Set the script's type to text/plain to prevent execution until consent is granted.

<!-- Statistics script (external) -->
<script type="text/plain" data-cookiehug-consent="statistics"
  src="https://www.googletagmanager.com/gtag/js?id=G-XXXXX">
</script>

<!-- Marketing script (inline) -->
<script type="text/plain" data-cookiehug-consent="marketing">
  fbq('init', '123456789');
  fbq('track', 'PageView');
</script>

<!-- Preferences script -->
<script type="text/plain" data-cookiehug-consent="preferences"
  src="https://cdn.example.com/chat-widget.js">
</script>

Consent Categories

Placeholders for Blocked Elements

When CookieHug blocks an iframe (video, map, social embed, chat widget), it automatically replaces it with a styled placeholder that shows an appropriate icon, displays a message explaining why the content is blocked, and includes a button to grant consent for that specific category.

Embeds without any request before consent

A static <iframe src="https://www.youtube.com/embed/…"> in your HTML starts loading the moment the browser's parser reaches it. CookieHug neutralises it a few milliseconds later and shows the placeholder, but the first request has already left the browser — the provider sees the visitor's IP address and the page URL before any decision. The pre-consent audit reports this as a warning ("request cut off before a response").

To close that gap completely, write the address into data-cookiehug-src and leave src out. The browser then sends nothing; CookieHug shows the placeholder and sets the real src only after consent (or immediately, if consent is already stored).

The category is taken from data-cookiehug-consent when present, otherwise from the service catalogue (YouTube, Vimeo, Google Maps and so on are classified automatically). Unknown hosts default to marketing.

WordPress: the CookieHug plugin (0.2.7+) rewrites embeds in post content, widgets and embed blocks automatically — nothing to do by hand.

<!-- Before: loads immediately, CookieHug can only cut the request off -->
<iframe src="https://www.youtube.com/embed/VIDEO_ID" width="560" height="315"></iframe>

<!-- After: no request until consent -->
<iframe data-cookiehug-src="https://www.youtube.com/embed/VIDEO_ID"
  data-cookiehug-consent="marketing" width="560" height="315"></iframe>

Using runScripts() in SPAs

For Single Page Applications where content is loaded dynamically, call CookieHug.runScripts() after new content with tagged scripts is added to the DOM:

// After dynamically loading new page content
loadPageContent().then(function() {
  CookieHug.runScripts();
});