Cookie policy e informativa privacy automatiche

Scrivere una cookie policy non è il passatempo preferito di nessuno. Fai l’inventario dei cookie a mano, butti giù un muro di testo legale, lo traduci, lo incolli in una pagina e poi preghi che non cambi niente. Spoiler: cambia sempre qualcosa. Uno sviluppatore aggiunge un nuovo pixel di analytics, il marketing inserisce un tag di retargeting, e la tua policy scritta con tanta cura è superata prima che l’inchiostro si asciughi.

Katla fa diversamente: le tue policy vengono generate dai cookie che usi davvero, scansionati, classificati e mantenuti allineati in automatico.

Tre formati, una sola fonte di verità

Ogni sito Katla riceve policy generate in automatico in tre formati:

Il formato table è particolarmente utile se hai già un’informativa sulla privacy e ti serve solo un elenco preciso e sempre aggiornato dei cookie del tuo sito.

Incorporala con un solo snippet

Il modo più rapido per avere una policy sulla tua pagina è l’embed JavaScript. Aggiungi due righe di HTML:

<div id="katla-policy"></div>
<script src="https://cdn.katla.app/{siteId}/policy.js"></script>

Tutto qui. Lo script scarica la tua policy più recente e la renderizza nel contenitore. Quando i tuoi cookie cambiano, la policy si aggiorna in automatico, senza bisogno di un nuovo deploy.

Scegliere un formato

Aggiungi il parametro di query format per decidere cosa viene renderizzato:

<!-- Full privacy + cookie policy (default) -->
<script src="https://cdn.katla.app/{siteId}/policy.js"></script>
 
<!-- Cookie policy only -->
<script src="https://cdn.katla.app/{siteId}/policy.js?format=cookie"></script>
 
<!-- Cookie table only -->
<script src="https://cdn.katla.app/{siteId}/policy.js?format=table"></script>

Impostare la lingua

Katla supporta 13 varianti linguistiche già pronte: inglese, tedesco, francese, spagnolo, italiano, olandese, portoghese, svedese, norvegese, danese, polacco e finlandese. Imposta la lingua con un parametro di query:

<script src="https://cdn.katla.app/{siteId}/policy.js?locale=de-DE"></script>

Se non specifichi una lingua, lo script rileva automaticamente la lingua del browser del visitatore e, in mancanza, usa l’inglese.

Lo stile lo decidi tu

L’embed renderizza HTML semantico semplice: titoli, paragrafi, tabelle ed elenchi. Non viene iniettato alcun CSS con scelte proprie, quindi per impostazione predefinita eredita gli stili che il tuo sito ha già.

Per un controllo maggiore, configura window.KatlaPolicy prima che lo script venga caricato, per associare classi CSS o stili inline a ogni tipo di elemento.

Con Tailwind o classi di utilità

<script>
  window.KatlaPolicy = {
    classes: {
      wrapper: "prose prose-slate max-w-none",
      h1: "text-4xl font-bold mb-6",
      h2: "text-2xl font-semibold mt-8 mb-4",
      p: "text-gray-600 leading-relaxed mb-4",
      table: "w-full border-collapse",
      thead: "bg-gray-100",
      th: "text-left p-2 font-medium",
      td: "p-2 border-b",
      a: "text-blue-600 underline hover:text-blue-800",
    }
  };
</script>
<div id="katla-policy"></div>
<script src="https://cdn.katla.app/{siteId}/policy.js"></script>

Con stili inline

<script>
  window.KatlaPolicy = {
    styles: {
      h1: "font-size: 2rem; color: #111;",
      h2: "font-size: 1.5rem; margin-top: 2rem;",
      p: "color: #444; line-height: 1.6;",
      table: "width: 100%; border-collapse: collapse;",
      th: "text-align: left; padding: 8px; background: #f5f5f5;",
      td: "padding: 8px; border-bottom: 1px solid #eee;",
    }
  };
</script>
<div id="katla-policy"></div>
<script src="https://cdn.katla.app/{siteId}/policy.js"></script>

Puoi anche combinarli: classes e styles vengono applicati insieme quando sono impostati entrambi per lo stesso elemento.

Usa l’SDK per il pieno controllo

Se sviluppi con React (o con qualsiasi framework JavaScript), l’SDK ti dà la policy come markdown grezzo da renderizzare come preferisci:

import { createKatlaClient } from "@katla/sdk";
 
const client = createKatlaClient({ siteId: "your-site-id" });
 
// Get the cookie table as markdown
const { markdown } = await client.getPolicy({
  locale: "en-GB",
  format: "table",
});

Componente React

Il pacchetto @katla/sdk include un componente React già pronto che renderizza il markdown con il supporto per GitHub Flavored Markdown (tabelle, testo barrato e così via):

import { KatlaPolicy } from "@katla/sdk/react";
 
export function CookiePolicyPage({ markdown }: { markdown: string }) {
  return (
    <KatlaPolicy
      markdown={markdown}
      className="prose max-w-3xl mx-auto"
    />
  );
}

Poiché il componente accetta gli override standard dei componenti di react-markdown, puoi sostituirli con i componenti del tuo design system:

<KatlaPolicy
  markdown={markdown}
  components={{
    h1: ({ children }) => <Heading size="xl">{children}</Heading>,
    table: ({ children }) => <Table variant="striped">{children}</Table>,
    a: ({ href, children }) => <Link href={href}>{children}</Link>,
  }}
/>

URL diretti per qualsiasi flusso di lavoro

Ogni policy è disponibile anche come file a sé, utile per linkarla, scaricarla o recuperarla da qualsiasi backend:

Tutti gli URL accettano gli stessi parametri di query locale e format. Usa l’URL markdown per importare la policy grezza in un CMS, in un sito di documentazione o in un’app mobile. Usa l’endpoint JSON per costruire una logica di rendering completamente personalizzata.

Sempre precisa, sempre aggiornata

Il vantaggio principale rispetto alle policy scritte a mano è che la tua policy rispecchia la realtà. Katla scansiona il tuo sito con un browser headless e rileva i cookie impostati da JavaScript, non solo quelli negli header HTTP. Quando un cookie viene aggiunto o rimosso, la policy generata si aggiorna di conseguenza.

Basta policy superate. Basta cookie mancanti. Basta lacune di conformità.

Inizia subito

1. Registrati su katla.app e aggiungi il tuo sito
2. Avvia una scansione per trovare e classificare ogni cookie
3. Configura i dati della tua azienda: nome, email di contatto ed email facoltativa del DPO
4. Incorpora la policy con uno snippet, l’SDK o un URL diretto
5. Dimenticatene: la tua policy resta allineata mentre il sito evolve

Pronto a smettere di aggiornare a mano le cookie policy? Inizia gratis.