PL
Zacznij za darmo

Dokumentacja

Wszystko, co musisz wiedzieć, aby szybko wdrożyć Consentio

Niestandardowa strona internetowa

Zaawansowana implementacja Consentio dla programistów

Podstawowa implementacja

W przypadku podstawowej implementacji wystarczy wstawić jedną linię kodu:

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

Widget inicjalizuje się automatycznie i wyświetla pasek zgody na plikach cookie przy pierwszym załadowaniu strony. Swój unikalny SCRIPT_KEY znajdziesz w panelu w sekcji Ustawienia → Instalacja.

Wskazówka: identyfikacja strony jest częścią adresu URL (SCRIPT_KEY), więc żadne dodatkowe atrybuty danych nie są potrzebne. Język jest wykrywany automatycznie na podstawie atrybutu lang elementu <html> lub nagłówka przeglądarki Accept-Language.

API JavaScript

Po załadowaniu widgetu dostępny jest globalny obiekt window.Consentio, umożliwiający sterowanie programistyczne.

Dostępne metody

Metoda Opis
show() Wyświetla baner cookie
hide() Ukrywa baner cookie
showPreferences() Wyświetla ustawienia preferencji
getConsent() Zwraca aktualny stan zgody
updateConsent(updates) Aktualizuje stan zgody
onConsentChange(callback) Rejestruje nasłuchiwanie zmian zgody
getBlockedScripts() Zwraca liczbę zablokowanych skryptów
getBlockedIframes() Zwraca liczbę zablokowanych elementów iframe

Wyświetlanie banera

JavaScript 
// Wyświetl baner cookie
Consentio.show()

// Ukryj baner cookie
Consentio.hide()

// Wyświetl ustawienia preferencji
Consentio.showPreferences()

Pobieranie stanu zgody

JavaScript 
// Pobierz aktualny stan zgody
const consent = Consentio.getConsent()
// { necessary: true, analytics: false, marketing: false, functionality: false }

// Sprawdź konkretną kategorię
if (consent.analytics) {
  // Uruchom skrypty analityczne
  loadGoogleAnalytics()
}

if (consent.marketing) {
  // Uruchom skrypty marketingowe
  loadFacebookPixel()
}

Aktualizacja zgody

JavaScript 
// Zaktualizuj konkretne kategorie
Consentio.updateConsent({
  analytics: true,
  marketing: false
})

Nasłuchiwanie zdarzeń

Reaguj na zmiany zgody za pomocą nasłuchiwania zdarzeń:

JavaScript 
// Opcja 1: użycie onConsentChange
Consentio.onConsentChange((consent) => {
  console.log('Zgoda zmieniona:', consent)

  if (consent.analytics) {
    loadGoogleAnalytics()
  }

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

// Opcja 2: użycie nasłuchiwania zdarzenia window
window.addEventListener('consentio:consent', (event) => {
  const consent = event.detail
  console.log('Zgoda zmieniona:', consent)
})

Google Consent Mode v2

Consentio automatycznie obsługuje Google Consent Mode v2. Aby zapewnić poprawne działanie, upewnij się, że widget jest ładowany przed Google Analytics i innymi skryptami Google.

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

<!-- 2. Następnie tag Google -->
<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>

Mapowanie kategorii na Consent Mode

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

Blokowanie skryptów

Aby zablokować skrypty przed udzieleniem zgody, użyj atrybutu type="text/plain" wraz z atrybutem danych data-category:

HTML 
<!-- Skrypt uruchamia się dopiero po udzieleniu zgody na analitykę -->
<script type="text/plain" data-category="analytics">
  // Kod Google Analytics
  gtag('config', 'G-XXXXXXX');
</script>

<!-- Skrypt uruchamia się dopiero po udzieleniu zgody na marketing -->
<script type="text/plain" data-category="marketing">
  // Kod Facebook Pixel
  fbq('init', 'XXXXXXX');
</script>

<!-- Skrypt uruchamia się dopiero po udzieleniu zgody na funkcjonalność -->
<script type="text/plain" data-category="functionality">
  // Kod personalizacji
  initPersonalization();
</script>

Dostępne kategorie

Kategoria Opis
necessary Niezbędne pliki cookie (zawsze dozwolone)
analytics Pliki cookie analityczne
marketing Pliki cookie marketingowe
functionality Funkcjonalne pliki cookie do personalizacji

Przycisk do otwierania preferencji

Umieść na stronie przycisk do ponownego otwarcia preferencji dotyczących plików cookie (wymóg RODO):

HTML 
<!-- W stopce strony -->
<a href="#" onclick="Consentio.showPreferences(); return false;">
  Ustawienia cookie
</a>

<!-- Lub jako przycisk -->
<button onclick="Consentio.showPreferences()">
  Zarządzaj preferencjami cookie
</button>
Wskazówka: RODO wymaga, aby użytkownicy mogli zmieniać swoje preferencje w dowolnym momencie. Umieść odnośnik w stopce strony lub w polityce prywatności.

Aplikacje jednostronicowe (SPA)

W przypadku React, Vue, Angular i innych frameworków SPA widget działa automatycznie. Wykrywa zmiany adresu URL i aktualizuje się w razie potrzeby.

JavaScript 
// Przykład: sprawdzanie stanu zgody przy zmianie trasy (Vue Router)
router.afterEach(() => {
  if (window.Consentio) {
    const consent = Consentio.getConsent()
    if (consent.analytics) {
      // Skrypty analityczne są dozwolone
    }
  }
})
ShoptetGoogle Tag Manager