IT
Inizia gratis

Documentazione

Tutto quello che ti serve per implementare Consentio in poco tempo

Sito Web Personalizzato

Implementazione avanzata di Consentio per sviluppatori

Implementazione di base

Per l'implementazione di base, basta inserire una singola riga di codice:

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

Il widget si inizializza automaticamente e mostra la banner dei cookie al primo caricamento della pagina. Trovi la tua SCRIPT_KEY univoca nella dashboard in Impostazioni → Installazione.

Suggerimento: l'identificazione del sito web fa parte dell'URL (SCRIPT_KEY), quindi non servono attributi dati aggiuntivi. La lingua viene rilevata automaticamente dall'attributo lang dell'elemento <html> o dall'header Accept-Language del browser.

API JavaScript

Una volta caricato il widget, l'oggetto globale window.Consentio è disponibile per il controllo programmatico.

Metodi disponibili

Metodo Descrizione
show() Mostra la banner dei cookie
hide() Nasconde la banner dei cookie
showPreferences() Mostra le impostazioni delle preferenze
getConsent() Restituisce lo stato attuale del consenso
updateConsent(updates) Aggiorna lo stato del consenso
onConsentChange(callback) Registra un listener per i cambiamenti del consenso
getBlockedScripts() Restituisce il numero di script bloccati
getBlockedIframes() Restituisce il numero di iframe bloccati

Mostrare la banner

JavaScript 
// Mostra la banner dei cookie
Consentio.show()

// Nascondi la banner dei cookie
Consentio.hide()

// Mostra le impostazioni delle preferenze
Consentio.showPreferences()

Ottenere lo stato del consenso

JavaScript 
// Ottieni lo stato attuale del consenso
const consent = Consentio.getConsent()
// { necessary: true, analytics: false, marketing: false, functionality: false }

// Verifica una categoria specifica
if (consent.analytics) {
  // Esegui gli script di analytics
  loadGoogleAnalytics()
}

if (consent.marketing) {
  // Esegui gli script di marketing
  loadFacebookPixel()
}

Aggiornare il consenso

JavaScript 
// Aggiorna categorie specifiche
Consentio.updateConsent({
  analytics: true,
  marketing: false
})

Listener di eventi

Reagisci ai cambiamenti del consenso usando i listener di eventi:

JavaScript 
// Opzione 1: usando onConsentChange
Consentio.onConsentChange((consent) => {
  console.log('Consenso cambiato:', consent)

  if (consent.analytics) {
    loadGoogleAnalytics()
  }

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

// Opzione 2: usando un listener di eventi sulla window
window.addEventListener('consentio:consent', (event) => {
  const consent = event.detail
  console.log('Consenso cambiato:', consent)
})

Google Consent Mode v2

Consentio supporta automaticamente Google Consent Mode v2. Per garantire il corretto funzionamento, assicurati che il widget venga caricato prima di Google Analytics e degli altri script Google.

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

<!-- 2. Poi il 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>

Mappatura categorie e Consent Mode

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

Blocco degli script

Per bloccare gli script prima che il consenso venga concesso, usa l'attributo type="text/plain" insieme all'attributo dati data-category:

HTML 
<!-- Lo script si esegue solo dopo che il consenso analytics viene concesso -->
<script type="text/plain" data-category="analytics">
  // Codice Google Analytics
  gtag('config', 'G-XXXXXXX');
</script>

<!-- Lo script si esegue solo dopo che il consenso marketing viene concesso -->
<script type="text/plain" data-category="marketing">
  // Codice Facebook Pixel
  fbq('init', 'XXXXXXX');
</script>

<!-- Lo script si esegue solo dopo che il consenso functionality viene concesso -->
<script type="text/plain" data-category="functionality">
  // Codice di personalizzazione
  initPersonalization();
</script>

Categorie disponibili

Categoria Descrizione
necessary Cookie necessari (sempre consentiti)
analytics Cookie di analytics
marketing Cookie di marketing
functionality Cookie funzionali per la personalizzazione

Pulsante per aprire le preferenze

Inserisci un pulsante sul tuo sito web per riaprire le preferenze sui cookie (richiesto dal GDPR):

HTML 
<!-- Nel footer del sito -->
<a href="#" onclick="Consentio.showPreferences(); return false;">
  Impostazioni Cookie
</a>

<!-- Oppure come pulsante -->
<button onclick="Consentio.showPreferences()">
  Gestisci Preferenze Cookie
</button>
Suggerimento: il GDPR richiede che gli utenti possano modificare le proprie preferenze in qualsiasi momento. Inserisci un link nel footer del sito o nella tua privacy policy.

Single Page Applications (SPA)

Per React, Vue, Angular e altri framework SPA, il widget funziona automaticamente. Il widget rileva i cambi di URL e si aggiorna di conseguenza.

JavaScript 
// Esempio: verifica dello stato del consenso al cambio di rotta (Vue Router)
router.afterEach(() => {
  if (window.Consentio) {
    const consent = Consentio.getConsent()
    if (consent.analytics) {
      // Gli script di analytics sono consentiti
    }
  }
})
ShoptetGoogle Tag Manager