# Google Tag Manager ## Introduktion Dette dokument beskriver kravene til opsætningen af detaljeret Google Analytics sporing på realmæglerne.dk. Sporingen vil i høj grad være afhængig af Google Tag Manager (GTM). GTM er et tredjeparts javascript-bibliotek med en grafisk brugergrænseflade. Det giver os mulighed for at konfigurere, hvordan og hvilke data der skal sendes til Google Analytics og andre 3.parter. Dette dokument fokuserer på datalaget, der skal implementeres på alle sider, og hvordan det skal opdateres, når brugere udfører bestemte handlinger. ## Opsætning af det indledende datalag Alle sider skal have datalaget instansieret i `<head>...</head>`. Det er vigtigt, at instansieringen finder sted *før* GTM-kodestykket. Det enkleste datalag (uden data) ville se sådan ud: ``` <head> <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; </script> <!-- Google Tag Manager --> <script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXXXXX'); </script> </head> ``` ## Opsætning af samtykketilstand (Consent Mode) For at sikre at sporingen følger det aktive og gældende ePrivacy derektiv benytter vi os af "Consent Mode for Google Tags". Dette sikrer at vi, trods brugerens afvisning af samtykke til sporing kan sende anonymiseret data til Google Analytics. Denne kode er kompatibel med Realmæglerns nuværende samtykke-løsning Cookie Bot. Dokumentation: https://developers.google.com/tag-platform/devguides/consent Koden placeres således: ``` <script> <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; </script> <!-- Consent Mode --> function gtag() { window.dataLayer.push(arguments); } gtag('consent', 'default', { ad_storage: 'denied', analytics_storage: 'denied', wait_for_update: 500, region: ['DA'] }); <!-- Google Tag Manager --> <script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXXXXX'); </script> </script> ``` ## Inkludering af mægler ID For at kunne diferentiere tracking på afdeling af sitet ønskes der af datalaget præsenteret den aktuelle afdeling. Forskellige afdelinger kan fx. ses af: https://www.realmaeglerne.dk/bolig/465-1228-willemoesgade-7-2-th https://www.realmaeglerne.dk/erhverv/bolig/901eu079-industrivej-22 ### Eksempel på datalag ``` <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'division': 'b2c', // 'b2c', 'b2b', 'project' ... }); </script> ``` ## Inkludering af mægler ID For at kunne opdele data til de enkelte mæglere skal vi af datalaget for enhver side have den specifikke mæglers ID angivet. Hvis en side ikke er specifikt knyttet til en mægler, skal feltet ikke ingå af datalaget. Skulle der være situationer hvor en enkelt side er delt blandt flere mæglere, er der herunder vist eksempel derpå: ### Eksempel på én mægler ``` <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'realEstateAgentId': '123', }); </script> ... ``` ### Eksempel på flere mæglere ``` <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'realEstateAgentId': [{'123','456'}] }); </script> ... ``` ## Inkludering af boliginformation For at kunne berige annoncering og tracking benyttes datalaget på boligvisninger til at inkludere relevante boliginformationer. De udstillede datapunkter er endnu ikke fastlagte. I fællesskab med Realmæglerne defineres disse; samt navngivningen af dem. **Eksempelbolig:** https://www.realmaeglerne.dk/bolig/223l7364-magnoliavej-20-1-tv **Eksempel på datalag:** ``` <!-- Datalaget --> <script> window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'propertyID': '223L7364' 'propertyType': 'Ejerlejlighed', ... }); </script> ``` ## Dynamisk opdatering af datalaget Ved brugerintaktioner på websitet ønsker vi at berige datalaget ved hjælp af `push`-metoden. En brugerintaktion kan være alt fra et klik på et banner, til en formularudfyldning. Hver gang vi udfører et `push` til datalaget i forbindelse med en brugerinteraktion, skal der være en `event`-nøgle, ellers vil GTM ikke kunne benytte denne interaktion til sporing. ### Eksempel på dynamisk opdatering af datalaget ved interaktion ``` <script> dataLayer.push({ 'event': 'formSubmission', 'formType': 'openHouse' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }); </script> ``` ## Event Tracking Ved alle relevante brugerinteraktioner der sker på sitet, skal der sendes et `push` til datalaget med en passende `event`-nøgle. Herunder en oplistning af de brugerinteraktion der ønskes opsat sporing på: ### Salgsopstilling #### Eksempel på formular https://www.realmaeglerne.dk/bolig/708-1638-skolegade-47d-st-midtbyen #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'propertyID' : '23422011', 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ### Salgsvurdering #### Eksempel på formular https://www.realmaeglerne.dk/bolig/708-1638-skolegade-47d-st-midtbyen https://www.realmaeglerne.dk/realmaeglerne/bestil-salgsvurdering #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'salesValuation' // greenSalesValuation 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` #### Information til SmartPage 1. Salgsvurderinger kan blive initieret og kan ske på mange forskellige destinationer. Det ønskes at alle salgsvurderinger, uagtet af placering, skal sende dette event til datalaget. 2. Salgsvurderinger deles op i henholdsvis grønne og almindelige salgsvurderinger. Vi foreslår at der tiløjes et "greenSalesValuation" der lader os differentiere konvertingerne. ### Åbent hus #### Eksempel på formular https://www.realmaeglerne.dk/bolig/501-4591-ullerupvej-12-ullerup #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'openHouse' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }); ``` ### Fremvisning #### Eksempel på formular https://www.realmaeglerne.dk/bolig/501-4591-ullerupvej-12-ullerup #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'presentation' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ### Video Fremvisning #### Eksempel på formular https://www.realmaeglerne.dk/bolig/23422011-noeddelunden-66-lille-smoerum #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'videoPresentation' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ### Boligsøgning #### Eksempel på formular https://www.realmaeglerne.dk/ #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'search' 'formData': [{ 'query': 'København S', 'type': 'Villa', 'minPrice': '500000', 'minPrice': '800000', ... }] }); ``` ### Bliv Guldkøber #### Eksempel på formular https://www.realmaeglerne.dk/guldkoeber/bliv-guldkoeber #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'goldBuyer' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ### Bliv Partner #### Eksempel på formular https://www.realmaeglerne.dk/bliv-partner #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'partner' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ### Opret bruger #### Eksempel på formular https://www.realmaeglerne.dk/min-konto/login-opret #### Eksempel på datalag ``` dataLayer.push({ 'event': 'formSubmission', 'formType': 'createUser' 'formData': [{ 'userName': 'John Doe', 'userEmail': 'john@doe.com', 'userPhone': '22513179', 'userZipcode': '2300', 'userCity': 'København S', 'userCountry': 'Denmark' ... }] }] }); ``` ## Google Tag Manager Container til Staging / Udvikling ``` <!-- Google Tag Manager --> <script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-TX3HLZM'); </script> <!-- End Google Tag Manager --> ``` ## Privatlivspolitik / GDPR * 1260 er ikke juridske rådgivere og nedenstående skal derfor ses i lyset heraf. * Der ønskes følgende brugeroplysninger præsenteret af datalaget og tilgængeligt for tracking: navn,email,telefon,postnummer, by og land. * Personhenførbare oplysninger fra datalget kan, hvis samtykke gives, sendes til Google Tag Manager og videre til Facebook til brug i Advanced Matching. * Værdierne sendes via SHA256-kryptering. * Uden samtykke til analyse og marketing sendes denne data ikke. * Denne krypterede data kan, efter videregivelse til annonceplatformene, ikke tilbagetrækkes. Hvorfor 1260 ikke opsætter denne forbindelse uden samtykke fra Realmæglerne. ## Tracking af Jyske Bank-links Alle links der peger på Jyske Bank, som nedenstående, skal trackes. Vi ønsker at der tilføjes en ekstra URL-paremeter der afgør hvor linket er placeret på websitet. Vi foreslår at links som følgende: https://www.jyskebank.dk/bolig/regn-paa-bolig/hvor-meget-kan-jeg-koebe-bolig-for?partnerId=REM100 ... får en "placement" url-parameter med værdien for placering https://www.jyskebank.dk/bolig/regn-paa-bolig/hvor-meget-kan-jeg-koebe-bolig-for?partnerId=REM100&placement=popup ## Vigtigt om opsætningen * Al navngivning sker på engelsk. * Al navngivning sker med `camelCase`. * En samlet liste af eventnavne og nøgler skal foreligges samt en oversættelse af hvilket konverteringspunkt de er forbundet med. * Flere formularer har adskillige placeringer gennem sitet.