본문 바로가기
  • 사진, 커피, 그리고 광고를 좋아합니다
마케팅/디지털 마케팅

GA4 UTM 추적이 실시간 안보일 때 GTM으로 히든 이벤트 페이지 문제 해결하기

by 섭케터 2024. 10. 23.

마케팅 담당자라면 누구나 겪어봤을 GA4의 UTM 추적 문제. 특히 히든 페이지에서 발생하는 이벤트 페이지 추적이 실시간으로 보이지 않을 때가 있죠. 오늘은 제가 실제로 겪은 GTM 설정으로 이 문제를 해결한 방법을 공유해드립니다.

안녕하세요! 일하기 싫은 마케터, 섭입니다.

문제 상황: 히든 페이지의 UTM 추적이 안될 때


✔️ 히든 페이지에서 UTM 파라미터가 정상적으로 전달되지 않음
✔️ iframe을 사용한 페이지 구조
✔️ GTM은 설치되어 있으나 추적이 안되는 상황

최근 프로젝트에서 히든 페이지에서 UTM 파라미터가 제대로 추적되지 않는 문제를 겪었습니다. 부모 도메인에서 walla.my 도메인으로 연결되는 구조였는데, iframe 사용으로 인해 UTM 파라미터가 손실되는 현상이 있었죠.

 

문제 해결을 위한 코드 구현


✔️ dataLayer 활용한 UTM 추적
✔️ 페이지 로드 시 자동 데이터 수집

<script>
  window.dataLayer = window.dataLayer || [];
  window.onload = function() {
    const urlParams = new URLSearchParams(window.location.search);
    dataLayer.push({
      'event': 'page_view',
      'page_location': window.location.href,
      'page_path': window.location.pathname + window.location.search,
      'utm_source': urlParams.get('utm_source'),
      'utm_medium': urlParams.get('utm_medium'),
      'utm_campaign': urlParams.get('utm_campaign')
    });
    console.log('UTM Parameters pushed to dataLayer:', {
      'utm_source': urlParams.get('utm_source'),
      'utm_medium': urlParams.get('utm_medium'),
      'utm_campaign': urlParams.get('utm_campaign')
    });
  }
</script>

 


GTM 설정 최적화


✔️ GA4 구성 태그 확인
✔️ 변수 및 트리거 설정

GTM에서는 다음과 같은 설정이 필요합니다:

1.GA4 구성 태그 생성
측정 ID 입력
페이지뷰 자동 수집 활성화

2. 데이터 레이어 변수 설정
UTM 소스
UTM 미디엄
UTM 캠페인

3. 트리거 설정
페이지뷰 이벤트 설정
커스텀 이벤트 트리거 구성


데이터 확인 방법


✔️ 디버그 뷰 활용
✔️ 실시간 보고서 이해

처음에는 실시간 보고서에서 데이터가 보이지 않아 당황스러웠습니다. 하지만 디버그 뷰에서 데이터가 정상적으로 수집되는 것을 확인했죠. GA4는 데이터 처리에 5-30분의 지연시간이 있다는 것을 알게 되었습니다.

 

최종 해결책


✔️ 코드 구현
✔️ GTM 설정 최적화
✔️ 데이터 검증

이러한 과정을 통해 히든 페이지에서도 UTM 추적이 가능해졌습니다. iframe을 사용하는 페이지에서도 데이터 손실 없이 완벽한 추적이 가능해졌죠. 실시간 보고서와 디버그 뷰의 차이를 이해하고 나니, 데이터 추적에 대한 불안감도 해소되었습니다.

댓글