Automatiske cookie- og privatlivspolitikker

Ingen synes, det er sjovt at skrive en cookiepolitik. Du gennemgår dine cookies i hånden, skriver en mur af juridisk tekst, oversætter den, sætter den ind på en side og håber så, at intet ændrer sig. Spoiler: det gør det altid. En udvikler tilføjer en ny analysepixel, marketing smider et retargeting-tag ind, og din omhyggeligt formulerede politik er forældet, før blækket er tørt.

Katla gør det anderledes: dine politikker genereres ud fra dine faktiske cookies, scannet, klassificeret og holdt synkrone automatisk.

Tre formater, én kilde til sandheden

Alle Katla-websites får automatisk genererede politikker i tre formater:

Formatet table er særligt nyttigt, hvis du allerede har en privatlivspolitik og bare har brug for en præcis og altid opdateret liste over cookies på dit website.

Indlejr med én snippet

Den hurtigste måde at få en politik på din side er JavaScript-embeddet. Tilføj to linjer HTML:

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

Det er det hele. Scriptet henter din seneste politik og renderer den i containeren. Når dine cookies ændrer sig, opdateres politikken automatisk, uden at du skal deploye igen.

Vælg et format

Tilføj query-parameteren format for at styre, hvad der renderes:

<!-- 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>

Vælg sproget

Katla understøtter 13 sprogvarianter direkte: engelsk, tysk, fransk, spansk, italiensk, hollandsk, portugisisk, svensk, norsk, dansk, polsk og finsk. Angiv sproget med en query-parameter:

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

Hvis der ikke er angivet et sprog, registrerer scriptet automatisk den besøgendes browsersprog og falder tilbage til engelsk.

Style den på din måde

Embeddet renderer ren semantisk HTML: overskrifter, afsnit, tabeller og lister. Der indsættes ingen CSS med egne holdninger, så politikken arver som standard dit websites eksisterende styling.

Vil du have mere kontrol, kan du konfigurere window.KatlaPolicy, før scriptet indlæses, og knytte CSS-klasser eller inline-styles til hver elementtype.

Med Tailwind eller utility-klasser

<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>

Med inline-styles

<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>

Du kan også kombinere de to: classes og styles anvendes sammen, når begge er sat for det samme element.

Brug SDK’et for fuld kontrol

Hvis du bygger med React (eller et hvilket som helst JavaScript-framework), giver SDK’et dig politikken som rå markdown, som du kan rendere, præcis som du vil:

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",
});

React-komponent

Pakken @katla/sdk indeholder en færdig React-komponent, der renderer markdown med understøttelse af GitHub Flavored Markdown (tabeller, gennemstregning osv.):

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

Fordi komponenten accepterer de almindelige komponent-overrides fra react-markdown, kan du sætte dine egne komponenter fra designsystemet ind:

<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>,
  }}
/>

Direkte URL’er til ethvert workflow

Hver politik findes også som en selvstændig fil, som er nyttig til links, download eller hentning fra en hvilken som helst backend:

Alle URL’er accepterer de samme query-parametre, locale og format. Brug markdown-URL’en til at trække den rå politik ind i et CMS, et dokumentationswebsite eller en mobilapp. Brug JSON-endpointet til at bygge din helt egen renderingslogik.

Altid præcis, altid opdateret

Den store fordel frem for håndskrevne politikker er, at din politik afspejler virkeligheden. Katla scanner dit website med en headless browser og finder cookies, der sættes af JavaScript, og ikke kun via HTTP-headere. Når en cookie tilføjes eller fjernes, opdateres din genererede politik, så den passer.

Ikke flere forældede politikker. Ikke flere manglende cookies. Ikke flere huller i compliance.

Kom i gang

1. Opret en konto på katla.app, og tilføj dit website
2. Kør en scanning for at finde og klassificere hver eneste cookie
3. Indtast dine virksomhedsoplysninger: navn, kontakt-e-mail og eventuelt e-mail til databeskyttelsesrådgiver (DPO)
4. Indlejr politikken med en snippet, SDK’et eller en direkte URL
5. Glem alt om den: din politik holder sig synkron, efterhånden som dit website udvikler sig

Klar til at holde op med at vedligeholde cookiepolitikker i hånden? Kom gratis i gang.