Installationsanvisningar
- Lägg till CookieTractor på webbplatsen
- Google Tag Manager (GTM) triggers och variabler
- Javascript events och funktioner
- Google Consent Mode
- CSP:Blocked
- Cookieinställningar för besökaren
- Anpassa utseendet
- Begränsa sidor som genomsöks för cookies
- Undanta cookiefrågan från en enskild sida
- Inaktivera video-wrapper
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. När den första genomsökningen av cookies är klar finns en översikt av de cookies som sätts under fliken Cookies i inställningsverktyget. Notera att det kan sättas fler cookies än de som hittats, så kontrollera att alla script hanteras.
Nedan följer instruktioner för hur script ställs in genom Google Tag Manager och Javascript-events:
Google Tag Manager (GTM) triggers och variabler vid User Consent
För att styra vilka script som ska laddas för respektive cookie-kategori behöver dessa kategoriseras. Vår cookie-ruta har automatiskt stöd för att trigga events i Google Tag Manager baserat på besökarens val. För att använda dessa behöver vi först addera "Triggers" som vi kan använda för våra "Tags".
Om du hellre vill importera inställningarna för triggers och variabler än skapa dem själv, så hittar du instruktionerna nedan.
Skapa följande triggers i Google Tag Manager:
Name |
Trigger Type |
Event Name |
---|---|---|
Consent - Necessary (All Pages) |
Custom Event |
cookies_necessary |
Consent - Statistical (All Pages) |
Custom Event |
cookies_statistical |
Consent - Marketing (All Pages) |
Custom Event |
cookies_marketing |
Uppdatera nu de taggar som kräver medgivande från användaren till att triggas med dessa triggers istället för tidigare triggers.
Observera att CookieTractor stödjer Google Consent Mode, de tjänster som stödjer den tekniken ska fortsätta gå mot All Pages i Google Tag Manager.
Har du behovet av att lyssna på händelser när en användare häver ett samtycke kan du skapa upp följande triggers och använda dem till dina taggar:
Name |
Trigger Type |
Event Name |
---|---|---|
Consent Revoked - Statistical (All Pages) |
Custom Event |
cookies_revoked_statistical |
Consent Revoked - Marketing (All Pages) |
Custom Event |
cookies_revoked_marketing |
Variabler för att kontrollera medgivande
I vissa fall kan man behöva kontrollera om en användare givit ett visst medgivande i sina "conditions" i Google Tag Manager. För att enklare komma åt informationen, addera User-Defined Variables för detta. Under "Variables" i GTM, lägg till följande:
CookieConsent_AllowMarketing
Name: CookieConsent_AllowMarketing
Type: Custom Javascript
Code:
function(){
return cookieTractor.consentGivenFor('marketing')
}
CookieConsent_AllowStatistical
Name: CookieConsent_AllowStatistical
Type: Custom Javascript
Code:
function(){
return cookieTractor.consentGivenFor('statistical')
}
Importera inställningar
Du kan importera den här JSON-filen i Tag Manager, under Admin/Container/Import Container.
- Packa upp zip-filen, och välj JSON-filen som fil att importera
- Välj ert befintliga/aktuella workspace
- Välj Merge för att lägga till inställningarna, istället för att ersätta dem
- Kontrollera att det ser rätt ut, och gå vidare genom att konfirmera ändringarna.
Filen innehåller alla triggers och variabler nämnda ovan. Var dock noggrann, då en import med override kommer att radera befintliga inställningar i containern.
Javascript events och funktioner vid User Consent
Om ni inte använder Google Tag Manager 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.consentGivenFor('statistical')){
console.log('Medgivande finns för statistik-cookies');
}
if (cookieTractor.consentGivenFor('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.consentGivenFor('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 Consent Initialization - 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.
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.
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.
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"
Support
Har ni frågor om installationen kontakta oss på info@cookietractor.com.