Google Analytics (UA) and Google Tag Manager (GTM) Unleashed Part#1

facebooktwittergoogle_plusredditpinterestlinkedinmail

Google Analytics (UA) and Google Tag Manager (GTM)  Unleashed
Part #1 จะพูดถึงการ Set userId ใน UA และเชื่อมต่อกับ Google Tag manager
Part #2 จะพูดถึง Event Tracking

หลายคนที่ใช้ Google Analytics อย่างถึงกึ๋น น้อยมากถึงน้อยที่สุด
เพราะส่วนใหญ่ ก็จะใช้ค่า Default คือ Gen Tags แล้ว ติดเลย

Basic พื้นฐานการติด Google Tag Manager ให้ Work กับ Google Analytics

( GA ) Step#1 Setup Google Analytics ก่อน จะได้ รหัส UA-XXXXXXX-X กลับมา
( GA ) Step#2 ทำการเปิด userId
tracking-info

( GA ) Step#3 สร้าง Custom Dimension ชื่อว่า User ID scope User
user-id-custom-dimension

( GTM ) Step#4   Setup Google Tag Manager โดยการ Login เข้าไป Google Tag Manager(คนละ Website กับ Google Analytics)
ก่อนอื่นไปสร้าง  Variable
download

ทำตามภาพได้เลยให้  Enable Clicks ด้วยเพราะเราจะ Track Event Click หลังจากนั้นค่อยกด New
download (1)
หลังจากนั้นทำตาม Step ในภาพ
download (2)

( GTM ) Step#4 สร้าง Tag โดย Click ที่ปุ่ม Tag ซ้ายมือ แล้วเลือกตามภาพ โดยให้ เลือก Product เป็น Google Analytics, Tag Type เป็น Universal Analytics
ส่วน ช่อง 3 Configure Tag ให้ใส่ UA-XXXXXXX-X ที่ได้มาจาก Step 1
download (3)

( GTM ) Step#5  Copy Javascript Tag กดตามภาพ
download (4)
 หน้าตาของ Tag ประมาณนี้แต่เดี๋ยวก่อนจะไปติดทำตาม Step 6

<!-- Google Tag Manager --> <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXXX');</script> <!-- End Google Tag Manager -->

( GTM ) Step#6  Modify Code เพิ่มหน่อยก่อนนำไปติด

หน้าตาของ GTM เป็นประมาณนี้ userId เราเอามาจาก Server Side ก็ได้หรือ Cookies ตัวอย่างเอามาจาก PHP

//Server Side
<?php
if($isUserLoggedin){
$userId= $user->getUserId();
}
?>
//Client Side
<script>
  dataLayer = [{'userID': '<?php echo @$userId?>'}];
</script>

// GTM
<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXX');</script>
<!-- End Google Tag Manager -->
facebooktwittergoogle_plusredditpinterestlinkedinmail
The following two tabs change content below.

Be the first to comment

Leave a Reply

Your email address will not be published.


*