Bước 1: Tạo tài khoản miễn phí phần mềm chat tawk.to

Truy cập trang chủ phần mềm tawk.to tạo tài khoản, Tawk.to sẽ gửi mail tự động chứa đoạn code script để gắn vào trang web của bạn để tawk.to có thể hoạt động trên website.

Bạn có thể truy cập vào trang web tawk.to để lấy code nếu không nhận được mail.

Đăng nhập vài tài khoản tawk.to

Truy cập admin

Điền thông tin trang web

Nhấn tạo

Bước 2: Cài đặt tawk.to lên web site bằng Google Tag Manager

Truy cập tài khoản Google Tag Manager
Tạo thẻ mới: loại thẻ HTML tùy chỉnh
Trình kích hoạt chọn Tất cả các trang (All page)

cai dat conversion

Dán đoạn code sau và thay ” https://embed.tawk.to/5916947b64f23d19a89b1f60/default ” bằng mã của bạn trong đoạn code tawk.to tạo.

Nếu không thấy được nội dung vui lòng like page để tiếp tục xem. Thank’s !

[sociallocker id=”20715″]

//paste your Tawk embed code here, without Script tags

var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();

(function(){

var s1=document.createElement(“script”),s0=document.getElementsByTagName(“script”)[0];

s1.async=true;

s1.src=’https://embed.tawk.to/5c527c74ab52840489/default’;

s1.charset=’UTF-8′;

s1.setAttribute(‘crossorigin’,’*’);

s0.parentNode.insertBefore(s1,s0);

})();

// Event Listener function section

// This will push predefined events exposed by the Tawk.to API into the dataLayer, which can be picked up via Google Tag Manager and forwarded onto any Tracking software, which can be connected to GTM

var dataLayerPush = function(event){

dataLayer.push({

‘event’: ‘tawk.to’,

‘eventAction’: event

});

console.log({

‘event’: ‘tawk.to’,

‘eventAction’: event

});

}

Tawk_API.onChatStarted = function(){

dataLayerPush(“Chat Started”);

};

Tawk_API.onChatMaximized = function(){

dataLayerPush(“Chat Window opened”);

};

Tawk_API.onChatMinimized = function(){

dataLayerPush(“Chat Window closed”);

};

Tawk_API.onChatHidden = function(){

dataLayerPush(“Chat Window hidden”);

};

Tawk_API.onChatStarted = function(){

dataLayerPush(“Chat started”);

};

Tawk_API.onChatEnded = function(){

dataLayerPush(“Chat ended”);

};

Tawk_API.onPrechatSubmit = function(data){

dataLayerPush(“Prechat form submitted”);

};

Tawk_API.onOfflineSubmit = function(data){

dataLayerPush(“Offline Chat submit”);

};

</script> [/sociallocker]

Bước 3: Tracking sự kiện bắt đầu chat, điện thông tin trước khi chat, offline chat tawk.to

3.1 Tạo biến lớp dữ liệu để ghi nhận sự kiện

Menu trái chọn biến.
Loại biến số chọn biến lớp dữ liệu.
Tên biến số eventAction (Trong đoạn code trên dataLayer.push({ ‘event’: ‘tawk.to’, ‘eventAction’: event }); đẩy sự kiện với tên tawk.to)
Đặt tên và lưu biến lại.

huong dan cai dat chuyen doi chat tawk bang google tag manager 05

3.2 Tạo trình kích hoạt (trigger) kích hoạt sự kiện sự kiện tawk.to

Menu trái chọn trình kích hoạt (trigger)
Tạo trình kích hoạt mới
Loại trình kích hoạt: Sự kiện tùy chỉnh
Tên trình kích hoạt: tawk.to
Đặt tên vào lưu lại

huong dan cai dat chuyen doi chat tawk bang google tag manager 06

3.3 Tạo thẻ đẩy sự kiện chat tawk.to về Google Analytics

Menu trái chọn thẻ (tag)
Tạo thẻ mới
Loại thẻ: Universal Analytics
Danh mục: tawk.to
Hành động: {eventAction} biến bạn vừa tạo bạn có thể nhấn + kế bên để hiển thị danh sách biến.
Nhãn: Bạn chọn Page Path để biết khách hàng chat ở bài nào trong trang web
Cài đặt Google Analytics: chọn biến GA nếu bạn chưa tạo biến có thể nhấn vào chọn biến cài đặt và tạo mới
Trình kích hoạt chọn: Tawk.to Trigger (trình kích họat vừa tạo)
Đặt tên thẻ và lưu thẻ.

huong dan cai dat chuyen doi chat tawk bang google tag manager 07

3.4 Kiểm tra cài đặt sự kiện chuyển đổi chat tawk.to đã hoạt động chưa?

Chọn xem trước trong Google Tag Manager

Quay lại website của bạn thử chat rồi xem thẻ tawk.to GA có hoạt động như hình bên dưới không nếu hoạt động thì bạn đã cài đặt thành công.

Annotation 2019 10 21 115909

3.5 Cài đặt sự kiện chat tawk.to trong Google Analytics

Truy cập tài khoản Google Analytics
Menu trái Anlytics chọn quản trị
Chọn Mục tiêu và tạo mới
Thiết lập mục tiêu: Tùy chỉnh
Mô tả mục tiêu: Đặt tên và chọn sự kiện
Chi tiết mục tiêu: danh muc -> tawk.to (giống khi bạn đặt khi tạo thẻ trong Tag Manager)
Lưu lại mục tiêu

cai dat gold

Bạn thắc mắc vì sao không điền tác vụ, nhãn như bên Google Tag Manager. Trong lúc tạo thẻ sự kiện chat tawk.to bạn tạo tác vụ và nhãn bằng biến số. Bạn có thể xem lại đoạn code đầu tiên khi tạo thẻ tawk.to tác vụ sẽ có 3 sự kiên khác nhau bắt đầu chat, điền form trước khi chat, điền form khi bạn offiline. Thay vì phải tạo 3 thẻ khác nhau theo 3 sự kiện trên mình tạo biến để lưu trữ tạm thời rồi đẩy về analytics.

huong dan cai dat chuyen doi chat tawk bang google tag manager 10