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.

JavaScript v GTM - Measure Camp Brno 2017

689 views

Published on

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

Published in: Technology
  • Be the first to comment

  • 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

×