Dokumentace / Instalace skriptu

Instalace skriptu Cookienovo

Technické informace o banneru Cookienovo pro vývojáře: jak vložit skript, konfigurovat značky, blokovat skripty podle kategorie a napojit Google Consent Mode v2.

Vložení skriptu

Aby vaše webová stránka zobrazovala banner Cookienovo a sbírala souhlasy se soubory cookie, vložte do zdrojového kódu stránky náš skript. Najdete ho ve svém účtu Cookienovo (dostali jste ho i e-mailem při registraci). Skript vložte do sekce <head>, co nejvýše — před Google Tag Manager a ostatní měřicí skripty.

Instalace má dvě části: (1) inline skript, který synchronně nastaví výchozí souhlasy Google Consent Mode v2 před spuštěním jakýchkoli Google tagů, a (2) samotný skript banneru:

<!-- Krok 1: výchozí souhlasy PŘED jakýmikoli Google tagy -->
<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>
<!-- Krok 2: banner Cookienovo (lze použít defer) -->
<script site-token="<site-token>" type="text/javascript" src="https://cookienovo.com/assets/client.js" defer></script>

Používáte optimalizační nebo cache plugin (WP Rocket, LiteSpeed Cache, Autoptimize, SG Optimizer, W3 Total Cache…)? Vylučte skript Cookienovo z jeho úprav — zejména z minifikace/kombinování JavaScriptu a z odloženého spuštění (Delay JavaScript). Do seznamů výjimek přidejte cookienovo a po změně vymažte cache pluginu. Jinak se cookie lišta nemusí zobrazit.

Značky skriptu

Skript banneru Cookienovo podporuje tyto atributy:

site-token — povinné. UUID vaší stránky z účtu Cookienovo (dostali jste ho i e-mailem). Bez správného tokenu se banner nezobrazí. 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 — volitelné. Vynutí motiv banneru: "light" nebo "dark".
consent-mode — volitelné. Přepíše režim souhlasu banneru. Ve výchozím nastavení "true"; nastavte "false", pokud nechcete odesílat souhlasy.

Blokování skriptů podle kategorie

Aby se měřicí a marketingové skripty spustily až po souhlasu, přiřaďte jim kategorii přes atribut cn-category. Banner Cookienovo je pak spustí jen tehdy, když návštěvník danou kategorii povolí:

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

Možné hodnoty atributu cn-category: necessary (nezbytné), functional (funkční), analytics (analytika), marketing.

Zpracování událostí

Pokud chcete stav souhlasu zpracovat ve vlastních skriptech, poslouchejte událost CookienovoUserConsentChanged:

<script type="text/javascript">
  document.addEventListener("CookienovoUserConsentChanged", (e) => {
    console.log("souhlas změněn", e.detail);
  });
</script>

V objektu detail najdete stav souhlasu pro každou kategorii (kategorie + booleovská hodnota, zda ji uživatel povolil):

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

Google Consent Mode v2

Cookienovo plně vyhovuje Google Consent Mode v2 a nastavuje ho automaticky — bez zásahu uživatele či administrátora. Výchozí souhlasy se nastaví hned při načtení stránky a po volbě návštěvníka se aktualizují.

Díky dvoudílné instalaci (inline výchozí souhlasy + skript banneru) jsou signály ad_storage, analytics_storage, ad_user_data a ad_personalization ve výchozím nastavení nastaveno na 'denied' ještě před spuštěním Google tagů. Přístup sleduje průmyslové standardy a funguje i s asynchronně načítanými Google tagy. Výchozí nastavení zahrnují wait_for_update:500 a ads_data_redaction:true pro maximální ochranu soukromí.

Více v dokumentaci Google.

Ladicí funkce

K ověření implementace Consent Mode v2 poskytuje Cookienovo ladicí funkce, které spustíte v konzoli prohlížeče. Otevřete konzoli (F12) na libovolné stránce s nainstalovaným Cookienovo a spusťte:

// zapni debug režim a spusť plnou validaci
window.cookienovoDebug.enableDebugMode()

// jen validační kontroly
window.cookienovoDebug.runFullValidation()

// report souladu
window.cookienovoDebug.generateComplianceReport()

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

// test implementace
window.cookienovoDebug.testConsentModeImplementation()

// kontrola Shopify integrace
window.cookienovoDebug.checkShopifyIntegration()

Funkce vypíšou podrobné informace o vaší implementaci: skóre souladu, zjištěné Google tagy, problémy a konkrétní doporučení. Diagnostiku můžete spustit i z dashboardu bez otevírání konzole.

Automatické blokování trackerů

Cookienovo dokáže automaticky neutralizovat trackery třetích stran mimo Google (například Facebook Pixel, Hotjar či Microsoft Clarity) před udělením souhlasu a znovu je aktivovat ve chvíli, kdy návštěvník povolí příslušnou kategorii. Google tagy se řeší samostatně přes Consent Mode v2, takže je není potřeba blokovat ručně.

U podporovaných trackerů nejsou potřeba žádné změny v kódu. Blokování je best-effort: pokrývá seznam známých trackerů a skripty vložené přímo v <head> mohou jednou vystřelit dříve, než se blokovač spustí. Pro jisté blokování jakéhokoli skriptu ho označte ručně podle návodu výše. Automatické blokování si zapnete nebo vypnete sami v nastavení lišty svého webu — přepínač „Automatické blokování sledovačů“. U nových webů je ve výchozím nastavení zapnuté.

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.

Odkaz v patičce: znovuotevření nastavení cookies

Ve výchozím nastavení malé plovoucí tlačítko „Cookies“ umožňuje návštěvníkům znovu otevřít jejich předvolby. Pokud ho chcete skrýt (nastavte ikonu na Skryté v nastavení banneru) a otevírat preference centrum z vlastního odkazu — například „Nastavení cookies“ v patičce — přidejte na libovolný prvek atribut data-cookienovo-settings:

<a href="#" data-cookienovo-settings>Nastavení cookies</a>

Nebo jej otevřete programově z vlastního JavaScriptu:

window.cookienovo.showConsentSettings()