Installationsanvisningar
- Lägg till CookieTractor på webbplatsen
- Tagghanterare
- Javascript events och funktioner
- Google Consent Mode
- Cookieinställningar för besökaren
- Anpassa utseendet
- Infoga cookie-lista
- Begränsa sidor som genomsöks för cookies
- Undanta cookiefrågan från en enskild sida
- Inaktivera video-wrapper
- CSP:Blocked
- Javascript Reference
Lägg till CookieTractor på webbplatsen
Börja med att inkludera CookieTractors script på er webbplats. Ert specifika script finns i vårt inställningsverktyg. Välj tabben Installation för er sajt och kopiera scriptet. Placera detta script tidigt inuti head-taggen på sajten, detta är extra viktigt om ni förlitar er på att CookieTractor automatiskt ska byta ut filmer från YouTube eller Vimeo till versioner utan cookies. Av samma anledning bör vårt script inte laddas in via Google Tag Manager eller liknande verktyg.
När CookieTractor är på plats är det dags att konfigurera scripten som sätter cookies på webbplatsen så att dessa respekterar användarens val för samtycke. CookieTractor blockerar inte automatiskt några script, så det är viktigt att hantera alla script som sätter cookies på sajten. Under fliken Cookies i inställningsverktyget kan ni sätta igång en genomsökning för cookies på webbplatsen om detta inte gjordes när webbplatsen lades till. Notera att det kan sättas fler cookies än de som hittats, så kontrollera att alla script hanteras.
Vår lösning har inbyggt stöd för flera populära tagghanterare, läs mer om respektive lösning här:
Javascript events och funktioner vid User Consent
Om ni inte använder en tagghanterare kan ni använda vanliga JavaScript-events för att ladda in script baserat på besökarens val.
Följande kod reagerar på medgivanden från användaren:
window.addEventListener('CookieConsentGiven', function (event) {
console.log('CookieConsentGiven::PageEvent', event);
console.log('CookieConsentGiven::PageEvent::Consents', event.detail.consents);
var allowMarketing = event.detail.consents.indexOf('marketing') > -1;
console.log('CookieConsentGiven::AllowMarketing', allowMarketing);
}, false);
Vill ni lyssna på när en användare tar bort ett samtycke:
window.addEventListener('CookieConsentRevoked', function (event) {
console.log('CookieConsentRevoked::PageEvent', event);
console.log('CookieConsentRevoked::PageEvent::Consents', event.detail.consents);
var revokedStatistical = event.detail.consents.indexOf('statistical') > -1;
console.log('CookieConsentRevoked::RevokedStatistical', revokedStatistical);
var revokedMarketing = event.detail.consents.indexOf('marketing') > -1;
console.log('CookieConsentRevoked::RevokedMarketing', revokedMarketing);
}, false);
Ni kan även testa om ett medgivande redan är satt med kod:
if (cookieTractor.consent.contains('functional')){
console.log('Medgivande finns för funktionella-cookies');
}
if (cookieTractor.consent.contains('statistical')){
console.log('Medgivande finns för statistik-cookies');
}
if (cookieTractor.consent.contains('marketing')){
console.log('Medgivande finns för marknadsförings-cookies');
}
Här är ett exempel på hur man med vanilla events kan ladda ett javascript baserat på medgivande:
<script type="text/javascript">
window.addEventListener('CookieConsentGiven', function (event) {
if (cookieTractor.consent.contains('statistical')) {
var script = document.createElement('script');
script.src = "https://cdn.somewebsite.com/my-script.js"
// use another target than head if necessary
document.getElementsByTagName('head')[0].appendChild(script)
}
}, false);
</script>
Google Consent Mode
Consent Mode är en teknik från Google som gör det möjligt att använda vissa av Googles taggar och script utan att cookies sätts fram tills dess att användaren eventuellt givit sitt medgivande för denna användning. Utan medgivande kommer Google att genomföra en begränsad spårning av trafiken och eventuella konverteringar. Fördelen med detta är att vi då kan se statistik och konverteringar i våra verktyg trots att besökaren inte givit oss medgivande för cookies.
I dagsläget stöds Consent Mode av följande Google-produkter:
- Google Analytics
- Google Ads (Google Ads Conversion Tracking & Remarketing)
- Floodlight
Vår lösning stödjer alla de definerade Consent Types som finns inom ramen för Consent Mode:
- analytics_storage, vid medgivande för statistik.
- ad_storage, vid medgivande för marknadsföring.
- functionality_storage, vid medgivande för nödvändiga.
- personalization_storage, vid medgivande för marknadsföring.
- security_storage, vid medgivande för nödvändiga.
Vi uppdaterar automatiskt de underliggande APIerna i Google Consent Mode och detta fungerar både tillsammans med global site tags (gtag.js) och Google Tag Manager.
Komma igång:
För er som använder Google Tag Manager så rekommenderar vi fortfarande att ni implementerar och använder de Triggers som vi nämner ovan för alla Taggar/Script som inte har stöd för Google Consent Mode. De taggar/script som stödjer Consent Mode bör använda den inbyggda triggern All Pages, på så sätt laddas Taggen alltid in men anpassar sitt beteende baserat på besökarens medgivande.
Testa att Consent Mode fungerar med Google Analytics:
- Radera alla cookies och ladda om sidan.
- Nu ska du se vår cookie popup, och en request till *.google-analytics.com ska ha skickats med en querystring som inkluderar gcs=G100. Detta betyder att Analytics anropats men utan medgivande för cookies.
- I detta läge ska ingen cookie som börjar på _ga ha sparats på domänen.
- Klicka sedan på "Acceptera alla" i vår dialog-rutan. Inom ett par sekunder ska cookies med namnet _ga skapats vilket indikerar att analytics-taggen snappat upp det uppdaterade medgivandet och börjat använda cookies.
Cookieinställningar för besökaren
Cookie-rutan kan öppnas igen av besökaren genom att klicka på en länk. Länken placerar ni någonstans på sajten, förslagsvis i sidfoten. Det finns två sätt att utforma länken:
1. Infoga en länk med class-attributet "cookie-consent-settings"
<a href="javascript:void(0)" class="cookie-consent-settings">Inställningar för cookies</a>
2. Infoga en länk med href-attributet "javascript:cookieTractor.openConsentSettings()":
<a href="javascript:cookieTractor.openConsentSettings()">Inställningar för cookies</a>
När användaren ändrar sina inställningar raderas de cookies som går att radera från besökarens webbläsare baserat på de uppdaterade inställningarna. Tredjeparts-cookies kan vi inte radera, varför ni bör informera om hur dessa tas bort i webbläsaren på er sida om personuppgiftspolicy.
Anpassa utseendet
Cookie-frågan kan anpassas för att följa er grafiska profil. De vanligaste anpassningarna kan justeras i inställningsverktyget under fliken Design. Här kan ni ange typsnitt, justera den primära färgen samt ändra på rundningen på cookie-frågan och knapparna.
Vill ni justera andra delar av utseendet går det att skriva egen CSS-kod. I inställningsverktyget finns en inbyggd editor för detta ändamål. Alla designjusteringar är därmed möjliga att göra i inställningsverktyget; ni behöver inte lägga till CSS-kod på er webbplats.
Infoga cookie-lista
Det finns möjlighet att infoga en lista med alla era cookies på valfri sida på er webbplats. Under listan visas även användarens nuvarande samtyckesval. På sidan där cookie-listan ska visas behöver ett script läggas till. Sedan placeras en div-tagg ut där listan ska visas. Scriptet och div-taggen hittar ni under fliken Installation i inställningsverktyet.
Cookie-listan utgår från utseendet på er webbplats. Om sidan saknar CSS-egenskaper för typsnittet i html eller body-taggen kan texten se liten eller konstig ut. Det går att justera detta genom att ange CSS-kod under fliken Design. Man till exempel skriva { font-size: 18px; } för att sätt textens storlek till 18px. Givetvis går det även att justera andra egenskaper för ett mer anpassat utseende.
Begränsa sidor som genomsöks för cookies
Det är möjligt att begränsa vilka sidor på webbplatsen som ska genomsökas för cookies. Till exempel ett forum eller en webbshop, där man vet att cookies som sätts är samma för alla instanser av en given sidtyp. I inställningsverktyget under fliken Settings kan man ange ett RegEx uttryck som anger vilka sidor som ska begränsas för sökning. Man anger sedan hur många av de matchande sidorna som ska genomsökas för cookies.
För att begränsa sidor som ligger under t.ex. shop/ så anger man uttrycket: shop\/*
Man kan även behöva begränsa sidor som har en query i URL:en, vilket då kan göras med uttrycket: *\?*
Testa gärna RegEx uttrycket för att kolla att det fungerar som det ska, exempelvis på regex101.
Undanta cookiefrågan från en enskild sida
Man kan undanta en eller flera sidor där man inte vill att cookie-frågan ska visas. På så sätt kan exempelvis sidor med personuppgiftspolicy som länkas till från cookie-frågan visas utan att besökaren behöver lämna samtycke. Denna sida kommer då inte ladda något script som kräver samtycke. Man gör detta genom att skriva in css-klassen cc-hidden vart som helst i markupen på sidan, exempelvis i brödtext som kommer från ett CMS.
Inaktivera video-wrapper
CookieTractor byter automatiskt ut YouTube och Vimeo videos till varianter utan cookies. Vill ni inte använda denna funktionalitet kan den inaktiveras genom att lägga till följande attribut i CookieTractor script-taggen.
data-disable-youtube-wrapper="true"
CSP:Blocked
De servrar som har content-security-policy som blockerar anrop till icke tillagda värdar behöver godkänna både cdn.cookietractor.com och app.cookietractor.com. Den senare används för att logga statistik och hålla i referenser till givna samtycken.
Support
Har ni frågor om installationen kontakta oss på info@cookietractor.com.