Dokumentace

Vše, co potřebujete vědět pro rychlou implementaci Consentio

Vlastní web

Pokročilá implementace Consentio pro vývojáře

Základní implementace

Pro základní implementaci stačí vložit jeden řádek kódu:

HTML
<script src="https://consentio.cz/widget/YOUR_SCRIPT_KEY/consentio.min.js" async></script>

Widget se automaticky inicializuje a zobrazí cookie lištu při prvním načtení stránky. Váš unikátní SCRIPT_KEY najdete v dashboardu v sekci Nastavení → Instalace.

Tip: Identifikace webu je součástí URL (SCRIPT_KEY), žádné další data atributy nejsou potřeba. Jazyk je detekován automaticky z atributu lang na elementu <html> nebo z hlavičky Accept-Language prohlížeče.

JavaScript API

Po načtení widgetu je dostupný globální objekt window.Consentio pro programatické ovládání.

Dostupné metody

Metoda Popis
show() Zobrazí cookie banner
hide() Skryje cookie banner
showPreferences() Zobrazí nastavení preferencí
getConsent() Vrátí aktuální stav souhlasů
updateConsent(updates) Aktualizuje stav souhlasů
onConsentChange(callback) Registruje listener na změny souhlasů
getBlockedScripts() Vrátí počet blokovaných skriptů
getBlockedIframes() Vrátí počet blokovaných iframe

Zobrazení lišty

JavaScript
// Zobrazit cookie lištu
Consentio.show()

// Skrýt cookie lištu
Consentio.hide()

// Zobrazit nastavení preferencí
Consentio.showPreferences()

Získání stavu souhlasů

JavaScript
// Získat aktuální stav souhlasů
const consent = Consentio.getConsent()
// { necessary: true, analytics: false, marketing: false, functionality: false }

// Zkontrolovat konkrétní kategorii
if (consent.analytics) {
  // Spustit analytické skripty
  loadGoogleAnalytics()
}

if (consent.marketing) {
  // Spustit marketingové skripty
  loadFacebookPixel()
}

Aktualizace souhlasů

JavaScript
// Aktualizovat konkrétní kategorie
Consentio.updateConsent({
  analytics: true,
  marketing: false
})

Event listenery

Reagujte na změny souhlasů pomocí event listenerů:

JavaScript
// Možnost 1: Použití onConsentChange
Consentio.onConsentChange((consent) => {
  console.log('Souhlas změněn:', consent)

  if (consent.analytics) {
    loadGoogleAnalytics()
  }

  if (consent.marketing) {
    loadFacebookPixel()
  }
})

// Možnost 2: Použití window event listeneru
window.addEventListener('consentio:consent', (event) => {
  const consent = event.detail
  console.log('Souhlas změněn:', consent)
})

Google Consent Mode v2

Consentio automaticky podporuje Google Consent Mode v2. Pro správnou funkci se ujistěte, že widget je načten před Google Analytics a dalšími Google skripty.

HTML
<!-- 1. Nejprve Consentio -->
<script src="https://consentio.cz/widget/YOUR_SCRIPT_KEY/consentio.min.js" async></script>

<!-- 2. Pak Google tag -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
</script>

Mapování kategorií na Consent Mode

Consentio kategorie Google Consent Mode
necessary functionality_storage, security_storage
analytics analytics_storage
marketing ad_storage, ad_user_data, ad_personalization
functionality personalization_storage

Blokování skriptů

Pro blokování skriptů před udělením souhlasu použijte atribut type="text/plain" s datovým atributem data-category:

HTML
<!-- Skript se spustí až po udělení souhlasu s analytics -->
<script type="text/plain" data-category="analytics">
  // Google Analytics kód
  gtag('config', 'G-XXXXXXX');
</script>

<!-- Skript se spustí až po udělení souhlasu s marketing -->
<script type="text/plain" data-category="marketing">
  // Facebook Pixel kód
  fbq('init', 'XXXXXXX');
</script>

<!-- Skript se spustí až po udělení souhlasu s functionality -->
<script type="text/plain" data-category="functionality">
  // Personalizační kód
  initPersonalization();
</script>

Dostupné kategorie

Kategorie Popis
necessary Nezbytné cookies (vždy povoleny)
analytics Analytické cookies
marketing Marketingové cookies
functionality Funkční cookies pro personalizaci

Tlačítko pro otevření preferencí

Umístěte na web tlačítko pro opětovné otevření cookie preferencí (vyžadováno GDPR):

HTML
<!-- V patičce webu -->
<a href="#" onclick="Consentio.showPreferences(); return false;">
  Nastavení cookies
</a>

<!-- Nebo jako button -->
<button onclick="Consentio.showPreferences()">
  Upravit preference cookies
</button>
Tip: GDPR vyžaduje, aby uživatelé mohli kdykoliv změnit své preference. Umístěte odkaz do patičky webu nebo do zásad ochrany osobních údajů.

Single Page Applications (SPA)

Pro React, Vue, Angular a další SPA frameworky widget funguje automaticky. Widget detekuje změny URL a aktualizuje se podle potřeby.

JavaScript
// Příklad: Kontrola stavu souhlasů při změně route (Vue Router)
router.afterEach(() => {
  if (window.Consentio) {
    const consent = Consentio.getConsent()
    if (consent.analytics) {
      // Analytické skripty jsou povoleny
    }
  }
})
ShoptetGoogle Tag Manager