이 콘텐츠는 2020년 제작되어 현재와 다른 내용을 포함할 수 있습니다.

구글 태그 매니저 입문자가 흔히 느끼는 감정

<이미지 1> 구글 태그 매니저에 로그인 하면 설치 스크립트를 볼 수 있어요.

처음 구글 태그 매니저에 로그인 해 컨테이너를 만드시면 설치코드를 받게됩니다. 위의 이미지 1을 보면 설치 스크립트가 2가지로 나뉘어져있죠? 각각 head와 body에 코드를 붙여 넣으라고 하네요. 이 말을 바로 이해하셨다면 설명이 필요없이 설치를 하시면 됩니다. 그러나 카페24나 아임웹같은 빌더사를 통해 홈페이지를 제작하셨거나 외주 개발을 통해 제작하셨다면 영 이해가 가지 않을 수 있어요. 외주 개발을 맡겨 제작한 홈페이지를 운영중이시고, 직접 홈페이지의 html문서에 접근하실 수 없는 경우에는 외주제작사에 연락해 도움을 받으시는 것을 추천드립니다. 설치는 매우 간단해 통상적으로는 추가비용이 발생하지 않거나 수고비 정도로 설치가 가능합니다. 지금부터는 카페24나 아임웹 같은 빌더사를 통해 제작한 홈페이지에 구글 태그 매니저 설치 스크립트를 붙여넣는 방법을 알려드릴게요.

이미지 <2> 카페24 관리자 센터에서 상품관리 > 운영관리 > 검색엔진 최적화 > 고급설정

이미지 <3> 아임웹 관리자 센터에서 환경설정 > SEO, 헤더설정

구글 태그 매니저는 홈페이지 감시자와 같은 역할을 합니다. 홈페이지에 일어나는 일들을 우리에게 보고해주죠.

구글 태그 매니저는 홈페이지 내의 감시원입니다. 이 감시원의 임무는 홈페이지에 방문한 사람이 마우스를 움직이거나, 페이지를 조회하거나, 어떤 버튼을 클릭하는 등 감시하고 싶은 일을 했을 때, 누군가에게 보고를 하는 일이죠. 보고받는 대상이 구글 애널리틱스 일 수도 있고, 제3의 다른 툴일수도 있어요. 감시원의 보고를 받으려면 다음의 세 가지 요소를 알아야 합니다.

• 변수
• 트리거
• 태그

페이지 URL이나 버튼의 이름처럼 그 내용은 변할 수 있지만 특정은 할 수 있는 '변수'라는 요소를 활용해서 'OO 페이지 URL(변수)이 불러와지면(트리거) 보고하기(태그)' 라는 임무를 감시원에게 줍니다. 감시원은 OO 페이지 URL이 불러와 질 때 마다 GA나, 제 3의 다른 툴에 보고를 하게 되죠. 이를 구분하기 위해 보고서에 'GA에 보고하기', '제 3의 툴에 보고하기' 등으로 이름을 붙여 주는 것을 태그라고 생각하시면 좀 더 이해하기 쉽습니다.

바로 실전에 돌입해 보겠습니다. 트리거를 만들기에 앞서 준비하셔야 하는 사항이 있습니다. 바로 기본 변수를 추가해 주는 일인데요, 전혀 어렵지 않습니다.

구글 태그 매니저의 변수 메뉴를 클릭해주세요. 우측 상단의 구성을 클릭해주세요. 위의 영상을 따라 클릭과 스크롤 변수를 추가해주세요. 클릭 트리거와 스크롤 트리거를 만들기 위한 준비가 끝났습니다.

클릭 트리거를 만들 때, 유형은 두 가지가 있습니다. 모든요소와 링크만. '모든 요소'의 경우 페이지 내에 있는 링크, 이미지, 버튼 등 모든 요소의 클릭을 추적합니다. '링크만'의 경우 <a> 태그를 활용해 링크가 걸려있는 요소만을 추적할 수 있습니다. '모든 요소'가 조금 더 큰 영역을 추적한다고 보시면 간단합니다.

이제 어떤 행동을 추적하고 싶은지 결정해야 합니다. 예를 들어, 우리 홈페이지 내에 '장바구니'라는 버튼이 있다고 해 볼까요? 이 버튼을 클릭하는 고객을 추적해보겠습니다.

먼저, 개발자 도구를 열어주세요. 개발자 도구의 좌측 상단에는 요소검사 아이콘이 있습니다. 이를 클릭해 추적하고자하는 요소를 클릭해보세요. 더 간단하게는 추적하고자 하는 버튼을 우클릭해 검사(Inspect)를 클릭해주세요. 자동으로 하이라이트 되는 부분을 유심히 살펴보세요.

요소 검사를 해보니 아래와 같은 부분이 하이라이트 되었군요.

우리에게 필요한 부분은 중간의 class="btn default-cart" 부분입니다. 기본 장바구니 버튼을 의미하는 것 같군요! 장바구니 버튼을 class 이하의 내용으로 특정할 수 있게 되었으니, 이제 트리거 제작으로 넘어가볼까요?

스크롤 이벤트는 더욱 만들기 쉽습니다. 트리거 메뉴에서 새로 만들기를 클릭해주세요. 스크롤을 70% 정도 내렸을 때 트리거가 발동하기를 원하기 때문에 이름은 scroll70으로 짓도록 하겠습니다. 트리거 유형은 사용자 참여의 스크롤 깊이를 선택해주세요. 세로 스크롤 깊이를 선택하고 원하는 깊이(퍼센트 기준)을 숫자로 입력해주세요. 절반 정도라면 50, 스크롤을 조금만 내려도 발동되길 원한다면 20-30을 입력해도 좋겠죠? 이 트리거는 페이지와 관계없이 발동하길 원하기 때문에 모든 페이지를 선택해주겠습니다. 저장을 눌러주면 여러분은 스크롤 이벤트를 성공적으로 만드셨습니다. 벌써 두 번째 성공이네요!

구글 태그 매니저로 만든 트리거가 발동할 때 구글 애널리틱스를 사용해 해당 이벤트가 얼마나 많이 발생했는지 정보를 받아 보는 것은 많은 포스팅에서 다루고 있는 주제입니다. 그러나 정작 마케터들이 원하는 순간에 메시지를 보내는 방법에 대한 포스팅은 찾아보기 어렵더군요 🧐. 구글 태그 매니저와 마케팅 툴을 사용해 장바구니를 클릭할 때, 스크롤을 내리는 순간 팝업 메시지를 보내는 방법까지 알려드리도록 하겠습니다.

위에서 만든 장바구니 클릭 이벤트를 구글 애널리틱스로 확인할 수 있도록 하는 과정입니다

만든 이벤트를 태그를 활용해 구글 애널리틱스로 보내봅시다. 구글 태그 매니저의 태그 메뉴에 들어가 새로 만들기를 클릭해주세요. 태그의 이름은 가능하면 영문을 사용해줍니다. 먼저 하단의 트리거부터 설정해보겠습니다. 저는 장바구니 클릭을 추적하고 싶으니 위에서 만들어둔 장바구니 클릭 트리거를 선택해주겠습니다.

상단의 태그 구성이 중요합니다. 클릭 이벤트를 추적하는 것이기 때문에 추적유형은 이벤트, 카테고리는 클릭으로 적어주겠습니다. 작업에는 어떤 버튼을 클릭했는지 보기 위해 클릭된 텍스트(내용)이 입력되도록 설정하였습니다. 라벨에는 어떤 페이지에서 해당 클릭이 일어났는지 보기 위해 Page Path를 설정해 주도록 할게요! 마지막으로 Google 애널리틱스 설정에서 현재 사용중인 GA계정을 연결해주면 설정이 완료됩니다.

구글 태그 매니저 공식 사용법 👀

• 구글 태그 관리자 고객센터 바로가기

채널톡, 브레이즈와 같은 이벤트 기반 마케팅 툴을 사용하고 있다면 트리거가 발동한 순간 고객에게 메시지를 보내도록 설정할 수 있습니다. 특히, 이벤트가 발생했을 때 적절한 메시지를 보내면 페이지를 보고 있는 고객을 전환하는데 큰 도움이 됩니다. 이 글에서는 채널톡의 마케팅 기능을 활용해 이벤트가 발생한 순간 메시지를 발송하는 예를 보여드릴게요.

사전 준비

구글 태그 매니저의 템플릿 메뉴를 클릭하고, 태그 템플릿을 추가해주세요. 채널톡의 템플릿을 추가하기 위해 Channel.io를 검색해주세요. 태그 템플릿 목록에 'Channel.io'가 잘 보인다면 성공입니다!

템플릿을 활용해 이벤트 보내기

이제 미리 만들어둔 스크롤 트리거를 활용해 이벤트를 보내볼게요. 태그 구성에서 미리 받아둔 Channel.io를 선택하고, Action은 Track(Send event)를 선택해줍니다. 트리거는 기존에 만들어 둔 스크롤 이벤트를 활용하도록 할게요. 같은 방식으로 클릭과 같이 다양한 이벤트를 보낼 수 있습니다.

스크롤을 내렸을 때 푸시 메시지 발송

블로그를 읽고 있는 유저가 70% 이상 스크롤을 내리면 메시지가 도착하도록 설정한 예

페이지 지정과 메시지 입력은 채널톡을 통해 미리 해 두었습니다. 구글 태그 매니저로 만든 이벤트가 발생하면 채널톡으로부터 메시지가 도착하는 것을 볼 수 있습니다. 구글 태그 매니저는 유저의 행동을 추적하는 것 뿐만 아니라 전환을 이끌어 낼 수 있는 액션을 적용하기에도 필수적인 툴입니다. 이렇게 구글 태그 매니저를 활용해 추적 뿐만 아니라 직접적으로 고객에게 원하는 메시지를 보내는 방법까지 알아봤습니다. 수고 많으셨습니다!