gtag.js 환경에서 구글 애널리틱스 전자상거래 추적코드

2017-12-27 by 편리

언제 변경이 됐는지는 모르겠는데 구글 애널리틱스 추적코드의 js 파일이 gtag.js로 변경됐다. 애널리틱스 사이트의 추적코드는 아래와 같이 표시된다.

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-1631115-6"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-1631115-6');
</script>

이전의 추적코드는 아래와 같다.

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-1631115-6', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

gtag.js 를 이용하는 추후에 추가되는 기능 등을 사용할 수 있다고 해서 변경을 했는데 전자상거래 추적이 되지 않는 오류가 있었다. gtag.js 에 맞는 전자상거래 정보 통보 코드로 변경해야만 했다. gtag.js 추적코드가 페이지 상단에 추가돼고 구매완료 페이지에 아래의 전자상거래 추적코드를 추가한다.

<script>
gtag('event', 'purchase', {
    "transaction_id": "<?php echo $transactionId; ?>",
    "affiliation": "NCUBE",
    "value": <?php echo $price; ?>,
    "currency": "KRW",
    "tax": <?php echo $tax; ?>,
    "shipping": 0,
    "items": [
        {
            "id": "<?php echo $itemId; ?>",
            "name": "<?php echo $itemName; ?>",
            "quantity": 1,
            "price": '<?php echo $price; ?>'
        }
    ]
});
</script>

하나의 주문에 상품이 여러 개라면 items 항목에 각 상품 정보를 추가해주면 된다. gtag.js 에서의 전자상거래 추적코드는 아래 사이트를 참고한다. https://developers.google.com/analytics/devguides/collection/gtagjs/enhanced-ecommerce

참고 : https://developers.google.com/analytics/devguides/collection/gtagjs/migration

Leave a Reply Cancel reply