target=_blank不适用GA出站链路跟踪

Question

我希望跟踪对出站链接的单击，并实现以下代码：

GA码

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

根据网站访问者是否选中复选框(然后将所选内容存储在cookie中)，我通过jQuery添加了jQuery属性。但是，如果我选择打开新窗口中的出站链接，它就无法工作。在勾选复选框时，它确实会将目标属性正确地添加到链接中，但当我单击该链接时，它会在同一个窗口中打开它。

具有目标属性的链接

<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

如果您要通过更改target=_blank来通过JavaScript更改页面URL，那么在链接上设置JavaScript“document.location”不会起到任何作用。

但是，您只需要在跟踪内部链接时使用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

只是想支持温尼伯上面的答案。不让我评论，但他的解决方案有效！

Google建议的代码(不适用于打开新选项卡中的链接)是：

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;”并在链接标记中更改“返回假”；将“返回真”改为“返回真”，并添加“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);}
   });
}

我只是将document.location = url;从https://support.google.com/analytics/answer/1136920更改为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>