Kom i gang med PrivacyKit på minutter med lette webkomponenter som fungerer på tvers av rammeverk og statiske nettsteder.
Legg til PrivacyKit på nettstedet ditt ved hjelp av CDN-scripts eller ved å installere NPM-pakken. Velg metoden som passer for prosjektet ditt.
Legg til skriptene i nettstedets <head>. Fungerer med WordPress, Shopify, Wix og alle nettsteder som lar deg legge til HTML.
<html>
<head>
<!-- Legg til PrivacyKit-webkomponentene: consent-dialog, consent-guard, consent-missing, compliance-monitor -->
<script type="module" src="https://cdn.privacykit.eu/v1/privacykit.esm.js"></script>
<script nomodule src="https://cdn.privacykit.eu/v1/privacykit.js"></script>
<!-- Legg til PrivacyKit JavaScript-API for programmatisk tilgang til samtykke (valgfritt) -->
<script type="module" src="https://cdn.privacykit.eu/v1/index.esm.js"></script>
</head>
<body>
<!-- Legg til consent-dialog -->
<consent-dialog></consent-dialog>
</body>
<html>Start med et innebygd tema og en layoutvariant, finjuster deretter individuelle designtokens, eller tilpass dialogen fullt ut slik at den matcher merkevaren din.
<consent-dialog theme="standard" variant="standard"></consent-dialog>Innebygde temaer er basert på designtokens. Overstyr bare de tokenene du trenger for å skape et tilpasset utseende, samtidig som resten av det valgte temaet forblir intakt.
<consent-dialog variant="standard" theme="standard" style="
--pk-transparency: 0%;
--pk-bg-color: #faf7f2;
--pk-paper-color: #f7eede;
--pk-text-color: #3a3530;
--pk-text-color-on-primary: #212121;
--pk-primary-color: #b08968;
--pk-secondary-color: #d6c2b2;
--pk-focus-ring-color: #866346;
--pk-font-family: 'Segoe UI', Tahoma, sans-serif;
--pk-spacing-unit: 0.6rem;
--pk-control-border-color: #d6dbe4;
--pk-control-border-width: 3px;
--pk-control-border-radius: 10px;
--pk-dialog-border-color: #d6dbe4;
--pk-dialog-border-width: 3px;
--pk-dialog-border-radius: 20px;
--pk-dialog-max-height: min(70dvh, 500px);
--pk-dialog-shadow: 0 10px 20px rgba(0, 0, 0, 50%);
">
</consent-dialog>Bruk <consent-guard> til å kontrollere når tredjepartsskript og innebygd innhold kan lastes, basert på besøkendes samtykke. Du kan pakke inn hver enkelt sporer i sin egen Consent Guard, eller gruppere flere sporere som krever samme samtykke i én Consent Guard.
<!-- Legg til consent-guard(er) for å beskytte tredjepartsskript -->
<consent-guard consent="analytics">
<script type="text/plain" data-src="https://example.com/analytics.js?id=XXXXXX"></script>
</consent-guard>
<consent-guard consent="marketing">
<script type="text/plain" data-src="https://example.com/marketing.js?id=XXXXXX"></script>
</consent-guard>
Endre script-typen til text/plain, og erstatt src med data-src for håndterte ressurser. PrivacyKit gjenoppretter de opprinnelige attributtene og laster ressursen automatisk etter at nødvendig samtykke er gitt.
Plassering: Legg til Consent Guards i dokumentets <body> når det er mulig. Mange CMS-er og nettstedsbyggere lar deg bare legge inn egendefinerte skript i <head> — hvis dette gjelder plattformen din, plasserer du Consent Guard-en med skriptet den inneholder helt til slutt i <head>-seksjonen i stedet.
Pakk inn innebygd innhold, som <iframe>-elementer, direkte der det vises på siden. Bruk eventuelt <consent-missing> til å vise alternativt innhold inntil nødvendig samtykke er gitt.
<consent-guard id="yt-embed" consent="analytics+marketing">
<iframe data-src="https://www.youtube.com/embed/abc123"></iframe>
</consent-guard>
<consent-missing for="yt-embed">
<p>Vi trenger ditt samtykke til analyse- og markedsføringskapsler for å vise dette innholdet.</p>
</consent-missing>
Legg til PrivacyKit Compliance Monitor for å oppdage sporere, validere samtykkebeskyttelse og avdekke uadministrert aktivitet på nettstedet ditt — og gi utviklere og compliance-team tilgang til runtime-validering uten å påvirke brukeropplevelsen.
<body>
<!-- Legg til compliance-monitor for å kontinuerlig validere at samtykke håndheves -->
<compliance-monitor></compliance-monitor>
</body>Se PrivacyKit i aksjon med levende HTML- og React-eksempler.
Hver demo inneholder en Compliance Monitor for å inspisere sporerkjøring i sanntid, et Consent Test Panel for å simulere samtykkestatus og førstegangsbesøkende, og interaktive consent-guard-eksempler — som validerer at skript og innebygd innhold blokkeres eller tillates basert på samtykket brukeren gir. Begge har også en consent-dialog stilisert med design-tokens. HTML-demoen integreres via CDN script-tags som er kompatible med alle SSR-oppsett.
PrivacyKit inkluderer en 10-dagers prøveperiode som standard, slik at du kan integrere og teste plattformen før du aktiverer et abonnement.
Etter at prøveperioden utløper, fortsetter PrivacyKit å fungere i begrenset modus i stedet for å deaktivere eksisterende integrasjoner.
Aktiveringsstatus er tilgjengelig via JavaScript-API-et, logges i nettleserkonsollen under initialisering og kan også sjekkes via oppslaget for aktiveringsstatus.