Sve tajne dataLayer objekta – Google Tag menadžer

Prvi put sam se susreo sa dataLayer objektom čitajući rešenje Sima Ahave koristeći Google Tag menadžer.

Sva dokumentacija o tag menadžeru je počinjala i završavala sa dataLayer-om. Ekrani kojima se pokazivalo menjanje sadržaja i funkcionalnosti na samoj stranici web sajta su bili šuma informacija koje početniku ne znači ništa. Ali osećaj da tu nešto bitno i veliko postoji je bio itekako prisutan.

Google Tag menadžer

Google Tag menadžer je kao što ime kaže – upravljač tagovima (markerima) čiji je proizvođač Google. Na tržištu postoji nekoliko rešenja – kao što je Adobe, Tealium… Svi u suštini rade istu stvar i najbolje se integrišu sa ostalim alatima specifičnog proizvođača. Neke razlike možete pročitati ovde.

Sve se svodi na marketing (kako često spominjemo na treninzima) koji želi da ubaci određene stvari na web sajt (ili aplikaciju) i ima problema da to iskomunicira sa programerima. Tag menadžer ne isključuje programere (česta zabluda) već pomaže da marketing lakše komunicira sa programerima i daje im smislen posao. Sve ono šta krajnji korisnik (marketing) može da uradi, uradiće kroz Tag menadžer.

dataLayer

dataLayer je JavaScript objekat (šta je to JS objekat?) putem kojeg GTM (Google Tag Menadžer) komunicira sa informacijama koje šalju i primaju tagovi (markeri) na web sajtu (i aplikacije). Taj objekat može da ima i neko drugo ime, i najčešće se koristi u kompleksnim instalacijama GTMa. Držimo se osnova ili Back to Basics (referenca na Britni Spirs).

Tagovi (markeri) su parčići (ili samostojeći) HTML ili JavaScript koda koji imaju određenu funkciju na web sajtu.

Tag ili marker

Kada smo već počeli o tagovima ovo je lista tagova koji postoje predefinisani unutar GTMa.

Tagovi (markeri) unutar Google Tag menadžera

Verovatno ste prepoznali tagove za Google Analytics, AdWords, LinkedIn… ali to nije sve. Na primer ukoliko imate mogućnost da se oglašavate na Facebooku ili Twitteru, dobićete tzv programski kod koji je potrebno da postavite na websajt. Kao na primer ovako…

Facebook tag (marker) za sakupljanje podataka koji se šalju Facebooku

Ovakvim markerom (tag) šaljemo informacije Facebooku. Pre toga moramo i dati pravilo kada će ovaj tag da se „ispali“ (fire tag on…) i najčešća opcija je „All Pages“. Nema čekanja na programere kako je neophodno staviti GTM kod na web sajt i kroz interfejs GTMa bismo slali sve te tagove i upravljali istima.

Otud ono „upravljanje“ tagovima. Google Tag menadžer upravlja tagovima, kada će se ispaliti i kakve informacije će biti poslate tagovima.

Triggers – okidači

Štaaaa? Kakvi crni okidači? U pitanju je deo Google Tag menadžera kojim se upravlja pravilima kako će se tagovi „ispaljivati“. Osnovni okidač koji ćete imati je „All pages“, drugim rečima ispali tag na svakoj stranici koja se učita u browser.

Postoje i druge vrste okidača, kao na primer…

Google Tag menadžer okidači

Više o tome kako se okidači kreiraju i pravilno definišu prevazilazi ovaj već predug članak koji za temu ima dataLayer. Nekom drugom prilikom.

Ali ipak još nešto 🙂 – tajmeri, klikovi, slanje formulara, promena informacija na stranici i famozni događaji (events) su okidači koje možete da konfigurišete i koristite po volji. Zaustavljam se ovde – imamo još interesantnijih stvari.

Varijable ili promenjive

Da bi tagovi koje imamo unutar Google Tag menadžera mogli da šalju vrednosti (koje zavise od toga šta tagovi primaju od informacija) moramo da koristimo varijable ili promenjive vrednosti. Sam GTM po sebi hvata određene vrednosti na svakoj stranici koje su vam na raspolaganju u svakom trenutku na stranici.

Primer

Google Tag menadžer varijable

Da li ste primetili da Tag menadžer detektuje na šta je ko kliknuo, elemente, klase, ID-jeve!? Drugim rečima možete da hvatate informacije iz određenih polja i elemenata web stranice.

dataLayer – drugi put

Ovo je dataLayer

Kako izgleda dataLayer

Stani, stani… šta si sada uradio?

Otišao sam na stranicu jednog web sajta i pogledao sam jedan članak. Zatim sam unutar Chrome browsera aktivirao developer konzolu (Alt-J ili control-apple-J na meku). Slično postoji i u svim ostalim browserima. Zatim sam u konzolu otkucao dataLayer i pritisnuo Enter. I voila. Tu su informacije o dataLayer objektu, trenucima kada je šta poslato tom objektu i šta je sadržaj objekta (šta se nalazi).

Primetićete da su unutar tog objekta informacije o članku, meta tagovima, kategoriji članka, kakva je vrsta sadržaja, kakvo je vreme kod onog ko čita sadržaj (ove informacije automatski kreira plug-in WordPress-a – preporučujem Duracell Tomija).

Uz pomoć ovog plugina dataLayer objekat je popunjen informacijama koje bih inače morali da izvlačimo na neki drugi način (npr tzv scraping). Onda kada se informacije nalaze u dataLayer-u dostupne su Google Tag menadžeru da ih koristi kako god vi to želite.

Unutar dataLayer objekta možete da smestite i određene događaje na osnovu kojih želite da se nešto desi, kako Tag menadžer konstantno osluškuje šta se dešava u tom objektu. Ako vaš formular pošalje događaj „uspesno-poslat-email“ na osnovu toga možete da pošaljete informaciju Google Analitici da se desila npr poseta thankyou stranici za koju pratite konverzije. Voila.

Za sada toliko.

Pretplatite se na ekranu koji će izaći – da ne biste propustili nove informacije o tome kako da olakšate život sebi ako ste u marketing industriji (digitalnoj jelte).

Sumiranje svega napisanog

Posao marketara ili digitalnog specijaliste je previše kratak da bi trošio vreme na ping-pong sa programerima. Počnite da koristite Tag menadžer. U narednom periodu će biti još tekstova koji se tiču pojašnjenju osnovnih stvari koje treba da vam pomognu da počnete da koristite ovu sjajnu mašineriju.