未加星标

Four Killer Uses for hitCallback You Need to be Using… RIGHT NOW!

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二04 | 时间 2017 | 作者 红领巾 ] 0人收藏点击收藏

/

Google Analytics Google Tag Manager

Share on Facebook Share

0

Share on Twitter Tweet

1

Share on Google Plus Share

0

Share on LinkedIn Share

1


Four Killer Uses for hitCallback You Need to be Using… RIGHT NOW!

Firing tags in Google Tag Manager (GTM) in the correct order can be, at times, difficult. We always want our important tags to fire first, and often we have specific tags that should fire before or after another tag. GTM introduced a feature calledTag firing priority awhile ago, but that just rearranged when tags would start to load, not necessarily waiting for anything to complete in between.

Then came Tag Sequencing inside of Google Tag Manager, which is extremely helpful. Simo Ahava has a nice writeup of tag sequencing on his blog, and the feature has been an excellent addition to our arsenal of tools.

There’s another great feature that we can use, specifically when dealing with Google Analytics tags, that lets us wait for the Google Analytics command to finish and then executes something else immediately after. Imagine a swimming relay during the Olympics, where one swimmer waits patiently on the block for Michael Phelps to finish his leg of the relay. The next action cannot start until the first one completes.

Behold the hitCallback

The hitCallback is a whizzbang feature of Google Analytics (GA). It allows you to execute code after a hit is successfully sent to GA. One of the benefits of using the hitCallback is that it will work with on-page code, as well as in Google Tag Manager. In GTM, the hitCallback is configured in the ‘fields to set’ section of a GA tag.


Four Killer Uses for hitCallback You Need to be Using… RIGHT NOW!

Per GA’s Developer documentation the callback executes a function on success. In GTM, we can achieve this using a custom javascript variable that executes a function that returns another function we want to be run on success. It looks something like this:

function() { return function() { ... // insert code here } }

In the past, this has been handy, especially for lead generation sites. Whenever a user submits a form, the POST process is interrupted, the GA hit is sent and then the hitCallback allows the process to continue. The inner workings of this process can be found here.

Today, form submits can easily be handled using Google Tag Manager and its wait for tags and check validation .

Yet, that still leaves us with hitCallback. How else can we take advantage this great feature? (I’m so glad you asked!) One thing we can do is write or clear persistent data.

Get ready to dive in, below are a few examples: 1. Fetch and Send the Client ID

(CourtesyDan Wilkerson)

Getting the Client ID (CID) into GA can prove very beneficial in troubleshooting and analysis. However, if you try to access the Client ID before its been created and stored, then you won’t get any information.

We can use hitCallback to 1) wait until the pageview has been sent and then 2) send an event straight after the pageview sends. This way, if they are a new user we will receive their client ID immediately after the tracker is set and the pageview sends.

function() { return function() { if (!{{JS - ClientID}}) { dataLayer.push({ 'event': 'storeCid' }); } }; }

With this method we send a GTM event (storeCid) that triggers a GA Event tag (lots of different definitions of the word “event”, I know) that includes the CID as both a custom dimension and as an event label.


Four Killer Uses for hitCallback You Need to be Using… RIGHT NOW!

Here’s our client ID JavaScript:

// Because no tracker has been instantiated yet in certain situations, we parse the // _ga cookie directly function () { return {{Cookie - _ga}}.match(/\d+\.\d+$/)[0]; } 2. Establish Membership Values

Have a loyalty or rewards member program? Maybe you want to know when a user is logged in? Whenever some successfully signs up or signs in, we can establish a cookie that successfully registers them accordingly. Here, we are using LunaMetrics’ Cookie Management GTM Recipe to set these values:

function() { return function() { setStatus_('rewardsMember', {{memberLevel}}); // Sets Rewards Member Lever (Silver, Gold, etc.) setStatus_('loggedInUser', {{logInStatus}}); // Sets the Boolean value of logged in status function setStatus_(cookieName, status) { if(status) { dataLayer.push({ 'event': 'setCookie', 'attributes': { 'cookieName': cookieName, 'cookieValue': status, 'cookieDomain': 'www.myhostname.com', 'cookiePath': '/', 'cookieExpires': 730 // Number of days - provide a fraction for periods less than 24 hours } }); } } } }

We leverage hitCallback to initiate this dataLayer push after each successful GA pageview. We can then pick up this value as a 1st party cookie variable in GTM and (re)use this value as they return to the site.

3. Null Content Metadata

Infinite scrollcontent makes for great user engagement, but can prove problematic especially when using the data layer for sending contextual data to GA via GTM. Using data layer pushes will update prior information, but can allow preexisting values to carry over to the next pageview. If a custom dimension is set from the data layer on one hit, but you don’t want it to be set necessarily on subsequent hits, than you might need something like this.

For instance, suddenly an Author is given credit for content they didn’t write! Why not clear out those values using hitCallback?

function() { return function() { dataLayer.push({ 'event

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

分页:12
转载请注明
本文标题:Four Killer Uses for hitCallback You Need to be Using… RIGHT NOW!
本站链接:http://www.codesec.net/view/524069.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(21)