Kopier koden under. Den bruker bokmål og nettstedets egen /personvern.html. Endre disse to verdiene ved behov. Ikke legg til async eller defer på loaderen.
<script src="https://cookiehawk.com/loader.js" data-core="https://cookiehawk.com/cmp.js" data-lang="nb" data-policy-url="/personvern.html" data-strict-gtm="1"></script>
Vil du tilpasse utseendet, åpne bannerdemoen og kopier den komplette koden derfra.
Lim inn hele koden som første skript i nettstedets <head>, før GTM, gtag og andre skript. Loaderen lastes synkront fra den offentlige adressen i koden.
Endre data-policy-url="/personvern.html" til adressen til nettstedets egen personvernside. Koden henter banneret fra https://cookiehawk.com/cmp.js.
Et skript som ligger direkte i HTML, kan starte selv om loaderen er først. Merk derfor statiske sporingsskript som vist i punkt 2.
Attributter:
data-lang: nb | nn | sv | en (ellers auto fra <html lang>/nettleser)data-policy-url: lenke til personvernerklæringdata-policy: versjon av tekst/policy. Endres den, vises banneret på nyttdata-datalayer: navn på dataLayer hvis ikke dataLayerdata-strict-gtm="1": blokker selve GTM-containeren til samtykkedata-block-extra="host/sti=kategori,…": egne mønstrePrøv valgene i bannerdemoen.
Samme nøkler kan settes via window.CookieHawkConfig = { accent: "#0f5d4f", position: "br" } før loaderen (uten data-).
| Attributt | Verdier | Hva det gjør |
|---|---|---|
data-accent | CSS-farge (#0f5d4f, rgb(…)) | Farge på knappene «Avvis alle» og «Godta alle» (alltid like) og brytere |
data-accent-text | CSS-farge | Tekstfarge på knappene; tom = automatisk svart/hvit. Gir paret < 4,5:1 kontrast, overstyres det automatisk |
data-bg / data-text | CSS-farge | Kortets bakgrunn og tekst (overstyrer lys/mørk) |
data-radius | 0 til 24 | Hjørneradius i px (standard 16) |
data-position | bl br bc tl tr tc center | Plassering; center = midt på siden med svakt bakteppe (blokkerer ikke siden) |
data-layout | card bar mini | Lite kort (standard), stripe i full bredde eller diskret mini-pille |
data-buttons | solid outline | Fylte eller kantlinje-knapper. Begge knappene får alltid samme stil |
data-font | system inherit | Systemskrift eller nettstedets skrift |
data-shadow | on off | Skygge på kortet |
data-logo | URL på samme origin (http/https) | Liten logo (20 px høy) ved overskriften |
data-theme | auto light dark | Følger systemet (standard), lys eller mørk |
data-brand | 1 0 | Vis/skjul «Beskyttet av CookieHawk» |
På mobil bruker kort/stripe bunnark (unntatt layout=bar øverst). Mini bruker en liten pille nederst. Ingen innstilling kan gjøre «Avvis alle» mindre synlig enn «Godta alle».
Legg data-layout="mini" på loader-scriptet i snippet-en over, eller sett window.CookieHawkConfig = { layout: "mini" } før loaderen. Standard er fortsatt card. I WordPress velger du «Mini – diskret stripe» under Plassering / layout.
Prøv /demo.html?layout=mini eller /demo-mini.html?layout=mini; begge har en oppsettsvelger. Demovelgeren endrer ikke lagret samtykke. Har du allerede valgt, åpner du banneret med hjørneikonet.
Første lag viser kort formålstekst om funksjoner, statistikk og markedsføring, personvernlenke, likeverdige «Avvis»/«Godta» og den understrekede innstillingsknappen «Tilpass». Tilpass åpner formål, leverandører, personvernlenke og lagring av enkeltvalg. Etter et valg vises bare et ikon på 36 × 36 px. Mini holder seg nederst, også med position="center" eller topp-plassering; br/tr gir gjenåpningsikon til høyre, ellers venstre. Logo og leverandørmerke vises i utvidet lag når aktivert, ikke i pillen. Ingen bakgrunnsmaske eller fullskjerm; innstillingslaget er begrenset til 70 % av skjermhøyden og kan rulles.
Første lag sikter mot 50 px på brede skjermer og brytes over flere rader på mobil for å vise formål og personvernlenke før aksept. Ikonet er 36 px, også når cmp.js feiler. Pillen ligger 8 px fra bunnen pluss eventuell safe-area. Tekst er 12 px, valgknapper minst 36 px høye og like store. Ved tekstforstørrelse/smale skjermer brytes raden ved behov; lesbarhet og tilgjengelige valg går foran 56 px-målet. Farge-, tema-, radius-, skygge- og skriftvalg gjelder fortsatt. Tilgjengelighetskontroll må også gjøres med nettstedets faktiske farger/skrift og innhold.
Se prisoversikten for hva pakkene inkluderer.
Script som ligger direkte i HTML-en må merkes (loaderen kan ikke stoppe dem ellers):
<script type="text/plain" data-cookiehawk-cat="statistics" data-cookiehawk-src="https://www.googletagmanager.com/gtag/js?id=G-XXXX"></script>
Kategorier: functional | statistics | marketing.
<head>, før GTM. Ikke installer loaderen som Custom HTML inne i GTM.ad_storage, analytics_storage, ad_user_data og ad_personalization er denied. Valg oppdaterer disse verdiene. denied alene er ikke nettverksblokkering: Google-tagger med innebygd samtykkestøtte kan sende cookieløse signaler i avansert Consent Mode.data-strict-gtm="1". Merk også den statiske GTM-taggen, og fjern GTMs valgfrie noscript-iframe. Last aldri samme container fra både tema og programtillegg.<script type="text/plain" data-cookiehawk-cat="statistics|marketing" data-cookiehawk-src="https://www.googletagmanager.com/gtm.js?id=GTM-XXXX"></script>
Bytt GTM-XXXX med container-ID-en din. Containeren kan lastes når statistikk ELLER markedsføring tillates. Hver tagg i containeren må derfor kontrollere sin egen kategori.
cookiehawk.marketing (for statistikk: cookiehawk.statistics).cookiehawk_consent_update. Velg Some Custom Events, og krev at variabelen for riktig kategori er lik true. En trigger på bare hendelsesnavnet er feil: hendelsen sendes også ved «Avvis alle» og tilbakekalling.ad_storage, ad_user_data og ad_personalization for annonsetagger; analytics_storage for statistikk. Fjern eventuelle All Pages-triggere som omgår kategorikontrollen.denied, men en tagg som allerede kjører må også stoppes med leverandørens avmeldingsfunksjon eller en kontrollert ny sidelasting. Kontroller at ingen nye valgfrie kall fortsetter. Fjern allerede lagrede valgfrie cookies der oppsettet gir tilgang; blokkering alene sletter ikke all tidligere lagring.Se Googles samtykkekontroller og grunnleggende og avansert Consent Mode.
Last ned CookieHawk-programtillegget. I WordPress: Programtillegg → Legg til nytt → Last opp programtillegg. Velg ZIP-filen, installer og aktiver.
Åpne Innstillinger → CookieHawk Consent. Kontroller språk og adressen til personvernsiden. Bruk enten programtillegget eller manuell installasjon, slik at loaderen bare legges inn én gang. Test deretter nettstedet som beskrevet under.
Åpne nettstedet i en ny privat nettleserøkt. Kontroller banneret før valg, velg «Avvis alle», last siden på nytt og kontroller at valget huskes. Åpne innstillingene, gi samtykke og kontroller at de valgte tjenestene virker.
I nettleserens utviklerverktøy: åpne Network og behold loggen ved lasting. I GTM Preview kontrollerer du Consent og Tags Fired for hvert valg.
denied, og den merkede GTM-containeren er ikke hentet.false, Google-verdiene fortsatt denied, og Custom HTML-taggene har ikke kjørt. Gjenta etter ny sidelasting.analytics_storage er granted, de tre annonseverdiene er denied. Bare statistikktagger skal kjøre.Vises ikke banneret? Kontroller at loader.js og cmp.js svarer 200, at Content Security Policy tillater dem, at bare én installasjon finnes, og at nettleseren ikke allerede har et lagret valg. Mangler en tjeneste etter samtykke? Kontroller kategori, GTM-trigger og konsollfeil.
Bruk gratis forsidesjekk eller be om manuell test for å undersøke trafikken før og etter valgene. Undersøk eventuelle kall etter avvisning; fravær av funn er ingen juridisk godkjenning.
Banneret dekker ikke all trafikk: blant annet fetch/XHR/beacon/Worker, srcdoc, shadow DOM og sporing på serveren krever egne tiltak. Sporingsverktøy som omgår blokkering må håndteres i nettstedets oppsett. Se testmetodikken.