填充 Google 跟踪代码管理器数据层时出现问题

Question

在过去的几天里，我一直在尝试在单击按钮 "Add to Cart" 时填充 OpenCart 产品页面上的 Google 跟踪代码管理器数据层。

我知道我需要使用 push 方法，但我不知道在哪里嵌套它，因为我没有 HTML 按钮只有一个 JavaScript 函数。

函数：

<script type="text/javascript"><!--
$('#button-cart').on('click', function() {
 $.ajax({
  url: 'index.php?route=checkout/cart/add',
  type: 'post',
  data: $('#product input[type=\'text\'], #product input[type=\'hidden\'], #product input[type=\'radio\']:checked, #product input[type=\'checkbox\']:checked, #product select, #product textarea'),
  dataType: 'json',
  beforeSend: function() {
   $('#button-cart').button('loading');
  },
  complete: function() {
   $('#button-cart').button('reset');
  },
  success: function(json) {
   $('.alert, .text-danger').remove();
   $('.form-group').removeClass('has-error');

   if (json['error']) {
    if (json['error']['option']) {
     for (i in json['error']['option']) {
      var element = $('#input-option' + i.replace('_', '-'));

      if (element.parent().hasClass('input-group')) {
       element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
      } else {
       element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
      }
     }
    }

    if (json['error']['recurring']) {
     $('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
    }

    // Highlight any found errors
    $('.text-danger').parent().addClass('has-error');
   }

   if (json['success']) {
    $('.breadcrumb').after('<div class="alert alert-success">' + json['success'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div>');

    $('#cart > button').html('<i class="fa fa-shopping-cart"></i> ' + json['total']);

    $('html, body').animate({ scrollTop: 0 }, 'slow');

    $('#cart > ul').load('index.php?route=common/cart/info ul li');
   }
  },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
 });
});

我把互联网翻了个底朝天，但没有找到解决办法。感谢任何帮助。

Answer 1

在您问题的代码中，您已经初始化了 "Add to cart" 按钮的点击处理程序。将您的数据层逻辑放入点击处理程序中。

$('#button-cart').on('click', function() {
    window.dataLayer = window.dataLayer || [];
    dataLayer.push({
        'event': 'button-add-to-cart-click'
    });
    // other code
});

填充 Google 跟踪代码管理器数据层时出现问题

Problems Populating the Google Tag Manager datalayer

html

javascript

opencart

google-tag-manager

google-datalayer