Hoppa till innehållet

Installations­anvisningar

Lägg till CookieTractor på webbplatsen

Börja med att inkludera CookieTractors script på webbplatsen. Ert specifika script finns i inställningsverktyget: välj tabben Installation och kopiera scriptet (observera att ni inte bör spara ner scriptet till er egen webbserver, då lösningen slutar fungera när vi gör framtida uppdateringar). Lägg in scriptet på alla sidor, så högt upp som möjligt inuti head-taggen. Placeringen är extra viktig 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 hur man ställer in 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 allowFunctional = event.detail.consents.indexOf(cookieTractor.category.functional) > -1;
  console.log('CookieConsentGiven::AllowFunctional', allowFunctional);

  var allowStatistical = event.detail.consents.indexOf(cookieTractor.category.statistical) > -1;
  console.log('CookieConsentGiven::AllowStatistical', allowStatistical);

  var allowMarketing = event.detail.consents.indexOf(cookieTractor.category.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 revokedFunctional = event.detail.consents.indexOf(cookieTractor.category.functional) > -1;
  console.log('CookieConsentRevoked::RevokedFunctional', revokedFunctional);

  var revokedStatistical = event.detail.consents.indexOf(cookieTractor.category.statistical) > -1;
  console.log('CookieConsentRevoked::RevokedStatistical', revokedStatistical);

  var revokedMarketing = event.detail.consents.indexOf(cookieTractor.category.marketing) > -1;
  console.log('CookieConsentRevoked::RevokedMarketing', revokedMarketing); 

}, false);

Ni kan även testa om ett medgivande redan är satt med kod:

if (cookieTractor.consent.contains(cookieTractor.category.functional)){
   console.log('Medgivande finns för funktionella-cookies');
}
if (cookieTractor.consent.contains(cookieTractor.category.statistical)){
   console.log('Medgivande finns för statistik-cookies');
}
if (cookieTractor.consent.contains(cookieTractor.category.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(cookieTractor.category.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>

Mer information om vårt SDK finns på sidan om JavaScript Reference!

Consent Mode v2 ä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 angett samtycke för användning. Utan medgivande kommer Google att genomföra en begränsad spårning av trafiken och eventuella konverteringar. Fördelen med Consent Mode är att man då kan se statistik och konverteringar trots att besökaren inte givit oss medgivande för cookies.

I dagsläget stöds Consent Mode v2 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 v2:

  • functionality_storage, vid medgivande för nödvändiga.
  • security_storage, vid medgivande för nödvändiga.
  • analytics_storage, vid medgivande för statistik.
  • ad_storage, vid medgivande för marknadsföring.
  • ad_user_data, vid medgivande för marknadsföring.
  • ad_personalization, vid medgivande för marknadsföring 
  • personalization_storage, vid medgivande för marknadsföring.

Vi uppdaterar automatiskt de underliggande APIerna i Google Consent Mode v2 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 v2. De taggar/script som stödjer Consent Mode v2 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 v2 fungerar med Google Analytics:

  1. Radera alla cookies och ladda om sidan.
  2. 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.
  3. I detta läge ska ingen cookie som börjar på _ga ha sparats på domänen.
  4. 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.

Det går också att använda Google Tag Assistant. Där går det att följa hela flödet med vilka samtycken som är lämnade när. 

Cookie-rutan kan öppnas igen av besökaren genom att klicka på en knapp eller länk. Den placerar ni någonstans på sajten, förslagsvis i sidfoten. Det finns två sätt att utforma den:

1. Infoga en knapp eller länk med class-attributet "cookie-consent-settings"

<button class="cookie-consent-settings">Inställningar för cookies</button> 
... eller:
<a href="javascript:void(0)" class="cookie-consent-settings">Inställningar för cookies</a>

2. Infoga en knapp eller länk som triggar clickeventet "cookieTractor.openConsentSettings()":

<button onclick="cookieTractor.openConsentSettings()">Inställningar för cookies</button> 
... eller:
<a href="javascript:cookieTractor.openConsentSettings()">Inställningar för cookies</a>
... självklart kan eventet läggas till på vilket klickbart element som helst med hjälp av javascript. 

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.

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 kan 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 > Crawler limits kan man ange ett RegEx uttryck som anger vilka sidor som ska ha begränsningar i sökningen efter cookies. Man anger sedan Crawl pages, vilket är hur många av dessa sidor som matchar RegEx uttrycket som ska genomsökas för cookies. Anger man den till 10 så kommer vi söka av de 10 första sidorna som hittas och ignorera resterande.

För att begränsa sidor som ligger under t.ex. shop/ så anger man uttrycket: shop\/*  

Man kan behöva begränsa sidor som har en query i URL:en, vilket 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 personuppgifts­policy 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"
data-disable-vimeo-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.