GA4, GTM 세팅 및 실시간 데이터 수집 확인

 

이미 세팅하는 과정을 가볍게 올린 적이 있지만 이번 포스팅은 실제 나의 웹 포트폴리오에 적용하는 과정이다.

데이터 트래킹 + 최적화 등의 개선 시도를 실습하기 위한 개인 실습 프로젝트라고 할 수 있다. 

GA4, GTM 데이터 트래킹 실습 : 사이트 제작 및 GA4, GTM 세팅

---

시작하기 앞서 완성된 홈페이지를 준비한다. 

나는 워드프레스를 사용하여 웹 포트폴리오를 만들었고, 이를 활용할 예정이다.

 

1. GA4 속성 만들기(구글 애널리틱스 계정 생성)

• GA4 계정 생성
• 웹 속성(스트림) 생성
• 웹사이트 URL 연결

 

왼쪽 상단의 만들기 버튼을 클릭하여 시작한다.

 

 

2. GTM 계정/컨테이너 만들기

 

오른쪽 상단에 계정 만들기 버튼 클릭하여 시작한다.

 

 

 

3. 워드프레스에 GTM 코드 삽입

• Headers and Footers 플러그인 설치 및 활성화
• 코드 삽입후 변경사항 저장 버튼 클릭

 

4. GA4 태그를 GTM에서 설정

• Google 태그 생성
• GA4 이벤트 태그 생성

 

태그 탭으로 이동 후 오른쪽 상단에 새로 만들기 버튼 클릭하여 시작한다.

 

 

2개의 태그를 만들어주었다.

 

 

오른쪽 상단에 제출 버튼을 클릭하고 게시를 클릭한다.

 

 

 

5. 실시간 데이터 수집 확인 (GA4에서)

내 웹 포트폴리오에 방문하고 애널리틱스에서 실시간 페이지로 들어가면 데이터가 쌓이는 것을 확인할 수 있다.

 

 

---

추가

Omnibug 라는 확장 프로그램을 사용하면, 실제로 GA4, GTM이 정상 작동 중인지 확인 가능하다.

 

 

확장 프로그램 설치 후 [개발자 도구]를 열어서 Omnibug 탭을 확인하면

내가 홈페이지 들어가고, 스크롤 내리고, 클릭하는 등의 이벤트가 기록되는 것을 확인할 수 있다.

 

혹시 애널리틱스에 데이터가 쌓이지 않을 경우 옴니버그를 통해 정상 작동 하는지 확인할 수 있다.