添加Google Analytics点击（事件）跟踪代码到Javascript window.open [英] Add Google Analytics Click (event) tracking code to Javascript window.open

问题描述

我的脑海中有以下Javascript：

  // EventTracking所需的Google Analytics代码< script type =文本/ JavaScript的>函数trackOutboundLink（link，category，action）{try {_gaq.push（['_trackEvent'，category，action]）; } catch（err）{} setTimeout（function（）{document.location.href = link.href;}，100）; } 
  

以下是我的正文：

  //激活社交书签
 $（。btn_fb）。click（function（）{
 window.open（）; 
返回false; 
}）; 
 $（。btn_tw）。click（function（）{
 window.open（http://twitter.com/home?status=Webpage Title+ document.URL +， Twitter，width = 660，height = 400，scrollbars = no; resizable = no）; 
 return false; 
}）; 
 $（。btn_li）。click（function（）{
 window.open（http://www.linkedin.com/shareArticle?mini=true&url=+ document .url +& amp; amp; title =网页标题;摘要=网页摘要，LinkedIn，width = 660，height = 400，scrollbars = no; resizable = no）; 
 return false; 
}）; $（'。btn_go'）。click（function（）{
 window.open（http://plus.google.com/share?url=+ document.URL，'GooglePlus'，'width = 660，height = 500，scrollbars = no，resizable = no'）; 
 return false; 
}）; 
 $（。btn_ma）。attr（href，mailto：？subject =网页主题&body;网页摘要+ window.location）; < /脚本> 
 
 // GA代码
< script type =text / javascript> 
 var _gaq = _gaq || []; 
 _gaq.push（['_ setAccount'，'UA-NNNNNN-1']）; 
 _gaq.push（['_ trackPageview']）; 
（function（）{
 var ga = document.createElement（'script'）; ga.type ='text / javascript'; ga.async = true; 
 ga.src =（ 'https：'== document.location.protocol？'https：// ssl'：'http：// www'）+'.google-analytics.com / ga.js'; 
 var s =文档.getElementsByTagName（'script'）[0]; s.parentNode.insertBefore（ga，s）; 
}）（）; 
< / script> 
  

以下是我的HTML：

 < div class =btn_fb>< / div> 
< div class =btn_tw>< / div> 
< div class =btn_li>< / div> 
< a class =btn_ma>< / a> 
< div class =btn_go>< / div> 
  

链接功能正常，但由于它们不是标签（除了.btn_ma），我无法添加Google Analytics按文档进行事件跟踪： https://support.google.com/analytics /回答/ 1136920？HL = EN-GB 。

有关最佳方法的任何建议吗？

解决方案

您可以将事件追踪添加到jQuery点击事件中。

  //激活社交书签
 $（。btn_fb）。click（function（）{
 window.open（）; 
 try {
 _gaq.push（['_ trackEvent'，{category}，{action}]）; 
} catch（err）{} 
 return false; 
}）; 
 
 $（。btn_tw）。click（function（）{
 window.open（http://twitter.com/home?status=Webpage Title+ document.URL + ，Twitter，width = 660，height = 400，scrollbars = no; resizable = no）; 
 try {
 _gaq.push（['_ trackEvent'，{category} ，{action}]）; 
} catch（err）{} 
 return false; 
}）; 
 
 $（。btn_li）。click（function（）{
 window.open（http://www.linkedin.com/shareArticle?mini=true&url =+ document.URL +& amp; amp; title =网页标题;摘要=网页摘要，LinkedIn，width = 660，height = 400，scrollbars = no; resizable = no）; 
尝试{
 _gaq.push（['_ trackEvent'，{category}，{action}]）; 
} catch（err）{} 
 return false; 
 }）; 
 
'（'。btn_go'）。click（function（）{
 window.open（http://plus.google.com/share?url=+ document.URL ，'GooglePlus'，'width = 660，height = 500，scrollbars = no，resizable = no'）; 
 try {
 _gaq.push（['_trackEvent'，{category}， {action}]）; 
} catch（err）{} 
 return false; 
}）; 
 $ b $（。btn_ma）。click（function（）{
 window.location =mailto：？subject =网页主题&body;网页摘要+ window.location 
 try {
 _gaq.push（['_ trackEvent'，{category}，{action}]）; 
} catch（err）{} 
 return false; 
}）; 
  

您会注意到我已将点击事件追踪添加到每个点击事件，因此当用户点击div，采取行动，然后跟踪分析。我还编辑了您的邮件点击事件，以便它可以跟踪。另一个想法是使用诸如分享此或 AddThis ，它内置了分析功能，可以链接到Google Analytics以及

I have the following Javascript in my head :

// Google Analytics code required for EventTracking <script type="text/javascript"> function trackOutboundLink(link, category, action) { try { _gaq.push(['_trackEvent', category , action]); } catch(err){} setTimeout(function() {document.location.href = link.href; }, 100); } 

And the following in my body:

// required to activate social bookmarks
$(".btn_fb").click(function() {
    window.open("");
    return false;
});    
$(".btn_tw").click(function() {
    window.open("http://twitter.com/home?status=Webpage Title"+document.URL+"", "Twitter", "width=660,height=400,scrollbars=no;resizable=no");
    return false;
});    
$(".btn_li").click(function() {
    window.open("http://www.linkedin.com/shareArticle?mini=true&url="+document.URL+"&title=Webpage Title;summary=Webpage summary", "LinkedIn", "width=660,height=400,scrollbars=no;resizable=no");
    return false;
});         $('.btn_go').click(function() {
    window.open("http://plus.google.com/share?url="+document.URL, 'GooglePlus', 'width=660,height=500,scrollbars=no,resizable=no');
    return false;
}); 
$(".btn_ma").attr("href", "mailto:?subject=Webpage Subject&body=Webpage summary" + window.location);  </script>

//GA Code
    <script type="text/javascript">
          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-NNNNNN-1']);
          _gaq.push(['_trackPageview']);
          (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();
        </script>

And the following in my HTML:

      <div class="btn_fb"></div>
      <div class="btn_tw"></div>
      <div class="btn_li"></div>
      <a class="btn_ma"></a>
      <div class="btn_go"></div>

The links function correctly but as they are not tags (except for .btn_ma) I cannot add Google Analytics Event Tracking as per documentation: https://support.google.com/analytics/answer/1136920?hl=en-GB.

Any advice about best approach here?

解决方案

You can add the event tracking to the jQuery click events.

// required to activate social bookmarks
$(".btn_fb").click(function() {
    window.open("");
    try { 
    _gaq.push(['_trackEvent', "{category}", "{action}"]); 
    } catch(err){}
    return false;
});  

$(".btn_tw").click(function() {
    window.open("http://twitter.com/home?status=Webpage Title"+document.URL+"", "Twitter", "width=660,height=400,scrollbars=no;resizable=no");
    try { 
    _gaq.push(['_trackEvent', "{category}", "{action}"]); 
    } catch(err){}
    return false;
});

$(".btn_li").click(function() {
    window.open("http://www.linkedin.com/shareArticle?mini=true&url="+document.URL+"&title=Webpage Title;summary=Webpage summary", "LinkedIn", "width=660,height=400,scrollbars=no;resizable=no");
    try { 
    _gaq.push(['_trackEvent', "{category}", "{action}"]); 
    } catch(err){}
    return false;
});         

$('.btn_go').click(function() {
    window.open("http://plus.google.com/share?url="+document.URL, 'GooglePlus', 'width=660,height=500,scrollbars=no,resizable=no');
    try { 
    _gaq.push(['_trackEvent', "{category}", "{action}"]); 
    } catch(err){}
    return false;
}); 

$(".btn_ma").click(function() {
    window.location = "mailto:?subject=Webpage Subject&body=Webpage summary" + window.location
    try { 
    _gaq.push(['_trackEvent', "{category}", "{action}"]); 
    } catch(err){}
    return false;
});

You'll notice I've added the click event tracking to each click event, so when the user clicks on the div, the action is taken, and then the analytics are tracked. I also edited your mailing click event so it can be tracked as well. Another idea is using a service like Share This or AddThis which have analytics built in and can link to Google Analytics as well

这篇关于添加Google Analytics点击（事件）跟踪代码到Javascript window.open的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！