뒤로 가기
홈으로 이동
LearnFit
공유하기
YouTube, 웹사이트 커스텀 이벤트를 구글 태그매니저를 통해 GA4로 보내는 방법
엔비님의 학습노트

웹사이트 커스텀 이벤트를 구글 태그매니저를 통해 GA4로 보내는 방법

#전체
#마케터
#구글 태그매니저
#구글 애널리틱스
#데이터 사이언티스트
00:00웹사이트(프론트엔드)에서 발생한 이벤트 데이터를 태그매니저를 통해 GA4로 전송하는 실습이 시작됩니다.
00:23본 실습은 프론트엔드 개발자가 웹사이트에서 태그매니저로 이벤트 데이터를 전송하는 코드를 삽입 완료한 상태에서 진행된다는 것을 알려줍니다.
00:34태그매니저(https://tagmanager.google.com/#/home)에 접속해 본인의 계정으로 접속합니다.
00:47[미리보기]를 클릭해 태그 어시스턴트 페이지가 열리면, 태그매니저 추적 코드가 삽입된 본인의 웹사이트 URL을 입력하고 [Connect]를 누릅니다.
01:15URL로 입력한 페이지가 태그 어시스턴트 디버그 모드로 열립니다. 이 디버그 페이지에서 클릭 등 이벤트를 발생시키면 태그 어시스턴트에 해당 이벤트 데이터 기록이 남는다는 것을 알려줍니다.
01:43GA로 보내려고하는 이벤트를 디버그 페이지에서 직접 발생시켜야 한다고 알려줍니다. 이 실습에서 피드백 주관식 입력 이벤트 데이터를 GA로 보낼 것이기에, 직접 주관식 피드백을 입력하고 전송합니다.
02:24프론트엔드 개발자가 해당 이벤트 발생 시 태그매니저로 이벤트를 보내는 코드를 사전에 작성했기에, 태그 어시스턴트에 해당 이벤트가 발생했다고 확인됩니다. (본 튜토리얼에서는 feedback_up_typed)
02:34해당 이벤트 정보 중 API Call 부분에서 event 변수의 값과 GA로 보내고자 하는 변수명을 메모해야 한다고 알려줍니다. 이후 태그매니저 설정에서 입력해야 하기 때문입니다.
02:34fdsjhkfdsf
03:11이제부터 태그매니저에서 GA4로 이벤트 데이터를 보내는 설정을 할 것입니다. 첫 번째 단계는 트리거 설정입니다. 트리거는 어떤 조건이 충족되었을 때 GA로 전송할것인지, 그 “조건”을 의미합니다. [새로 만들기] 클릭 후 맞춤 이벤트를 선택하면 나오는 입력 칸에 아까 태그 어시스턴트에서 메모했던 event 변수의 값을 입력합니다. 상단 트리거명은 GA로 전송되는 것이 아닌, 태그매니저 내부에서 사용되는 이름입니다.
04:26두 번째 단계인 변수 설정입니다. 변수 설정은 발생한 이벤트 내에서 어떤 데이터를 GA로 보낼 것인지 사전에 정하는 단계입니다. 사용자 정의 변수 섹션에 [새로 만들기]로 들어가 유형은 데이터 영역 변수로 지정합니다. 데이터 영역 변수 입력 칸에는 아까 태그 어시스턴트에서 메모했던 GA로 보내고자 하는 변수명을 입력합니다. 상단 변수명은 GA로 전송되는 것이 아닌, 태그매니저 내부에서 사용되는 이름입니다.
05:22마지막 단계는 태그 설정입니다. 태그란 “트리거가 발생했을 때 변수를 GA로 보내라”는 명령입니다. [새로 만들기]로 들어가 트리거는 아까 만든 트리거로 지정합니다.
05:48이제 앞의 트리거가 발동했을 때 실행할 명령을 정할 것입니다. 태그 구성의 유형은 Google Analytics: GA4 이벤트를 선택합니다. 구성 태그는 태그매니저에서 전송하는 이벤트 데이터를 받을 목적지로, 태그매니저에 이전에 연결해둔 GA를 선택합니다.
06:02이벤트 이름은 GA 보고서에 기록될 이벤트 이름으로, 자유롭게 작성하면 됩니다. 이벤트 매개변수는 GA 보고서에 위 이벤트 이름과 함께 기록될 데이터입니다. 매개변수 이름은 아까 메모해 두었던 GA로 보낼 변수명을, 매개변수 값은 입력칸 옆에 + 블럭을 눌러 아까 태그매니저 변수 메뉴애서 설정해 둔 변수를 선택합니다. 상단에 태그 이름은 GA로 전송되는 것이 아닌, 태그매니저 내부에서 사용되는 이름입니다. 이제 저장하면 설정 끝입니다.
07:31이제 [미리보기]로 디버그 페이지에 들어가 해당 이벤트를 발생시켜서, 설정한대로 이벤트 데이터가 GA에 들어오는지 확인해봅니다. GA의 실시간 메뉴로 들어가, 하단에 이벤트 이름별 이벤트 수 섹션에서 태그매니저에서 설정한 이벤트명(feedbackTyped)이 표시되는지 확인합니다. 해당 이벤트명을 클릭하고, 태그 설정할 때 입력한 매개변수명(content)을 찾아 클릭하면 이벤트 데이터 값이 들어있습니다.
08:50방금 [미리보기]의 디버그 페이지에서 이벤트를 발생시켜 GA로 데이터가 잘 전송되는 것을 확인했지만, 태그매니저에서 [제출], [게시]를 하지 않으면, 디버그 페이지가 아닌 실제 페이지에서는 이제까지의 설정 중 아무것도 적용되지 않습니다. 제출과 게시를 하여 실제 페이지에 적용합니다.
09:53실습처럼 했는데 여전히 디버그 페이지에서 발생시킨 이벤트만 GA에 기록되고, 실제 페이지에서 발생시킨 이벤트는 기록되지 않는 경우 해결방법을 설명합니다. 첫째, 태그매니저에서 제출을 했지만 그 버전이 관리자에 의해 승인되지 않았을 경우로 관리자 계정에게 제출한 버전이 승인되었는지 확인을 요청합니다. 둘째, 브라우저에 이전 버전의 태그매니저 캐시가 남아있을 경우로, 브라우저 시크릿 모드로 접속하여 캐시를 초기화한 상태로 진입해봅니다. 셋째, 광고 차단 프로그램이 실행되고 있을 경우로, 광고 차단 프로그램을 잠시 종료해봅니다.
10:51GA에 들어온 데이터가 실시간 보기가 아닌 실제로 보고서에 저장되려면 반드시 맞춤 측정기준을 설정해주어야 한다고 알려줍니다. GA 구성 탭 → 맞춤 정의 메뉴에서 [맞춤 측정기준 만들기]를 누릅니다. 이벤트 매개변수를 태그매니저 태그 설정에서 입력했던 매개변수명과 똑같이 입력하고, 측정기준 이름은 편의상 이벤트 매개변수와 동일하게 입력합니다.
12:21맞춤 측정기준을 설정하면 24~48시간 뒤에 참여도 메뉴-이벤트 보고서에 GA로 들어온 이벤트 데이터가 저장되어 확인할 수 있다는 것을 알려줍니다.
12:44맞춤 측정기준을 설정한지 48시간 뒤에 이벤트 보고서를 열어봅니다. 태그매니저에서 설정한 이벤트명(feedbackTyped)가 기록되어 있습니다. * 마우스 포인터 위치가 좋아요 피드백(주관식)을 잘못 가리키고 있는데, 마우스 바로 위에 feedbackTyped에 대한 설명입니다.
13:13이벤트명(feedbackTyped)를 눌러 상세 페이지로 진입하면, 맞춤 측정기준의 이름으로 된 섹션에서 들어온 이벤트 데이터를 확인할 수 있습니다. 여기까지 확인되면 실습 초반에 설명한 태그 플랜을 열어, GA 이벤트 보고서 수집여부 확인 완료 박스에 체크해주면 실습이 끝납니다.
✔ 학습 완료

이 학습노트가 포함된 러닝패스예요.

엔비님의 다른 노트는 어때요?

엔비의 프로필 이미지
엔비
의 학습노트

기획자가 서비스 정책을 정하는 기준

영상 재생 모양 아이콘
Video
⏱ 핵심 스탬프
8
00:00
기획을 하다보면 종종 1안, 2안 중에 선택해야 되는 경우가 많은데요, 결정을 할 때 어떤 생각의 프로세스로 정하는지 한 기획자의 생각을 알아보겠습니다.
00:08
예시로 배달 서비스 기회자가 회원가입 정책을 결정하는 경우를 보겠습니다.
👍
1
스크랩
엔비의 프로필 이미지
엔비
의 학습노트

토스의 가장 강력한 무기는 ㅇㅇㅇ

영상 재생 모양 아이콘
Video
⏱ 핵심 스탬프
15
00:00
창업주가 말하는 토스에서 가장 강력한 무기는 조직문화라고 합니다.
00:59
조직 문화를 혁신하는 것이 중요한 아젠다였다고 합니다.
👍
2
스크랩
👋 다양한 인사이트를 읽어보고 계신가요?
나만의 학습 기록을 남기고, 관리하고 싶다면!
다양한 전문가의 멤버십 전용 콘텐츠를 보고 싶다면!
나의 학습 내용을 공유하고, 수익을 올리고 싶다면!
3초 회원가입/로그인으로, 런핏의 커뮤니티에 여러분도 함께하세요.
3초 만에 가입하기