Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
ÚPLNÉ ZÁKLADY
JAVASCRIPTU PRO
GOOGLE TAG MANAGER
ZA MARKETING MAKERS
MICHAL BLAŽEK
@BLAZEKMICHAL
PROČ JS V GTM
Kde je to v pořádku? Tvorba cookies, kódy zbožáků, timestamp a další
vlastní dimenze.
Kde je prasárna – sled...
LIMITACE
Blokování GTM
Nevíte, zda programátor neudělal změnu na webu
Nepřesnost – váš skript se načítá zevnitř GTM – musí...
SEZNAM
RETARGETING
ZASLÁNÍ NÁZVU
PRODUKTU DO FB
PIXELU
IDENTIFIKACE
CÍLOVÝCH SKUPIN
Na základě aktivity uživatele na web určíme, do jaké cílové skupiny uživatel patří,
a to ulož...
HEUREKA PIXEL
Z (ENHANCED) ECOMMERCE
<script>
var _hrq = _hrq || [];
_hrq.push(['setKey', ‚xxx']);
_hrq.push(['setOrderId'...
CJ – KONVERZE – IFRAME
KONVERZNÍ PIXELY
PŘEČTENÍ ID TRANSAKCE Z
THANK YOU PAGE A ÚPRAVA
PRVKŮ
var idtransakce;
idtransakce =
$('.tableDefault:not(".tableOrderDeta...
MĚŘENÍ E-MAILŮ MIMO
KONTAKTNÍ FORMULÁŘE
http://www.michalblazek.cz/post/121534340593/merit-
konverze-z-emailu-analytics
• ...
ONCE USER-ID – ALWAYS
USER-ID – SIMO AHAVA
https://www.simoahava.com/gtm-tips/once-userid-always-
userid/
Super skript.
Al...
FILTRY - ZMĚNA
FILTRY - ZMĚNA
<script>
// Skript byl výrazně zjednodušen proti prezentovanému. Principem je
// využití .change – změny po...
PRVKY, KTERÉ SE
PŘIDAJÍ DO WEBU AŽ PO
NAČTENÍ
Je možné odposlechnout podobnými skripty. Sledujeme
změnu DOM.
$("body").on(...
FB – ADDTOCART A
DALŠÍ UDÁLOSTI
FB – VLASTNÍ
UDÁLOSTI
http://www.michalblazek.cz/post/145113577553/vlastni-
udalosti-facebook-pixel
ENHANCED ECOMMERCE
FUNNEL PRO SLUŽBU
• Kód byl skryt. Pokud jej chcete,
napište mi a pošlu více info.
• V GTM je vytvořený...
SKLIK KONVERZNÍ
KÓD BEZ GTM
http://www.michalblazek.cz/post/131553058703/sklik-
konverze-contact-form-7-wordpress
Využívej...
VYUŽITÍ IF, INDEXOF
// Užitečné, když například nemáte naimplementovaný správně pagetype.
// Na základě obsahu URL můžete ...
JSON STRINGIFY –
JSON PARSE
// Do cookies můžete uložit pouze text. Abyste objekt uložili do
// cookies, musíte jej změnit...
SCROLL TRACKING
http://scrolldepth.parsnip.io/
YOUTUBE TRACKING
http://www.lunametrics.com/blog/2015/05/11/updated-
youtube-tracking-google-analytics-gtm/
DOTAZY? 
MICHAL BLAŽEK
MICHAL@MARKETINGMAKERS.NET
728 729 312
DĚKUJI ZA
POZORNOST
MICHAL BLAŽEK
MICHAL@MARKETINGMAKERS.NET
728 729 312
You’ve finished this document.
Download and read it offline.
Upcoming SlideShare
What to Upload to SlideShare
Next
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

0

Share

JavaScript v GTM - Measure Camp Brno 2017

Download to read offline

Prezentace o využití JavaScriptu v GTM na Measure Campu v Brně.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

JavaScript v GTM - Measure Camp Brno 2017

  1. 1. ÚPLNÉ ZÁKLADY JAVASCRIPTU PRO GOOGLE TAG MANAGER ZA MARKETING MAKERS MICHAL BLAŽEK @BLAZEKMICHAL
  2. 2. PROČ JS V GTM Kde je to v pořádku? Tvorba cookies, kódy zbožáků, timestamp a další vlastní dimenze. Kde je prasárna – sledování věcí z webu, které by měl poslat vývojář. Proč? • Programátor je neschopný nebo nestíhá • Programátor je drahý • Platforma není rozšiřitelná – každá úprava je problém • Požadavek na rychlou implementaci • Často B2B podniky nebo korporáty s IT v zahraničí ALE! Když to jen trochu půjde, nechte to dělat vývojáře klienta!
  3. 3. LIMITACE Blokování GTM Nevíte, zda programátor neudělal změnu na webu Nepřesnost – váš skript se načítá zevnitř GTM – musí se tedy nejdřív načíst GTM a až poté začne skript fungova Doporučuji skripty pouštět při gtm.load Riziko můžete limitovat opatrností – vždy testujte, zda využívaná funkce existuje if(fbq), if(ga), if(window.jQuery) atd. Veškeré své skripty dokumentujte a oznamte to i programátorovi.
  4. 4. SEZNAM RETARGETING
  5. 5. ZASLÁNÍ NÁZVU PRODUKTU DO FB PIXELU
  6. 6. IDENTIFIKACE CÍLOVÝCH SKUPIN Na základě aktivity uživatele na web určíme, do jaké cílové skupiny uživatel patří, a to uložíme do cookies. Víme, že uživatel patřící k nějaké skupině se musí přihlásit do jiného systému než ostatní atd. var typ = ""; $("a[href*='stranka1.organizace.cz']").click(function() { typ = "typ1"; dataLayer.push({ 'event': 'identifikace', 'typ': typ }); });
  7. 7. HEUREKA PIXEL Z (ENHANCED) ECOMMERCE <script> var _hrq = _hrq || []; _hrq.push(['setKey', ‚xxx']); _hrq.push(['setOrderId', '{{transaction id}}']); var xs = []; var field = {{transaction products}}; for (var i=0;i<field.length;i++) { var namehr = field[i].name; var cenahr = field[i].price; var mnostvihr = field[i].quantity; // console.log(cenahr + " " + namehr + " " + mnostvihr); _hrq.push(['addProduct', namehr, cenahr, mnostvihr ]); } _hrq.push(['trackOrder']); (function() { var ho = document.createElement('script'); ho.type = 'text/javascript'; ho.async = true; ho.src = 'https://im9.cz/js/ext/1-roi-async.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ho, s); })(); </script>
  8. 8. CJ – KONVERZE – IFRAME KONVERZNÍ PIXELY
  9. 9. PŘEČTENÍ ID TRANSAKCE Z THANK YOU PAGE A ÚPRAVA PRVKŮ var idtransakce; idtransakce = $('.tableDefault:not(".tableOrderDetail") tr td').eq(1).text(); Pomocí jednoduchého jQuery můžete vyřešit i další problémy – zde drobná ukázka: https://www.w3schools.com/jquery/tryit.asp?filename=tryjqu ery_dom_html_set Např. Když programátor omylem nasadil slevu 30 % místo 20 %. Takto jsme opravili o víkendu.
  10. 10. MĚŘENÍ E-MAILŮ MIMO KONTAKTNÍ FORMULÁŘE http://www.michalblazek.cz/post/121534340593/merit- konverze-z-emailu-analytics • změna e-mailu na základě zdroje • kopírování obsahu http://www.michalblazek.cz/post/160155873078/m%C4%9B% C5%99te-akce-s-telefonn%C3%ADm-%C4%8D%C3%ADslem- a-e-mailem-na-webu • další akce nad telefonním číslem/mailem http://www.michalblazek.cz/post/142138534943/sledovani- odeslani-google-forms-v-google-analytics
  11. 11. ONCE USER-ID – ALWAYS USER-ID – SIMO AHAVA https://www.simoahava.com/gtm-tips/once-userid-always- userid/ Super skript. Ale! Pozor na ochranu soukromí uživatele. Uživatel vám nedal souhlas se sledováním, když není přihlášený. Řešte s právníkem klienta.
  12. 12. FILTRY - ZMĚNA
  13. 13. FILTRY - ZMĚNA <script> // Skript byl výrazně zjednodušen proti prezentovanému. Principem je // využití .change – změny pole $( "#filter-country") .change(function () { $( "#filter-country option:selected" ).each(function() { if( $( this ).val() === '' ) { zeme = ""; } else { zeme += $( this ).text() + " "; } }); dataLayer.push({ "zeme": zeme, "event": "filter" }); }); </script>
  14. 14. PRVKY, KTERÉ SE PŘIDAJÍ DO WEBU AŽ PO NAČTENÍ Je možné odposlechnout podobnými skripty. Sledujeme změnu DOM. $("body").on('DOMSubtreeModified', "mydiv", function() { dataLayer.push({ "event": "newsletter" }); }); https://stackoverflow.com/questions/15657686/jquery-event- detect-changes-to-the-html-text-of-a-div
  15. 15. FB – ADDTOCART A DALŠÍ UDÁLOSTI
  16. 16. FB – VLASTNÍ UDÁLOSTI http://www.michalblazek.cz/post/145113577553/vlastni- udalosti-facebook-pixel
  17. 17. ENHANCED ECOMMERCE FUNNEL PRO SLUŽBU • Kód byl skryt. Pokud jej chcete, napište mi a pošlu více info. • V GTM je vytvořený tag, který se spouští při daných eventech. • Např. • Nejedná se o spam – uživatel doscrolloval do 75 % • Vysoce zaujatý návštěvník – uživatel klikl na CTA tlačítka • Posílá se do Analytics jakou checkout action step • https://developers.google.com/ta g-manager/enhanced- ecommerce#checkoutstep
  18. 18. SKLIK KONVERZNÍ KÓD BEZ GTM http://www.michalblazek.cz/post/131553058703/sklik- konverze-contact-form-7-wordpress Využívejte hooky formulářů a funkcí
  19. 19. VYUŽITÍ IF, INDEXOF // Užitečné, když například nemáte naimplementovaný správně pagetype. // Na základě obsahu URL můžete určit. Můžete využít i pro content // grouping var path = document.location.pathname; var title = document.getElementsByTagName("title")[0].innerHTML; // if path contains /e/orders/, consider it as pageType=basket if (path.indexOf("/e/orders/") > -1) { event.pageType = "basket"; } if (title.indexOf("404") > -1) { event.pageType="error"; }
  20. 20. JSON STRINGIFY – JSON PARSE // Do cookies můžete uložit pouze text. Abyste objekt uložili do // cookies, musíte jej změnit na text. var kosik = { "basketItems": basketitemshelp, "basketTotal": total, "email": useremail }; setCookie("persoo_kosik", JSON.stringify(kosik), 360); var obsahkosiku = JSON.parse(obsahkosikuHelp);
  21. 21. SCROLL TRACKING http://scrolldepth.parsnip.io/
  22. 22. YOUTUBE TRACKING http://www.lunametrics.com/blog/2015/05/11/updated- youtube-tracking-google-analytics-gtm/
  23. 23. DOTAZY?  MICHAL BLAŽEK MICHAL@MARKETINGMAKERS.NET 728 729 312
  24. 24. DĚKUJI ZA POZORNOST MICHAL BLAŽEK MICHAL@MARKETINGMAKERS.NET 728 729 312

Prezentace o využití JavaScriptu v GTM na Measure Campu v Brně.

Views

Total views

1,327

On Slideshare

0

From embeds

0

Number of embeds

26

Actions

Downloads

5

Shares

0

Comments

0

Likes

0

×