javascript - target=_blank 不适用于 GA 出站链接跟踪

Question

我想跟踪出站链接的点击并实现以下代码：

通用代码

var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {'hitCallback':
     function () {
     document.location = url;
     }
   });
}

链接

<a class="postLinks" href="<?php if (get_field('source_link')) echo get_field('source_link'); ?>" onclick="trackOutboundLink('<?php if (get_field("source_link")) echo get_field("source_link"); ?>'); return false;"><?php the_title(); ?></a>

目标=_空白

我target=_blank通过 jQuery 添加属性，基于网站的访问者是否勾选复选框（然后选择存储在 cookie 中）。但是，如果我选择在新窗口中打开出站链接，它将不起作用。勾选复选框时，它确实将目标属性正确添加到链接中，但是当我单击链接时，它会在同一个窗口中打开它。

与目标属性的链接

<a class="postLinks" href="<?php if (get_field('source_link')) echo get_field('source_link'); ?>" onclick="trackOutboundLink('<?php if (get_field("source_link")) echo get_field("source_link"); ?>'); return false;" target="_blank"><?php the_title(); ?></a>

任何想法？

Answer 1

如果您通过 JavaScript 通过更改 document.location 来更改页面 URL，则在链接上设置 target="_blank" 不会做任何事情。

但是，您只需要在跟踪内部链接时使用 hitCallback。如果您有一个外部链接，因此 target="_blank"，您的原始选项卡将保持打开状态，并且 ga 跟踪事件将正常完成 - 您不必担心在加载新页面之前确保它完成。

所以我认为你想改变你的点击处理程序是这样的：

var trackOutboundLink = function(url, isExternal) {
    var params = {};

    if (!isExternal) {
        params.hitCallback = function () {
            document.location = url;
        }
    }
    ga('send', 'event', 'outbound', 'click', url, params);

    return isExternal;
}

当您将其附加为点击处理程序时

onclick="return trackOutboundLink(urlGoesHere, isExternalGoesHere)"

更具体的例子：

<a href="/" onclick="return trackOutboundLink('/', false)">An internal link</a>
<a href="http://www.example.com/" onclick="return trackOutboundLink('http://www.example.com', true)">An external link</a>

Answer 2

只是想支持上面温尼伯的一些人的回答。不允许我发表评论，但他的解决方案有效！

谷歌建议的代码（不能在新标签中打开链接）是：

var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {
     'transport': 'beacon',
     'hitCallback': function(){document.location = url;}
 });
}

：

<a href="http://www.example.com" onclick="trackOutboundLink('http://www.example.com'); return false;">Check out example.com</a>

但是，如果您更改“document.location = url;” 到“document.location = href;” 并在链接标签中，更改“return false;” “返回真”；并添加“target="_blank"，链接将在新选项卡中打开，并跟踪出站链接。

因此，有效的代码是：

var trackOutboundLink = function(url) {
  ga('send', 'event', 'outbound', 'click', url, {
    'transport': 'beacon',
    'hitCallback': function(){document.location = href;}
 });
}

：

<a href="http://www.example.com" onclick="trackOutboundLink('http://www.example.com'); return true;" target="_blank;">Check out example.com</a>

Answer 3

这将使所有链接在新窗口中打开：

    var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {
     'transport': 'beacon',
     'hitCallback': function(){window.open(url);}
   });
}

我只是从https://support.google.com/analytics/answer/1136920document.location = url;更改window.open(url); 代码

您还可以更改函数名称，一个用于新窗口链接，一个用于相同窗口链接。这会将第一行更改为：

var trackOutboundNewWindow = function(url) {

然后链接将是

<a href="http://www.example.com" onclick="trackOutboundNewWindow('http://www.example.com'); return false;">Check out example.com</a>

Answer 4

找到解决方案（截至 2016 年 2 月 6 日）

<script>
var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {
     'transport': 'beacon',
     'hitCallback': function(){document.location = href;}
   });
}
</script>

然后让你的链接看起来像这样......

<a href="http://www.example.com" onclick="trackOutboundLink('label name'); return true;" target="_blank">text</a>

Answer 5

trackedDRY - 使用 ' ' 类跟踪所有锚点。请注意，此代码对弹出窗口拦截器很敏感。window.open通话需要在通话之外ga。

/**
* Function that tracks a click on an outbound link in Analytics.
*/
$(function() {
    //only create event tracking if ga has loaded
    ga(function(){
        $("a.tracked").click(function(e) {
            var url = $(this).attr("href");
            var newWindow = ($(this)[0].target || '').toLowerCase() === '_blank';
            if(newWindow) {
                window.open(url, '_blank');
            }
            ga("send", "event", "outbound", "click", url, {
                "hitCallback": function () {
                    if(!newWindow) document.location = url;
                }
            });
            e.preventDefault();
        });
    });
});

Answer 6

这有效：

hitCallback': function(){window.open(url);}

希望事件跟踪不会受到任何影响。