GTM으로 UTM 값 다루기

GTM 실무 · 읽는 데 약 6분

GA4만 쓰면 UTM은 리포트 안에만 있습니다. 그런데 실무에서는 “이 문의가 어느 광고에서 왔는지”를 CRM에서 보고 싶은 경우가 많습니다. 영업팀은 GA4를 안 봅니다.

구글 태그 관리자(GTM)를 쓰면 UTM 값을 꺼내 어디로든 넘길 수 있습니다.

1단계 — UTM 변수 만들기

GTM에는 URL 파라미터를 읽는 기본 변수 유형이 있습니다.

  1. GTM에서 변수 > 사용자 정의 변수 새로 만들기
  2. 변수 유형: URL
  3. 구성요소 유형: 검색어
  4. 검색어 키: utm_source
  5. 이름: URL - utm_source

같은 방식으로 utm_medium, utm_campaign, utm_content, utm_term 변수를 만듭니다.

여기서 끝나면 안 됩니다

URL 변수는 현재 페이지 주소에 UTM이 있을 때만 값을 읽습니다. 광고로 랜딩 페이지에 들어온 뒤 다른 페이지로 이동하면 UTM이 사라지고, 문의 폼은 대개 다른 페이지에 있습니다.

그래서 첫 진입 시점의 UTM을 저장해두는 단계가 필요합니다.

2단계 — 첫 진입 UTM을 저장하기

맞춤 HTML 태그를 하나 만들어 모든 페이지 트리거로 실행합니다.

<script>
(function () {
  var KEY = 'first_utm';
  try {
    if (sessionStorage.getItem(KEY)) return;
    var p = new URLSearchParams(location.search);
    if (!p.get('utm_source')) return;
    sessionStorage.setItem(KEY, JSON.stringify({
      source:   p.get('utm_source')   || '',
      medium:   p.get('utm_medium')   || '',
      campaign: p.get('utm_campaign') || '',
      content:  p.get('utm_content')  || '',
      term:     p.get('utm_term')     || ''
    }));
  } catch (e) {}
})();
</script>

세션이 유지되는 동안 첫 진입 UTM이 브라우저에 남습니다. sessionStorage를 쓰면 탭을 닫을 때 자동으로 지워져 개인정보 측면에서도 부담이 적습니다.

저장된 값을 읽는 변수

맞춤 자바스크립트 변수를 만듭니다. 파라미터마다 하나씩 필요합니다.

function () {
  try {
    var v = JSON.parse(sessionStorage.getItem('first_utm') || '{}');
    return v.source || '(none)';
  } catch (e) { return '(none)'; }
}

v.source 부분을 v.medium, v.campaign으로 바꿔 나머지도 만듭니다.

3단계 — 문의 폼에 실어 보내기

폼에 숨은 입력 칸을 미리 만들어 둡니다.

<input type="hidden" name="utm_source" id="utm_source">
<input type="hidden" name="utm_medium" id="utm_medium">
<input type="hidden" name="utm_campaign" id="utm_campaign">

GTM 맞춤 HTML 태그로 값을 채웁니다. 트리거는 폼이 있는 페이지 조회입니다.

<script>
(function () {
  try {
    var v = JSON.parse(sessionStorage.getItem('first_utm') || '{}');
    ['source', 'medium', 'campaign'].forEach(function (k) {
      var el = document.getElementById('utm_' + k);
      if (el) el.value = v[k] || '';
    });
  } catch (e) {}
})();
</script>

이제 문의가 접수될 때 유입 출처가 함께 넘어갑니다. CRM이나 메일 알림에서 “네이버 CPC / 가을세일”을 바로 볼 수 있습니다.

4단계 — GA4 이벤트에 붙이기 (선택)

GA4 이벤트에 맞춤 매개변수로 넘기면 탐색 보고서에서 함께 볼 수 있습니다. 다만 GA4는 이미 세션 소스/매체를 자체적으로 가지고 있으므로 대부분의 경우 불필요합니다. 중복 데이터를 만들지 마세요.

이 방식이 의미 있는 경우는 하나입니다 — GA4의 세션 기준과 다른 기준(첫 진입 기준)으로 보고 싶을 때입니다.

주의할 점

자주 묻는 질문

GTM에서 UTM 값을 변수로 만들려면?

변수 유형을 URL, 구성요소 유형을 검색어로 두고 검색어 키에 utm_source 같은 파라미터명을 넣으면 됩니다. 다만 이 변수는 현재 페이지 주소에 UTM이 있을 때만 값을 읽습니다.

다른 페이지로 이동하면 UTM이 사라집니다.

첫 진입 시점의 UTM을 sessionStorage에 저장하는 태그를 모든 페이지에 걸어두면 됩니다. 이후 맞춤 자바스크립트 변수로 저장된 값을 읽어 쓰면 페이지를 이동해도 유지됩니다.

문의가 어느 광고에서 왔는지 CRM에서 보려면?

폼에 히든 필드를 만들고 GTM으로 저장된 UTM 값을 채워 넣으면 됩니다. 문의 접수 시 유입 출처가 함께 전송되어 영업팀이 GA4를 열지 않고도 확인할 수 있습니다. 이 경우 개인정보처리방침의 수집 항목에 반영해야 합니다.

GA4 전환 설정 UTM 점검 순서