Features Pricing Documentation Blog For agencies Contact
Sign in Try for free
Documentation / Script installation

Installing the Cookienovo script

Technical information about the Cookienovo banner for developers: how to insert the script, configure tags, block scripts by category, and connect Google Consent Mode v2.

Inserting the script

For your website to display the Cookienovo banner and collect cookie consents, insert our script into the page's source code. You'll find it in your Cookienovo account (you also received it by email at registration). Place the script in the section <head>, as high as possible — before Google Tag Manager and other measurement scripts.

Installation has two parts: (1) an inline script that synchronously sets the default Google Consent Mode v2 consents before any Google tags fire, and (2) the banner script itself:

<!-- Step 1: consent defaults BEFORE any Google tags -->
<script>
window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}
gtag('consent','default',{'ad_storage':'denied','ad_personalization':'denied','ad_user_data':'denied','analytics_storage':'denied','functionality_storage':'denied','personalization_storage':'denied','security_storage':'granted','wait_for_update':500});
gtag('set','ads_data_redaction',true);
</script>
<!-- Step 2: Cookienovo banner (defer is fine) -->
<script site-token="<site-token>" type="text/javascript" src="https://cookienovo.com/assets/client.js" defer></script>

Using an optimisation or cache plugin (WP Rocket, LiteSpeed Cache, Autoptimize, SG Optimizer, W3 Total Cache…)? Exclude the Cookienovo script from its changes — especially JavaScript minification/combining and deferred execution (Delay JavaScript). Add to the exclusion lists cookienovo and after the change, clear the plugin's cache. Otherwise the cookie banner may not appear.

Script attributes

The Cookienovo banner script supports these attributes:

  • site-token — required. Your site's UUID from your Cookienovo account (also sent by email). Without a valid token, the banner won't appear. Token je nezávislý od URL a schémy webu — pri prechode z http:// na https:// (alebo inej zmene URL webu v účte) ostáva rovnaký, takže netreba re-inštaláciu ani výmenu snippetu.
  • theme — optional. Forces the banner theme: "light" or "dark".
  • consent-mode — optional. Overrides the banner's consent mode. Default is "true"; set "false", if you don't want to send consents.

Blocking scripts by category

To make measurement and marketing scripts fire only after consent, assign them a category via the attribute cn-category. The Cookienovo banner then fires them only when the visitor allows that category:

<script type="text/javascript" cn-category="analytics">
  // analytics script
</script>

Possible values of the attribute cn-category: necessary (necessary), functional (functional), analytics (analytics), marketing.

Handling events

If you want to handle the consent state in your own scripts, listen for the event CookienovoUserConsentChanged:

<script type="text/javascript">
  document.addEventListener("CookienovoUserConsentChanged", (e) => {
    console.log("consent changed", e.detail);
  });
</script>

In the object detail you'll find the consent state for each category (category + a boolean of whether the user allowed it):

{
  "detail": [
    { "category": "necessary",  "allowed": true  },
    { "category": "analytics",  "allowed": false },
    { "category": "functional", "allowed": true  },
    { "category": "marketing",  "allowed": true  }
  ]
}

Google Consent Mode v2

Cookienovo fully complies with Google Consent Mode v2 and sets it up automatically — without any action from the user or administrator. Default consents are set as soon as the page loads and update after the visitor's choice.

Thanks to the two-part installation (inline default consents + banner script), the signals ad_storage, analytics_storage, ad_user_data and ad_personalization set by default to 'denied' before any Google tags fire. The approach follows industry standards and works with asynchronously loaded Google tags too. The defaults include wait_for_update:500 and ads_data_redaction:true for maximum privacy protection.

More in the Google documentation.

Debug functions

To verify your Consent Mode v2 implementation, Cookienovo provides debug functions you run in the browser console. Open the console (F12) on any page with Cookienovo installed and run:

// enable debug mode and run full validation
window.cookienovoDebug.enableDebugMode()

// validation checks only
window.cookienovoDebug.runFullValidation()

// compliance report
window.cookienovoDebug.generateComplianceReport()

// Consent Mode status
window.cookienovoDebug.checkConsentMode()

// implementation test
window.cookienovoDebug.testConsentModeImplementation()

// Shopify integration check
window.cookienovoDebug.checkShopifyIntegration()

The functions print detailed information about your implementation: compliance score, detected Google tags, issues, and specific recommendations. You can also run the diagnostics from the dashboard without opening the console.

Automatic tracker blocking

Cookienovo can automatically neutralise third-party trackers outside Google (for example Facebook Pixel, Hotjar, or Microsoft Clarity) before consent is given and reactivate them the moment the visitor allows the relevant category. Google tags are handled separately via Consent Mode v2, so they don't need to be blocked manually.

For supported trackers, no code changes are needed. Blocking is best-effort: it covers a list of known trackers, and scripts inserted directly in <head> may occasionally fire before the blocker starts. To reliably block any script, mark it manually as described above. You can turn automatic blocking on or off yourself in your site's banner settings — the “Automatic tracker blocking” toggle. It is enabled by default for new sites.

Content Security Policy (CSP)

Ak na svojom webe používate Content Security Policy, banner Cookienovo funguje bez toho, aby ste museli povoliť externé zdroje. Lišta neťahá žiadny externý stylesheet ani webfont — CSS vkladá inline priamo na stránku a používa systémové písmo (system-ui). Direktívy font-src ani externý style-host preto netreba. Stačí povoliť tieto direktívy:

  • script-src — host, ktorý servíruje client.js (napríklad cookienovo.com).
  • connect-src — API origin, kam banner posiela požiadavky (cookienovo.com): konfigurácia /api/config a consent endpointy (/consents, /consents/event).
  • img-src 'self' data: <logo-host>data: pre vstavanú ikonu a maskota (vložené priamo v skripte ako data: URI) a host externej URL, ak používate vlastné logo z inej domény.
  • style-src 'unsafe-inline' — lišta injektuje na stránku vlastný blok <style> a používa inline atribúty style.

Prečo tie dve uvoľnenia: ikony a maskot sú v skripte zapečené ako data: URI (žiadny externý obrázok), preto v img-src stačí pridať data:. Štýly banneru sa vkladajú cez injektovaný <style> blok a inline style atribúty, čo vyžaduje 'unsafe-inline' v style-src.

Footer link: reopen cookie settings

By default, a small floating “Cookies” button lets visitors reopen their preferences. If you want to hide it (set the icon to Hidden in the banner settings) and open the preference centre from your own link — for example “Cookie settings” in the footer — add to any element the attribute data-cookienovo-settings:

<a href="#" data-cookienovo-settings>Cookie settings</a>

Or open it programmatically from your own JavaScript:

window.cookienovo.showConsentSettings()