GTM으로 전화 이벤트 추적하기: GA4와 구글애즈 연동으로 전환율 극대화하기

구글 태그 매니저(GTM)를 활용한 전화 이벤트 추적과 GA4, 구글애즈 연동으로 전환율을 높이는 방법을 소개합니다. 웹사이트에서의 전화 추적, GTM 설정, GA4 이벤트 추적, 구글애즈 전환 연동까지 모든 과정을 상세히 알아보겠습니다.

전화 이벤트를 수신할려고 노력중인 섭케터

안녕하세요! 일하기 싫은 마케터, 섭입니다. 오늘은 제가 최근에 겪은 흥미진진한 마케팅 모험을 여러분과 나누고자 합니다. 커피 한 잔을 준비하시고, 편안히 읽어주세요!

 

 

GTM을 이용한 웹사이트 전화 추적의 필요성

---

✔️ 웹사이트에서 클릭으로 전화 연결이 불가능한 상황
✔️ 마케팅 채널별 전화번호 구분의 한계
✔️ CRM 툴과 GA4 연동의 어려움

GA4와 CRM 데이터로 분석중인 마케터 OO양. 정확한 데이터 분석은 마케팅 성과를 높일 수 있다.

여러분, 웹사이트에서 전화 전환을 추적하는 게 얼마나 까다로운지 아시나요? 모바일 앱에서는 클릭 한 번으로 전화가 연결되지만, 웹사이트는 그렇지 않죠. 이런 상황에서 어떻게 전화 이벤트를 추적할 수 있을까요? 저도 이 문제로 며칠 밤을 새웠답니다.

처음에는 마케팅 채널별로 다른 전화번호를 사용하고, CRM 툴의 데이터를 GA4에 연동하는 방법을 고려했어요. 하지만 우리 회사의 사정으로 이 방법을 사용할 수 없었죠. 그래서 저는 새로운 접근 방식을 생각해냈습니다.

GTM을 활용한 전화 이벤트 설정 방법

---

✔️ 전화 통화 시간 데이터 분석
✔️ 전화 시작과 취소 이벤트 설정
✔️ GTM에서 사용자 정의 HTML 태그 생성

전화가 들어오는 채널별 통화시간 분포 그래프. 채널별로 다양한 패턴을 보인다는 것을 알 수 있다.

먼저, 우리 회사의 전화 통화 시간 데이터를 분석했어요. 저희는 CRM admin에는 접근할 수 없었지만, 전환 통화 기록을 뽑을 수 있었어요. 이를 바탕으로 전화 시작과 전화 취소 이벤트를 설정했습니다.

GTM에서 전화 시작과 전화 취소 이벤트를 설정한 모습

 

GTM에서 두 개의 사용자 정의 HTML 태그를 만들었습니다. 하나는 전화 시작 이벤트, 다른 하나는 전화 취소 이벤트를 위한 것이죠. 코드는 다음과 같습니다.

javascript
// 전화 시작 이벤트
<script>
(function() {
  var startTime = Date.now();
  var timerInterval = setInterval(function() {
    var elapsedTime = Date.now() - startTime;
    if (elapsedTime >= 5000) { // 5초 = 5000밀리초
      dataLayer.push({
        'event': 'call_start',
        'conversion_time': Math.floor(elapsedTime / 1000)
      });
      clearInterval(timerInterval);
    }
  }, 1000); // 1초마다 체크
})();
</script>

// 전화 취소 이벤트
<script>
(function() {
  var startTime = Date.now();
  var timerInterval = setInterval(function() {
    var elapsedTime = Date.now() - startTime;
    if (elapsedTime >= 10000) { // 10초 = 10000밀리초
      dataLayer.push({
        'event': 'call_cancel',
        'conversion_time': Math.floor(elapsedTime / 1000)
      });
      clearInterval(timerInterval);
    }
  }, 1000); // 1초마다 체크
})();
</script>

---

위 코드는 아래에 단계적으로 설명해 볼게요.

전화 시작 이벤트:
a) 즉시 실행 함수(IIFE)로 시작합니다. 이는 전역 스코프를 오염시키지 않기 위함입니다.

javascript
(function() {
  // 코드 내용
})();

b) 시작 시간을 기록합니다.

javascript
var startTime = Date.now();

c) setInterval 함수를 사용하여 1초마다 실행되는 타이머를 설정합니다.

javascript
var timerInterval = setInterval(function() {
  // 타이머 내용
}, 1000);

d) 매 초마다 경과 시간을 계산합니다.

javascript
var elapsedTime = Date.now() - startTime;

e) 경과 시간이 5초(5000밀리초) 이상이면 'call_start' 이벤트를 dataLayer에 푸시합니다.

javascript
if (elapsedTime >= 5000) {
  dataLayer.push({
    'event': 'call_start',
    'conversion_time': Math.floor(elapsedTime / 1000)
  });
  clearInterval(timerInterval);
}

---

전화 취소 이벤트:
전화 취소 이벤트는 전화 시작 이벤트와 거의 동일한 구조를 가지고 있습니다. 주요 차이점은 다음과 같습니다:

a) 이벤트 발생 시간이 10초(10000밀리초)로 설정되어 있습니다.

javascript
if (elapsedTime >= 10000) {
  // 코드 내용
}

b) 푸시되는 이벤트 이름이 'call_cancel'입니다.

javascript
dataLayer.push({
  'event': 'call_cancel',
  'conversion_time': Math.floor(elapsedTime / 1000)
});

이 코드는 1초마다 사용자의 행동을 감지해 정교하게 동작합니다. 사용자가 페이지에 5초 이상 머물고 아무런 마우스 움직임이나 스크롤을 내리지 않는다면  'call_start' 이벤트가, 10초 이상 마우스 움직임이나 스크롤을 내리지 않는다면 'call_cancel' 이벤트가 발생하도록 설정했죠. (설정한 값과 관계없습니다. 보안을 위해 이렇게 설정했습니다.)

GA4에서 이벤트 추적 설정하기

---

✔️ GA4에서 이벤트 설정
✔️ 전환 이벤트로 지정
✔️ 세그먼트 생성

GA4에서 설정한 세그먼트를 설정한 모습. ❘ 경로는 GA4 > 탐색 > 세그먼트 탭 + 클릭

GTM에서 이벤트를 설정했다면, 이제 GA4에서 이를 추적해야 합니다. GA4에서 'call_potencial'와 'call_cancel' 이벤트를 설정하고, '유효한 전화 문의'를 세그먼트로 지정했어요.

이것은 'call_start' 이벤트가 발생했지만 'call_cancel' 이벤트는 발생하지 않은 사용자를 대상을 산정하기 위함입니다. 이것이 바로 우리가 원하는 진정한 전화 문의 고객이죠!

구글애즈와의 연동: 전환 추적의 완성

---

✔️ GA4 세그먼트를 구글애즈로 전송
✔️ 구글애즈에서 전환 액션 설정
✔️ 리마케팅 및 유사 잠재고객 활용

구글애즈 잠재고객 설정 ❘ 경로는 구글애즈 > 도구 > 공유라이브러리 > 잠재고객 관리자 > +버튼 클릭

이제 마지막 단계입니다. GA4에서 만든 세그먼트를 구글애즈로 전송했어요. 구글애즈에서는 이 세그먼트를 기반으로 전환 액션을 설정했습니다.

이렇게 설정한 전환 데이터는 리마케팅에 활용할 수 있고, 유사 잠재고객을 만드는 데에도 사용할 수 있어요.

결과 및 성과 분석

---

✔️ 전화 전환율 상승
✔️ 마케팅 ROI 개선
✔️ 데이터 기반 의사결정 가능

이 방법을 적용한 후, 우리 회사의 전화 전환율은 오를것이라고 예상되어요!

전번에도 전환 이벤트만 잘 잡아도 동일 성과 대비 마케팅 비용을 97% 감소시켜 마케팅 ROI도 크게 개선되었죠. 이제 우리는 정확한 데이터를 바탕으로 마케팅 전략을 수립할 수 있게 되었습니다. (해당 방법은 아래 글을 기반으로 성과를 보았습니다!)

자바스크립트와 GTM: 커스텀 이벤트로 구글태그매니저에서 전환 추적 완벽하게 구현하기

 

특히 인상적이었던 것은, 특정 통화 시간대에 전화 문의가 집중된다는 사실을 발견한 거예요. 이 정보를 바탕으로 전환 이벤트를 만들었는데, 전번과 같이 성과가 더 늘수 있을지 궁금하네요!

마무리

---

이렇게 GTM, GA4, 구글애즈를 활용한 웹사이트 전화 이벤트 추적 방법을 알아보았습니다. 처음에는 복잡해 보일 수 있지만, 한 번 익숙해지면 정말 강력한 도구가 됩니다.

여러분도 이 방법을 시도해보세요. 어려움이 있다면 언제든 댓글로 물어봐주세요. 알려줄 수 있어야 진짜 아는 거라는 것을 알거든요.

자, 이제 또 다른 재밌는 마케팅을 찾으러 가볼까요? 여러분의 성공을 항상 응원합니다! 다음에 또 재미있는 이야기로 찾아올게요. 안녕히 계세요!

---

오늘도 읽어주셔서 감사합니다. 뒷모습의 아름다움을 담는 섭, 디지비션 =)

 

사진 계정 : @digibition (Instagram)
커피 계정 : @supfo.od (Instagram)