Google Tag Manager 에서 Google Analytics 4 이벤트 추적 설정하기 (외부 링크 클릭 이벤트)

GTM 에서 외부 링크 클릭 이벤트(Outbound Click Event) 설정하기

1. 클릭 변수 활성화

• Google Tag Manager 에 로그인하고 변수(Variables) 섹션으로 이동
• 설정되지 않은 기본 변수(Built-in Variables)에서 클릭에 대한 기본 변수를 활성화 해줍니다.
  • Click Element
  • Click Classes
  • Click ID
  • Click Target
  • Click URL
  • Click Text
• 저장 후 GTM 의 미리보기(Preview) 모드를 실행하여, 클릭 변수들이 정상적으로 수집되는지 확인합니다.

‍

디버깅을 통해 변수가 잘 수집되는 것을 확인되었으면, 아래 단계를 이어 진행해보세요

2. 외부 링크 클릭 이벤트 트리거 만들기

본 블로그에는 Youtube, Github 에 대한 외부 링크가 포함되어 있습니다. Youtube 에는 공부, 코딩할 때 유용한 Lofi Music 을 곧 올려볼 예정입니다. Github 에는 SQL, Python 관련 프로젝트 들을 올리고 있습니다.

• GTM 에서 트리거(Triggers) 섹션으로 이동
• 새로 만들기(New Trigger) 버튼 클릭
• 트리거 유형을 Click → Just Links 로 선택
• 트리거 조건을 다음과 같이 설정 (이 설정을 통해 내부 링크가 아닌, 외부 링크 클릭만 추척합니다)
  • Click URL does not contain 'yourdomain.com'
• 트리거 이름을 설정하고 저장

3. GA4 이벤트 태그 생성하기

• GTM 의 태그(Tag) 메뉴에서 새 태그(New Tag)를 클릭
• 태그 유형(Tag Type) 을 Google Analytics: GA4 Event 로 설정
• GA4 에서 사용하는 측정 ID(Measurement ID)를 입력
  • 측정 ID(Measurement ID) 확인 방법
    • GA4 로그인 → 관리 → 데이터 스트림 → 웹 스트림
• 이벤트 이름(Event Name)을 click_link 로 설정
• 이벤트 매개변수로 링크 클릭의 텍스트와, 어느 영역에서 클릭했는지에 대한 정보를 포함 (click_url 을 가져오거나, 각자의 상황에 맞춰 구현할 수 있습니다.)
  • btn_name : {{Click Text}}
    • 초기 단계에서 설정한, 기본 변수 수집으로 이 값을 가져올 수 있음
  • click_from(커스텀 변수 설정 필요) : {{click_from}}
    • 새로운 변수 추가
    • 변수 타입(Variable Type) 을 Custom Javascript 으로 설정
    • 본 블로그의 경우 clickElement 에서 아래와 같은 조건에 따라 수집합니다.
    • 변수 이름을 click_from 으로 설정하고 저장
      

function() {
  var clickElement = {{Click Element}}; // Click Element 가져오기
  if (clickElement && clickElement.closest('footer')) {
    return 'footer'; // footer 내부에서 클릭된 경우
  } else {
    return 'menu'; // menu에서 클릭된 경우
  }
}

• 앞서 만든 외부 링크 클릭 트리거를 연결
• 태그 이름을 설정하고 저장

‍

4. GTM 미리보기 및 태그 배포

• GTM 미리보기(Preview) 모드 실행
• Webflow 웹사이트(본 블로그)를 새 창에서 오픈
• 클릭 이벤트가 정상적으로 작동하는지 확인
  • 메뉴(menu) 영역에서 외부 링크(Youtube, Github) 각각 클릭
  • 하단(footer) 영역에서 외부 링크(Youtube, Github) 각각 클릭
• 아래 이미지와 같이 Tag Fired 되었는지와, Tag Details 에서 Event Setting Variable 에서 이벤트 매개변수(btn_name, click_ from)가 정상적으로 수집되는지 확인

이제 확인 되었으면 Submit 으로 배포 합니다.

5. GA4 에서 외부 링크 클릭 이벤트 데이터 확인

• GA4 로그인 → 실시간 보고서(Real-Time) → 이벤트 이름 별 이벤트 수 섹션 확인
• 웹사이트(www.warren.kim)에서 외부 링크 클릭에 따라 click_link 이벤트가 정상적으로 트리거 되는지 확인
  • 이와 함께 이벤트 매개변수(btn_name, click_from) 도 정상 수집되는지 확인

‍

이렇게 정상적으로 수집된다면, 이제 구현이 완료된 것입니다.

외부 링크 클릭 이벤트 추적 최적화 TIP

• 외부 사이트로 연결되는 광고 링크 클릭을 분석하여 성과를 최적화
• 제휴 마케팅 및 파트너사 웹사이트 이동 데이터를 분석하여 성과 측정
• 특정 CTA 버튼이 외부 링크로 연결될 경우, 버튼 클릭 데이터를 분석하여 UX 개선에 활용

결론적으로, 외부 링크에 대한 활용 범위를 적절하게 기획하여 이에 대한 이벤트를 구현할 경우 성과를 최적화 할 수 있는 환경을 만들 수 있습니다.