워드프레스 처음 개설 시 GTM (구글 태그 매니저) 과 GA4 (구글 애널리틱스 4) 는 빠르게 설치할 수록 도움이 됩니다. 방문자 분석은 물론이고 배너 클릭이나 방문자 IP 등 구글 애드센스 운영 시 필요한 데이터를 수집할 때에도 GTM, GA4는 매우 유용하게 사용됩니다.
워드프레스에서 GA4를 사용해서 방문자 분석이나 클릭 데이터를 확인하고 싶으신가요? 이 가이드를 참고하시면 많은 도움이 되실거에요. 🙂
contents
0. 사전 준비
- 워드프레스 웹페이지는 개설해 두셨나요? 본 가이드에서는 워드프레스 개설에 대해서는 다루지 않습니다.
1. GTM 계정 만들기
1) 워드프레스 구글 태그매니저 계정 만들기
구글 태그 매니저 (https://tagmanager.google.com)
2) 기본 항목 작성
| 항목 | 설명 |
|---|---|
| 계정 이름 | 계정 이름은 나중에 구분하기 편하게 작성하면 좋습니다. 일반적으로는 웹사이트 명을 적습니다. (예시 : Word Press_hongppo) |
| 컨테이너 이름 | 추가하려는 웹사이트 주소를 적습니다. (예시 : www.hongppo.com) |
| 타겟 플랫폼 | 워드프레스 등 웹사이트 사용시 웹을 선택합니다. |
3) 이용 약관 동의 및 완료
2. GTM 워드프레스(WordPress)에 설치하기
0. GTM 계정을 생성하면 스니펫 코드를 웹사이트에 설치하라는 안내 가이드가 나옵니다. - 스니펫 코드 확인 : 관리자 > 계정 > 컨테이너 > Google 태그 관리자 설치
1. 워드프레스 관리자 페이지에 접속합니다. - 관리자 > 외모 > 테마 파일 편집기 선택
주의 : 워드프레스 (WordPress) 테마 파일 편집기는 코드를 직접 수정할 수 있기 때문에 매우 주의해서 다뤄야 합니다. 보안 상 위험이 있기 때문에 특정 보안 플러그인 등에서는 편집기를 비활성화하기도 합니다. 한 예로 Really Simple SSL 플러그인 사용 시 “내장 파일 편집기 비활성화” 옵션을 체크할 경우 메뉴에서 “테마 파일 편집기”가 사라져서 보이지 않습니다.
2. 테마 헤더를 선택합니다. - GTM 코드를 복사하여 <head> /<head> 최 상단 및 <body> /<body> 최 상단에 붙여 넣습니다.
헤더 최 상단 및 바디 최 상단에 GTM 코드가 삽입 된 모습입니다.
3. 테마 파일 편집기 > 최하단 파일 업데이트를 선택해서 GTM 코드를 저장합니다.
이후 워드프레스(WordPress)에 GTM이 제대로 설치되었는지 확인해 볼까요?
4. GTM이 제대로 설치되었는지 확인하는 방법 - 작업공간 > 미리보기 > 내 웹사이트 주소 입력
GTM이 잘 설치되었다면 위와 같이 연결되었다는 안내가 나옵니다.
3. GA4 계정 만들기
GA4를 바로 내 워드프레스(WordPress) 웹페이지에 설치할 수도 있지만, 그럴 경우 나중에 스크립트 관리, 이벤트 관리 등이 어려워집니다. GTM을 통해 GA4를 관리하면 클릭 이벤트 생성 등 내게 필요한 유저 행동 데이터를 쉽게 추적할 수 있습니다.
1. GA4 구글 애널리틱스에 접속하여 계정을 생성합니다.
구글 애널리틱스 (https://analytics.google.com)
스트림 만들기를 선택 후 GA4를 설치할 수 있는 코드를 발급 받습니다.
내 사이트에 워드프레스가 있다고 안내를 해주네요. 우리는 GTM을 통해 GA4를 설치하기 때문에 직접 설치를 선택합니다.
이후 측정 ID를 복사해 둡니다.
4. GA4를 GTM에 연동하기
1. GA4 측정 ID 확인 - 관리 > 데이터 스트림 > 해당 스트림 선택
2. GTM에 접속하여 GA4 태그를 생성합니다. - GTM > 작업공간 > 태그 > 새로 만들기
| 항목 | 설명 |
|---|---|
| 태그명 | GA4 |
| 태그 구성 | Google 애널리틱스: GA4 구성 |
| 측정 ID | GA4에서 복사한 측정 ID 입력 |
| 트리거 | All Pages 페이지뷰 |
3. GA4 구성을 완료한 이후 우측 상단 "제출"을 선택해서 저장합니다.
5. GA4 연동 확인하기
1. GA4가 잘 연동되었는지 확인해 봅니다. 1) GTM 미리보기 2) GA4 실시간 보고서 확인
1) GTM 미리보기
GA4 연동이 잘 되었다면 GTM 미리보기에서는 아래와 같이 태그가 Fired 되었다고 나타납니다.
2) GA4 실시간 보고서 - GA4 > 보고서 > 실시간
또한 GA4 실시간 보고서에서도 확인 가능합니다.
6. 마무리
이번 가이드에서는 워드프레스에 GTM 및 GA4를 세팅하는 방법을 알아 보았습니다.
GA4 세팅 이후 초반에 해두면 좋은 가이드에 대해서는 다음 GA4 처음 세팅하기 포스팅을 참고해 주세요. 🙂
감사합니다.
3 thoughts on “WordPress(워드프레스)에 GTM, GA4 설치하기”