(해당 글은 GA 공부 후 복습용으로 작성하는 글입니다. 정확하지 않은 정보가 포함되어 있을 수 있습니다.)
Google Analytics를 시작하기 위해서는 홈페이지의 데이터를 GA(Google Analytics)로 전송하기 위해 홈페이지에 추적 코드를 설치해야 하는데요. 구글 태그 매니저는 다양한 추적 코드를 설치하는데 많은 도움을 주는 구글의 마케팅 플랫폼 서비스 중 하나입니다! 원활한 환경 설정을 위해서 크롬에서 GA, GTM 다루기를 권장합니다.
구글 애널리틱스 고객센터에서는 태그를 "애널리틱스 태그는 웹사이트의 데이터를 수집하여 애널리틱스로 전송하는 자바스크립트 스니펫입니다. 사이트 내 각 페이지의 HTML에 직접 애널리틱스 태그를 추가하거나 Google 태그 관리자와 같은 태그 관리 시스템을 사용하여 간접적으로 추가할 수 있습니다."라고 설명하는데요. GA를 사용해 데이터를 추적하기 위해 사이트에 심는 추적기라고 보시면 될 듯합니다. HTML에 추적 코드를 추가해야 하기 때문에, 코딩을 할 줄 알아야 하나? 망설이는 분들에게는 일단은 아니라고 말해드리려고 합니다. 아래 부분을 보고 일단 따라 하시면, 코딩을 모르셔도 쉽게 페이지에 태그를 심을 수 있을 것입니다. 저도 그랬으니까요!
그럼 티스토리 블로그에 빠르고 간단하게 구글 태그 매니저(Google Tag Manager)를 이용해 컨테이너를 설치해보도록 할까요? (데이터를 GA로 연결하는 방법은 GA에서 직접 추가하는 추적 코드를 삽입하는 것과 GTM의 컨테이너를 설치하는 것으로 나뉩니다. 오늘은 컨테이너를 설치하는 것부터 해볼게요.)
1. 태그 매니저에서 계정을 만들어주세요. (tagmanager.google.com/)
위의 링크를 타고 들어가서 태그 매니저의 계정을 만들어줍니다. 태그 매니저의 계정(Account) 이름과 국가(Country)를 선택해주세요. 아래 Share data anonymously with Google and others라는 박스에도 체크해주시면 좋습니다.
2. 컨테이너의 이름을 정해주세요.
컨테이너 이름은 다른 컨테이너와의 구분을 쉽게 하기 위해 해당 홈페이지의 url로 설정합니다. 컨테이너(Container)는 무언가를 담고 있는 박스라는 것인데요. 컨테이너에는 태그를 담고 있습니다. GTM을 다루기 위해서는 사용하고자 하는 행위인 변수를 설정하고 태그와 트리거를 생성합니다. 이와 관련한 자세한 내용은 추후에 다루겠지만, 일단 컨테이너 자체에 대해서 이해할 수 있게 간단한 예시를 들어볼게요. "누군가 나의 홈페이지에 들어와서 검색 버튼을 클릭했는데, 그 검색 버튼을 클릭한 사람이 몇 명이나 되는지 궁금한" 상황이 있습니다. 여기서 "클릭하는 행위"는 변수(Variables)이고, "검색 버튼을 클릭"은 트리거(Trigger)가 됩니다. 이러한 변수와 트리거를 담은 것을 태그라고 하고 이러한 태그는 GA로 데이터를 보내죠. 만약 "페이지를 끝까지 스크롤하는 사람들이 몇 명이나 될까?"라는 상황에선 "스크롤하는 행위"는 변수, "스크롤하는 해당 페이지"는 트리거가 되는 것이죠. 그리고 해당 액션이 발생하면 태그는 이 데이터를 GA로 보내주죠.
그런데 우리는 홈페이지에 태그가 아닌 컨테이너 자체를 심는데요. 컨테이너에는 다양한 태그를 담고 있다고 했죠? 그렇다면, 컨테이너만 심어두면 추후에 태그를 몇 개씩 만들고 수정이나 삭제를 해도 홈페이지에 심어둔 컨테이너 코드는 손대지 않고서도 이 모든 사항이 반영됩니다. 즉, 태그가 아무리 변경되어도, HTML 코드 자체는 바꾸지 않다도 되어 코딩을 모르는 사람도 GTM을 다룰 수 있게 되죠. 이를 구글 태그매니저의 스크립트를 심는다고 말합니다.
3. 동의서에 Yes를 누르면 GTM 계정 만들기 끝!
4. 만들자마자 이렇게 태그를 설치하라는 페이지가 뜰 텐데요. 이게 설치해야 하는 스크립트입니다.
해당 코드를 HTML의 <head>의 아래, <body>의 아래에 설치하라고 합니다. 이게 무슨 소리인지 모르겠더라도 아래에 하라는 대로 따라오시면 돼요. 제가 작성하는 글들에는 HTML과 관련한 개발 지식, 코딩 방법 등에 대해서는 언급을 하지 않고 넘어가겠습니다! 그만큼 개발자가 아니더라도, 쉽게 다룰 수 있다는 것을 보여드리고 싶어요.
다른 곳을 실수로 눌러 사라지게 되더라도 당황하지 않으셔도 됩니다. 그림의 ▾이 부분이라고 표시해둔 GTM-OOOOOOO을 클릭하시면 똑같이 나오게 됩니다. 또 다른 방법으로는 좌측 상단에 있는 관리자(Admin) > Google 태그 관리자 설치에서 확인할 수 있습니다.
5. 그리고 이런 태그를 홈페이지에 설치하기 위해 태그가 설치 가능한 티스토리 블로그를 개설해보겠습니다.
HTML을 사용자가 스스로 만질 수 있는 티스토리 블로그를 대상으로 해보겠습니다. (네이버 블로그는 HTML 편집이 안되니 실습은 티스토리 블로그를 이용했습니다.) 카카오 계정으로 티스토리를 시작했는데요.
정보를 입력하고 블로그를 개설했습니다. 그러고는 블로그에 접속하여 가장 하단에 있는 "관리자"를 클릭해줍니다.
6. 티스토리 블로그 개설 후 관리자 > 꾸미기 > 스킨 편집 순으로 들어가 줍니다.
저는 처음에 만들 때 많이 헤매었습니다. 네이버 블로그와는 다르게 자유도가 매우 높고 UI가 달라서 어렵더라고요 ㅠㅠ
7. 스킨 편집 > html 편집
8. <head> 아래, <body> 아래 각각 설치해야 하므로 <head>와 <body>를 찾아보겠습니다.
찾기 어려울 때는 ctrl + f를 눌러 head와 body를 검색해 찾아주세요. </head>와 </body>가 아닙니다! (<head>가 시작이라면 </head>는 헤드를 끝낸다는 의미입니다!)
9. 4번에서 복사한 스크립트 삽입하기
가능한 <head>와 가까이 설치해야 하지만, title 아래에 설치해주도록 하겠습니다.
<body>도 가능한 가장 가까이 설치해주기 위해 괄호가 닫히는 바로 아래에 설치하겠습니다.
컨테이너를 html에 삽입하고 나서 적용을 눌러주는데요. 이렇게 하면 태그 설치되었습니다!
GA를 다루기 위한 기본인 구글 태그 매니저에 대해서 설명해드렸는데요. GTM은 홈페이지의 데이터를 GA로 보내주는 역할을 합니다. GA는 데이터를 보기 위한 보고서 도구로 다양한 조건에 맞는 데이터를 마음대로 뽑아 볼 수 있다면, GTM은 그런 데이터를 제대로 모아 GA로 데이터를 보내는 역할을 하죠. GA에서도 태그를 구현할 수 있지만, 단순 조회에 불과하기 때문에 더 세부적인 데이터를 확인하기 위해서는 GTM에서 스크립트를 삽입해줘야 합니다. 그래서 GA 전에 GTM을 먼저 설명드린 것이죠. 데이터를 잘 다루기 위한 초석을 다지는 과정이라고 할 수 있겠죠?
다음에도 좋은 글을 들고 오도록 하겠습니다. 그럼 이만!
'디지털 마케팅 공부 > GA 공부' 카테고리의 다른 글
| 04. 구글 태그 매니저로 GA(Universal Analytics & GA4) 구축하기 (0) | 2021.06.27 |
|---|---|
| 03. A/B 테스트, 구글 옵티마이즈(Google Optimize) 알아보기 (0) | 2021.06.22 |
| 02. GA(Google Analytics & GA4) 시작하기 (0) | 2021.06.11 |
