본문 바로가기
닐라의 학습로그/마케팅 학습로그

구글 태그 매니저(GTM) 알아보기 (feat. 사용 이유 및 방법)

by 친절한 닐라 2021. 6. 13.

해당 포스팅에서는 구글 태그매니저를 사용하는 이유, 구글 태그매니저 계정 생성 방법, 구글 태그매니저의 3요소 다룹니다.

 

목차

    목차에서 이동을 원하는 세션을 클릭하시면 해당 부분으로 이동합니다.

     

    구글 태그매니저(GTM)를 사용하는 이유

     

    Google Analytics, Facebook 픽셀... 자신의 사이트에 어떠한 사람들이 방문하는지 알고 싶으신 분들, 혹은 사이트에서 수익을 창출하기 위해 광고를 게재하려는 분들이라면 모두 들어보셨을 텐데요!

    우리의 사이트에서 이러한 기능들을 이용하려면 사이트의 HTML 구조에 아래와 같은 코드들을 삽입해야 합니다.

     

    분석하는 마케터 블로그의 HTML 구조 일부

     

    위는 지금 여러분이 보고 계신 분석하는 마케터 블로그의 HTML 구조 일부를 캡쳐해놓은 모습입니다.

    현재 위에 보이는 것은 Google Analytics, Microsoft Clarity, Google Adsense 뿐이지만 이 외에도 다른 태그들이 제 블로그에 삽입되어 있습니다.

     

    (HTML 웹 문서에 대해 더욱 자세히 알고싶으시다면 아래의 포스팅을 참고하시면 좋습니다!)

     

    [Crawling] 크롤링을 위해 필요한 필수 HTML 지식 이해하기! - (1) HTML이란?

    크롤링을 처음 시작할 때 무턱대고 예시 코드만 보고 시작했다가 다른 사이트에서 크롤링을 시도하게 되면 자꾸 오류만 나고 헤매었던 경험, 크롤링 초보라면 낯설지 않을겁니다. 크롤링을 위

    marketingscribbler.tistory.com

     

    1. 웹사이트 과부하 및 코드 간의 충돌 방지

     

    위에서 <script></script> 사이에 있는 것을 Javascript 코드라고 하는데요,

    자바스크립트는 웹 사이트에서 방문자의 행동을 추적하거나 하는 등의 어떠한 동작이 일어나도록 명령하는 코드입니다.

     

    그런데, 위에 보시다시피 하나의 HTML 문서 안에 자바스크립트 코드가 많이 존재하게 되면 페이지에서 여러 가지 동작들이 한꺼번에 이루어지게 되면서 웹사이트에 과부하가 걸릴 수도 있고, 각 자바스크립트 코드 간에 충돌이 생길 수도 있습니다.

     

    그러나 구글 태그매니저를 사용하게 되면, 여러 태그들을 구글 태그매니저를 통해 간접적으로 구현함으로써 코드간의 충돌을 잡아주어 웹사이트에 과부하가 걸리는 일을 어느 정도 방지할 수 있습니다.

     

    2. 스크립트 삽입의 난이도

     

    웹 구조에 대한 지식이 없는 한, 여러 스크립트를 삽입하는 일은 어려울 수밖에 없습니다.

     

    예를 들어, Google Analytics 트래킹 코드는 단순히 구글 애널리틱스 추적 코드를 복사하여 붙여넣기하는 것이라 난이도가 낮지만, 이벤트를 추적하거나, 맞춤 측정 기준 등을 수집하기 위해서는 스크립트를 직접 짜서 삽입해야 하기 때문에 웹 관련 지식이 없으신 분들에게는 다소 어렵게 느껴질 수 있습니다.

     

    그러나, 구글 태그 매니저를 이용한다면 이러한 스크립트 수집을 좀 더 편하고 쉽게 할 수 있다는 장점이 있습니다.

     

    3. 스크립트 관리 측면

     

    스크립트를 사이트 HTML에 직접 삽입하게 된다면 이후 특정 스크립트를 찾아서 수정해야 할 일이 있을 때 길고 긴 HTML 문서에서 내가 찾고자 하는 스크립트가 어디있는지 아마 한참을 찾아야 할 것입니다.

     

    구글 태그 매니저 태그 메뉴 화면

     

    그러나 구글 태그 매니저를 사용하게 된다면, 위와 같이 태그들을 목록 형태로 편하게 관리할 수 있어

    각 태그에 접근하기도 쉬우며, 태그를 찾고 수정하는 것도 매우 용이합니다.

     

     

    구글 태그매니저(GTM) 계정 생성 방법

     

     

    웹 및 모바일 태그 관리 솔루션: Google 태그 관리자

    Google 태그 관리자를 사용하는 소규모 비즈니스는 모든 웹사이트 태그를 한곳에서 배포하는 태그 관리 솔루션을 통해 쉽고 간단하면서도 안정적으로 태그를 관리할 수 있습니다.

    marketingplatform.google.com

    우선, 위의 구글 태그 매니저 홈페이지에 접속한 후, 우측 상단이나, 화면 중앙의 무료 사용 버튼을 클릭한 후, 계정 만들기 버튼을 클릭합니다.

     

     

     

    계정 이름에는 사이트 이름 등을 주로 입력합니다. 블로그의 경우에는 블로그 이름을 입력할 수 있겠죠?

    국가는 거주지(대한민국)로 설정하시면 됩니다.

     

    컨테이너는 쉽게 말해 여러 태그들을 담고 있는 상자라고 보시면 되는데요, 구글 태그매니저는 바로 이 컨테이너를 관리하는 도구라고 보시면 됩니다.

    하나의 계정에 여러 개의 컨테이너를 만들 수 있으며, 따라서 둘 이상의 플랫폼에서 서비스를 운영하고 있다면, 각 플랫폼의 컨테이너들을 하나의 계정 아래에서 관리할 수 있습니다.

    예를 들어 제가 '분석하는 마케터'라는 제 비즈니스에 대해 블로그라는 웹사이트도 가지고 있고, 관련 앱 또한 가지고 있다면 '분석하는 마케터'라는 하나의 계정 안에 웹사이트를 위한 컨테이너와 앱을 위한 컨테이너 두 개를 생성할 수 있습니다.

     

    컨테이너 이름의 경우 자신이 알아볼 수 있는 컨테이너의 이름을 넣으면 되는데요,

    일반적으로 사이트의 도메인을 컨테이너 이름으로 입력합니다. 제 경우는 marketingscribbler.tistory.com을 입력하였습니다.

     

    타겟 플랫폼은 컨테이너를 넣을 플랫폼을 말하는 건데요, 웹페이지의 경우는 웹, ios 앱의 경우 iOS, 안드로이드 앱일 경우 Android 항목을 선택하시면 됩니다.

     

    모든 설정이 완료되셨다면 만들기 버튼 클릭 후, 나오는 GTM 약관을 읽어보시고 동의 버튼을 클릭하시면 됩니다!

     

     

    위의 절차를 완료하시고 나면 위와 같은 팝업창이 등장합니다. 이제 위의 가이드라인에 따라 나와있는 코드를 사이트의 HTML 문서에 삽입하시면 됩니다.

    혹시, 위에 코드가 나와있는 창에서 실수로 확인 버튼을 누르셨다면, 우측 상단의 컨테이너 ID를 클릭하여 코드를 다시 확인할 수 있습니다.

     


    이렇게 구글 태그 매니저 계정을 생성하는 방법을 다루어 보았습니다.

     

     

    구글 태그매니저(GTM)의 3요소

     

    GTM의 3요소

    태그 매니저 계정과 컨테이너를 생성한 후 작업 공간 좌측의 메뉴에서 여러 메뉴를 확인할 수 있는데요,

    그 중 태그(Tag), 트리거(Trigger), 변수(Variable)구글 태그매니저를 이루는 세 가지 요소라고 할 수 있습니다.

    구글 태그 매니저는 계정 단위의 컨테이너가 존재하고 태그, 트리거, 변수 등의 요소를 활용하기 때문에 위의 세 요소의 역할에 대한 이해가 뒷받침되어야 구글 태그매니저를 원활하게 사용할 수 있습니다.

     

    1. 변수 (Variable)

     

    변수특정 값을 담아두는 가상의 메모리 영역입니다. 좀 더 쉽게 말하자면 특정 값을 담는 그릇이라고 볼 수 있습니다.

    변수를 활용하면 어떠한 데이터를 수집할 지 지정할 수 있고, 특정 페이지에 대해 여러 가지 이벤트를 추적할 경우 하나의 변수를 반복적으로 사용함으로써 효율적으로 태그 매니저를 사용할 수 있습니다.

     

    예를 들어, 제가 제 블로그의 메인 페이지에 접속하는 경우, 스크롤을 끝까지 내리는 경우의 데이터를 추적하고 싶다고 가정할 때, '메인 페이지'가 변수에 해당한다고 볼 수 있습니다.

    제 블로그의 메인 페이지의 데이터를 수집할 것이기에 지정하여 변수에 담아두고, 접속하는 경우(트리거)와 스크롤을 끝까지 내리는 경우(트리거)에 대해 블로그 메인 페이지라는 하나의 변수를 반복적으로 사용할 수 있습니다.

     

    2. 트리거 (Trigger)

     

    트리거태그(명령어)가 실행되는 조건을 정의하는데에 사용됩니다.

     

    앞의 예시에 이어서 제가 제 블로그의 메인 페이지에 접속하는 경우, 스크롤을 끝까지 내리는 경우의 데이터를 추적하고 싶다고 가정할 때, 트리거는 '접속'과 '스크롤을 끝까지 내림'에 해당합니다.

     

    3. 태그 (Tag)

     

    태그는 실제로 데이터를 추적하여 수집하기 위해 명령하는 명령어의 역할을 담당합니다. 

    트리거의 조건이 충족되면 태그가 인식하여 데이터를 추적하라는 명령을 내리고, Google Analytics 등의 툴에서 데이터를 수집하게 되는 것입니다.

     

    앞의 예시를 또 다시 이어 설명하자면, 데이터를 실제로 추적하는 부분에 해당한다고 볼 수 있습니다.


    위의 세 가지 요소에 대해 또 다른 예시를 들어보자면, 제 사이트의 모든 페이지에 트래픽이 들어올 시 GA에서 데이터를 추적하고 싶다고 가정할 때, 변수는 '제 사이트의 모든 페이지', 트리거는 '트래픽이 들어옴', 태그는 'GA로 데이터를 보내라! (명령)'이 된다고 할 수 있습니다.

     

    GTM 컨테이너를 사이트나 티스토리 블로그에 설치하는 방법은 다음 포스팅을 참고해주세요!!

    구글 태그 매니저(GTM) 사이트에 설치하기 (feat.티스토리)

     

    구글 태그 매니저(GTM) 사이트에 설치하기 (feat.티스토리)

    안녕하세요, 분석하는 마케터 프레디입니다. 해당 포스팅에서는 구글 태그매니저(Google Tag Manager : GTM)를 사이트에 설치하는 방법에 대해 다룹니다. 목차 목차에서 이동을 원하는 세션을 클릭하

    marketingscribbler.tistory.com

     

     

    포스팅이 도움되셨다면 공감 부탁드립니다 :)


     

    댓글