블로그를 시작한 지 벌써 2년이 지났다. 올해는 거의 포스팅을 쉬고 있었지만 다시 활성화를 하고 싶은 마음에 블로그를 살펴보던 중에 구글 애널리틱스가 제대로 연동되지 않는 것을 확인했다. 사실 블로그를 처음 시작할 때부터 구글 애널리틱스 연동이 제대로 되고 있는 건지 반신반의했었다. 뭔가 구글 애널리틱스에 표시되는 데이터가 너무 부실해 보였기 때문이다. 그러던 중 GPT의 도움으로 드디어 구글 애널리틱스 연동이 정상적으로 된 듯하여 정리할 겸 포스팅을 남긴다.
G-Code 확인
구글 애널리틱스 설정을 완료했다면(구글 애널리틱스 설정 방법은 다른 블로그 포스팅을 참고해 주세요^^) G-XXXXXXXXX 형태의 코드를 발급받을 텐데 해당 코드를 확인하는 방법은 다음과 같다.
설정 > 관리 > 데이터 수집 및 수정 > 데이터 스트림을 선택한다.
데이터 스트림 페이지에서 붉은 박스 영역을 선택하여 데이터 스트림 상세정보 페이지에 들어가면 G-XXXXXXXXXX 코드를 확인할 수 있다. 구글 태그 코드는 데이터 스트림 상세정보 페이지에서 가장 하단의 태그 안내 보기로 들어가서 '직접 설치' 탭으로 확인할 수 있다.
티스토리 구글 애널리틱스 플러그인 비활성화
티스토리 관리 페이지에서 플러그인 > 구글 애널리틱스에서 발급 받은 G-XXXXXXXXX 코드를 입력 후 '적용'을 하면 생성한 블로그 포스팅 페이지에 자동으로 구글 태그 코드가 삽입된다.
나는 처음에 플러그인 > 구글 애널리틱스 설정과 함께 위 구글 태그 코드를 스킨 편집 > HTML 수정에서 직접 구글 태그 코드를 넣어줬다. 그러다 보니 구글 태그 코드가 2개 중복으로 들어가게 되었는데 이 부분이 문제가 되었다. 여태 문제인지도 모르고 있다가 GPT님 도움으로 이제야 알게 되었다.
구글 태그 코드를 하나만 삽입되도록 하기 위해 HTML 수정으로 추가한 구글 태그 코드를 제거하고 티스토리 구글 애널리틱스 플러그인만 활성화했다. 하지만 구글 태그 코드가 한 번만 삽입되었으나 제대로 GA연동이 되지 않았다. 이유는 티스토리 구글 애널리틱스 플러그인에서 삽입한 구글 태그 코드는 <head></head> 사이 어딘가에 삽입이 되는데 GPT 말에 따르면 구글 태그 코드는 마지막 </head> 바로 직전에 넣어야 정상동작 할 수 있다고 한다.
이유는 <head></head> 영역에서 맨위에 넣은 경우는 다른 스크립트가 dataLayer 재정의 시 덮어쓰는 위험이 있고 중간에 넣는 경우는 <head> 내의 다른 스크립트와 섞여 간섭의 위험이 있다고 한다. <head> 영역 맨 아래에 넣으면 다른 스크립트 실행 후 GA 초기화가 완료되어 동작하는데 가장 안전하다고 한다.
아무래도 사용하는 스킨 코드에 따라 다르겠지만 나는 구글 태그 코드를 <head> 영역 중간에 들어갔을 때 GA 연동이 제대로 되지 않았다.
결국에는 다음과 같이 스킨 편집 > HTML 수정에서 <head> 영역 마지막에 구글 태그 코드를 삽입하고 티스토리 구글 애널리틱스 플러그인을 비활성화하였고 결과는 성공이었다.
<head>
...
...
...
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXXX');
</script>
</head>
결론
만약 구글 애널리틱스 연동이 제대로 안된다면 다음과 같이 한번 해보자.
1. 티스토리 구글 애널리틱스 플러그인 비활성화
2. 스킨 편집 > HTML 편집에서 <head></head> 영역의 제일 마지막에 구글 태그 코드를 직접 삽입
끝.
'ETC' 카테고리의 다른 글
| Postman Mock 서버 구성 (0) | 2025.10.17 |
|---|---|
| Multipass 사용법: 간편하게 가상 머신 관리하기 (0) | 2024.07.02 |
| mongodb - $push와 $addToSet의 차이점 (0) | 2024.02.18 |
| 맥 m1, m2 에 jmeter 사용하기 (0) | 2023.12.02 |
| 맥 환경에서 iTerm2 개발 환경 셋팅하기 (0) | 2023.12.01 |
댓글