Digivinkki #5 Asenna ja ylläpidä seurantapikselit ja muut liitännäiset – Google Tag Manager


Mikä on Google Tag Manager? Kuka sitä tarvitsee?

Google Tag Manager vastaa seuraavankaltaisiin tarpeisiin: aloitimme remarketing-kampanjan, nyt pitäisi saada seurantapikseli sivuille, mutta miten? Haluan kokeilla Hotjar-palvelun käyttöä, mutta asentaminen tuntuu hankalalta. Verkkokauppamme konversio pitäisi saada aktivoitua kiitossivulla, mutta kaupassamme ei ole kiitossivua, pelkkä viesti, miten konversion saa käyttöön tällaisessa tilanteessa? Haluan, että Google Analytics seuraa erikseen käyttäjiä, jotka ovat lukeneet kaikki kolme tiedotetta ja täyttävät sen jälkeen yhteydenottolomakkeen. Haluan asentaa Search Consolen, Facebook-pikselin tai Google Analyticsin, mutta verkkosivujemme ylläpitäjä on hidas vastaamaan päivityspyyntöihin tai päivitysten teko maksaa kohtuuttomasti. Tai ei ole ketään, joka pystyisi päivittämään verkkosivujemme koodia.

Viimeinen tilanne, ei ole ketään, joka pystyisi päivittämään verkkosivujemme koodia, on jopa Google Tag Managerin tarjoaman avun ulkopuolella, ellei Tag Manageria ole aiemmin asennettu sivulle käyttöön. Jos Tag Manager on olemassa, kaikki aloituskappaleen toimenpiteet on mahdollista suorittaa, ilman koodaamista, tuiki tavanomaisilla tietojenkäsittelytaidoilla. Aloitetaan tutustumalla Google Tag Manageriin!

Tag Manager voi siis asentaa erilaisia palveluita sivuilleni? Miten se tapahtuu?

Tag Managerin aloitussivu näyttää tältä.

Google Tag Manager löytyy osoitteesta https://tagmanager.google.com. Se on Googlen tarjoama, ilmainen palvelu, jolla voit lisätä toimintoja verkkosivuihisi. Tag Manager toimii kuin kuorena, joka asennetaan verkkosivujesi koodiin. Kuoreen voi Tag Managerin käyttöliittymän kautta syöttää muita koodeja, jolloin Tag Manager on ainoa paikka, jossa sinun täytyy asioida saadaksesi esimerkiksi web-analytiikan käyttöön verkkopalvelussasi.

Tag Manager itsessään täytyy kuitenkin asentaa verkkosivujen koodiin. Google Analytics -seurantakoodin lisääminen verkkosivujen lähdekoodiin voi olla monille tuttu toimenpide. Tag Manager asennetaan samalla periaatteella.

Tag Managerin käyttöönotto

  1. Luo tili osoitteessa https://tagmanager.google.com
  2. Saat asennusohjeet: kaksi verkkosivuihisi lisättävää koodinpätkää, tai tunnistekoodin, esim GTM-5JQQ3LV
  3. Koodit tallennetaan verkkosivujesi sivupohjiin tai tunniste lisätään sisällönhallintajärjestelmääsi

Kohta kolme tarkoittaa jotakin seuraavista tavoista. Lopputulos on kaikissa sama: verkkopalvelusi jokaisella sivulla on Google Tag Manager tägi kertaa kaksi, toinen <head>-osiossa ja toinen <body>-osiossa.

  • Sisällönhallintajärjestelmässäsi saattaa olla valmiina paikka, johon voit syöttää tunnistekoodin. Tällainen löytyy muun muassa Mycashflowista, WordPressistä tai Drupalista. Tosin kahteen jälkimmäiseen kyseinen toiminto on ensin aktivoitava. Sisällönhallintajärjestelmä tuottaa tarvittavat koodilisäykset palveluusi automaattisesti.
  • Jos pääset käsiksi verkkopalvelusi sivupohjiin, lisää koodit <head>- ja <body>-osioihin.
  • Joissain palveluissa on mahdollista lisätä omia koodeja sivupohjiin graafisen käyttöliittymän kautta. Esimerkiksi Squarespacella ja Shopifyllä Tag Managerin koodin asentaminen onnistuu näin, ilman sivupohjien muokkaamista, tosin vain <head>-osioon. Tämä kattaa valtaosan käyttötarpeesta, tapauskohtaisesti se saattaa riittää.

Helpoin, nopein ja halvin (myös sinun aikasi on rahaa) tapa saada Google Tag Manager käyttöön saattaa kuitenkin olla että pyydät verkkosivujesi ylläpitäjää hoitamaan homman ja jakamaan käyttöoikeudet Google Accountillesi. Tämä saattaa olla viimeinen kerta, kun joudut pyytämään ylläpitäjää asentelemaan seuranta- ja analytiikkatägejä, sillä jatkossa saat asentelut itse hoidettua Tag Managerin kautta.

Tag Manager on asennettu. Mitä seuraavaksi?

Alussa kerroin, että Tag Manager on kuin kuori, johon voi syöttää uutta koodia verkkosivuillesi. Tämän lisäksi Tag Managerilla voi tehdä muutakin. Tag Manager seuraa verkkosivusi toimintaa tasolla, jossa metatietoja on mahdollista manipuloida. Tämä mahdollistaa esimerkiksi hyvin yksityiskohtaisten konversioiden luomisen. Bonuksena Tag Manager tunnistaa verkkopalvelusi automaattisesti Search Console -palvelulle.

Jos Search Console ei ole vielä käytössä, nyt on aika rekisteröidä se osoitteessa https://search.google.com/search-console/. Luomasi Tag Manager vahvistaa rekisteröinnin automaattisesti.

Tag Managerin logiikka eli mikä ihmeen Tag

Tag Managerilla voi tehdä vain yhdenlaisen asian: lisätä sivuille Tagin ja määritellä Triggerin, jolla Tag aktivoituu. Lisäksi voi tallentaa muuttujia Variables. Tagin ja Triggerin suhde tulee ymmärtää, jotta Tag Managerin logiikka aukeaa. Vaikka perusmekanismi on näin yksinkertainen, Tagin tai Triggerin ei tarvitse olla yksinkertainen, niiden yhdistelmällä voi tehdä monenlaisia asioista.

  • Tag: mitä tehdään, esimerkiksi ”lisää sivuille Google Analyticsin seurantakoodi”
  • Trigger: milloin tehdään, esimerkiksi ”ihan jokaiselle sivulle”

Tag on käytännössä aina koodinpätkä, joka lisätään sivusi lähdekoodin Triggerin määrittämällä hetkellä. Tag Managerin sisällä on runsaasti valmiita koodinpätkiä, sekä avoimia ”kuoria” joihin voit itse kirjoittaa mitä haluat, että tunnettujen verkkopalveluiden asennus- ja ohjauskoodeja, kuten Google Ads, LinkedIn ja Pinterest -tägejä.

Kohdasta Community Template Gallery löytyy määrätön määrä lisätägejä. Jostain syystä Facebookin tägit löytyvät vasta täältä (Facebookin koodit tosin toimivat suoraan tyhjällä Custom tägillä).

Tag Managerissa tehdyt muutokset täytyy aina muistaa lähettää sivuille

Aloitussivun oikeassa ylälaidassa on isot napit Preview ja Submit. Jos lisäät tägejä, etkä paina kumpaakaan näistä, sivuillasi ei tapahdu mitään. Jos klikkaat Preview, Tag Manager lähettää viimeksi muuttamasi tägit sivuille, mutta vain sinulle, siis tälle selaimelle jota nyt käytät. Jos klikkaat Submit, muutokset julkaistaan kaikille käyttäjille.

Asenna Google Analytics Tag Managerin avulla

Usein Google Analytics on käytössä vanhastaan. Tätä ei tule tietenkään hävittää. Google Analytics ja Tag Manager voivat olla molemmat asennettuina sivuillasi. Tag Manager ei kuitenkaan voi puuttua sellaisen Google Analyticsin asennukseen, joka on asennettu verkkosivujesi koodiin. Sujuvinta olisi, jos verkkosivujesi koodissa on vain ja ainoastaan Tag Manager ja kaikki muut lisäpalvelut asennetaan Tag Managerin kautta. Seuraavassa käydään läpi Google Analyticsin käyttöönotto Tag Managerin avulla.

Huomaa, että jos sinulla on jo Google Analytics asennettuna, sitä ei tarvitse asentaa uudelleen Tag Managerin kautta. Jos kuitenkin asennat, aiempi, suoraan koodiin tehty Google Analytics -asennus tulee poistaa. Web-analytiikka ei muutoin mittaa kävijöitä oikein.

Hanki ensin Google Analyticsin seurantatunniste rekisteröimällä verkkosivusi osoitteessa https://analytics.google.com. Jos olet siirtämässä olemassa olevaa Google Analytics -asennusta Tag Manageriin, löydät seurantatunnisteen Analyticstistä kohdasta Admin -> Property Settings -> Tracking ID.

Tag Managerissa tee seuraavaa:

  1. Klikkaa Tag Managerin aloitussivulla vasemman laidan valikosta Variables -> New
  2. Valitse muuttujan tyypiksi Google Analytics Setting
  3. Kohtaan Tracking ID tallenna Analyticsin seurantatunniste, eli se mikä näyttää tämän kaltaiselta U-12345678-9
  4. Nimeä muuttuja, esimerkiksi ”Google Analytics ID” -> Save
  5. Klikkaa Tag Managerin vasemman laidan valikosta Tags -> New
  6. Tag Configuration ja valitse tyypiksi Google Analytics: Universal Analytics
  7. Kohtaan Select Settings Variable… valitse tallentamasi ”Google Analytics ID”
  8. Triggeriksi valitaan All Pages
  9. Tagille on annettava nimi, esim ”Google Analytics seurantatägi”
  10. Lopuksi on muistettava lähettää muutokset verkkosivulle klikkaamalla oikeasta yläkulmasta Submit

Asenna muita palveluita käyttöön Tag Managerin avulla

Yllä kuvattiin Google Analyticsin asentaminen Tag Managerin avulla. Seurantapikselien ja esimerkiksi Hotjarin asentaminen tapahtuu samalla tavalla, paitsi että näistä ei yleensä ole tarpeen tallentaa muuttujaa.

  1. Klikkaa Tag Managerin vasemman laidan valikosta Tags -> New
  2. Tag Configuration ja valitse tyypiksi Custom code tai jos palvelusi löytyy listalta, esim Hotjar
  3. Täydennä tiedot. Jos Custom code, leikkaa-liimaa tähän koko koodi minkä sait upotettavalta palvelulta
  4. Triggeriksi valitaan esimerkiksi All Pages
  5. Tagille on annettava nimi, esim ”Hotjar asennus”
  6. Lopuksi on muistettava lähettää muutokset verkkosivulle klikkaamalla oikeasta yläkulmasta Submit

 

 

Lisätietoja

Yrityssalon digivinkit

Google Tag Manager

 

 

Julkaistu 2.11.2020 // Mainostoimisto Kuke

Pidätämme oikeuden muutoksiin.

 

Digivinkit ovat osa Coastal Bootcamp -hankkeen toimenpiteitä. Tavoitteena on edistää yritysten digitaitoja ja -osaamista.
Lue lisää hankkeesta täältä