[GTM]아임웹-GTM 연동하기
Full stack 마케터가 되기 위한 학습의 기록
'아임웹' 플랫폼을 통해서 전자상거래 페이지를 개설하신 분을 위해서 GTM 연동 방법을 준비했습니다.
1. 컨테이너 생성하기
구글 태그매니저에 접속 : https://tagmanager.google.com/
우측 상단 'Create Account' 버튼 클릭 후 나오는 팝업창에 하기와 같이 정보 입력
계정이름: GTM을 운영하는 계정으로, '비즈니스 이름' 입력
국가 : 비즈니스를 이행하는 국가 선택
컨테이너 이름: 컨테이너 이름 명명 (예시: 웹사이트, 블로그 등)
*한 GTM 계정에 컨테이너가 여러개 존재할 수 있음으로 이것을 구분하기 위해 이름을 지정해줘야 합니다. 가령, 우리 웹 사이트가 홈페이지 - 블로그 각각 별도의 도메인으로 이루어졌다면 "사업명-웹사이트"와 "사업명-블로그" 로 지정해줍니다.
웹사이트 연동을 진행할 것임으로 "웹" 선택 후, 하단 '만들기' 버튼 클릭
*웹사이트가 아닌 다른 OS를 선택할 경우에 각각에 해당하는 시스템을 선택 후 '만들기'를 클릭합니다.
팝업창 하단 'GDPR에서 요구하는 데이터 처리 약관에 동의합니다' 체크박스 클릭 후, 우측 상단 "예" 확인
생성된 컨테이너의 모습은 하기 이미지와 같이 나타납니다.
2. html <head>태그 내 GTM 코드 심기
GTM 코드 스니펫을 홈페이지에 삽입해주어야 합니다.
구글 태그매니저 컨테이너 생성 후, 나타나는 "Google 태그 관리자 설치"알림창의 <head> 및 <body>태그 복사하기
아임웹 로그인 후, 홈페이지 관리자에 접속
환경설정 > SEO, 헤더설정
Heder code 및 Body code 최상단에 각각 코드 삽입 후 저장
*Header code 및 Body code 최상단에 위치시키는 이유는 구글 태그매니저에 따라서, <head> 에서 가능한 높은 위치 또는 <body> 태그바로 뒤에 삽입을 해야 페이지가 로딩될 때마다 가장 먼저 구성 태그를 인식하기 때문입니다.
3. 태그 설정하기
구글 태그매니저는 계정 > 컨테이너 > 태그로 구성되어 있습니다.
운영하고 있는 웹사이트의 모든 데이터가 GA4 에 정상적으로 수집되기 위해서는 구글 태그매니저에 구성태그를 설정해주어야 합니다. Google에서는 GA4 구성 태그를 하기와 같이 설명하고 있습니다.
Google 애널리틱스: GA4 구성
GA4 구성 태그는 웹사이트에서 Google 애널리틱스로의 데이터 흐름을 보장합니다. 애널리틱스 데이터를 수집하려는 모든 페이지에 구성 태그 1개를 만드세요.
우측 태그 클릭 후 인입 화면에서 '새로만들기' 버튼 클릭
이름 없는 태그 영역에 태그 이름 지정 후, 입력
태그 구성
-태그유형: Google Analytics: GA4 구성 클릭
-측정ID :GA4 측정 ID (*측정 ID 찾는 법은 하단 별도 참조)
트리거 실행: All pages (페이지뷰)
*GA4에서 page view 이벤트를 추적하기 위해서 'all pages(모든 페이지)'를 트리거로 설정해야 합니다. 홈페이지 내 어떤 페이지를 방문해도 Page View가 수집되게 됩니다.
4. 테스트 하기
태그를 저장한 후에 미리보기 테스트를 통해 태그가 정상 작동하는지 확인할 수 있습니다.
태그매니저 우측 상단 '미리보기' 버튼 클릭
웹사이트 주소 입력 후, 'Connect' 클릭
하기 붉은색 처리 영역과 같이, Tags Fired 섹션 내에 방금 설치해준 GA4 구성 태그가 나타난다면 올바르게 설치된 것입니다!
5. GA4 측정 아이디 찾는 방법
GA4 계정 접속 후, 좌측 하단 기어모양의 '설정'클릭
데이터 스트림 클릭
측정 ID 확인
