구글 태그 매니저 : 요소 공개 이벤트

GTM

요소 공개 이벤트라고 하면 다소 낯설게 느껴지는 것이 사실입니다. 하지만 열어보면 아주 간단한 이벤트 입니다.

요소 공개 이벤트는 웹사이트의 페이지의 특정 한 부분이 ‘노출’되었을 때를 태그매니저가 감지해 이벤트 발생으로 여기는 걸 뜻합니다.

따라서 다양한 영역에서 사용될 수 있는데요.

이번에는 스크롤 깊이를 태깅하는 것과 흡사하게, 페이지의 맨 마지막 부분이 노출되었을 경우는 탐지해 이벤트 발생으로 여기는 방법에 대해 알아보도록 하겠습니다. 페이지의 맨 마지막이 노출되었다는 것은 사용자들이 그 페이지의 상품이나 정보에 대해 전부 읽었다는 것을 뜻하니까요.

저희 홈페이지인 하이프마크를 예로 들어보겠습니다.

메인페이지의 스크롤을 쭉 내리다보면 하단의 Find us here와 Contact us 등이 있는 걸 보실 수 있죠. 이 하단의 메뉴가 노출 되었을 시를 이벤트 발생으로 만들어보겠습니다.

이 아래까지 본 사람들이라면 적어도 하이프마크에 관심이 있는 분들이니 끝까지 보신 분들, 그리고 그 중 직접 컨택을 해주신 분들의 차이도 비교해보면 큰 도움이 되겠죠.

그럼 이제 구글 태그매니저에 로그인해 본격적으로 작업을 시작해봅시다. 먼저 트리거에 들어가 트리거를 만들어줘야 하겠죠.

이제 트리거 유형을 골라주세요.

요소 공개 이벤트라는 제목에서 알 수 있듯, 애초에 요소 공개 상태라는 트리거를 구글 매니저 측에서 제공하고 있습니다. 이를 클릭해주시면 됩니다.

보시면 요소 공개 상태에서 선택 방법이 ID가 있죠. 가장 편리한 방법이니 이 ID를 통해 요소 ID를 집어 넣어 트리거를 완성해보겠습니다.

하지만 그 전에 먼저 ID 를 찾아주셔야겠죠.

개발 스크립트를 통해 가지고 있는 고유의 ID를 찾아주셔야 합니다. 찾으셨으면 그 아이디를 요소 ID에 넣어주시면 됩니다.

ID를 넣어주셨으면 이제부터 디테일한 설정을 하셔야 합니다. 트리거 실행 시점 중 페이지당 한 번을 선택해주시고 고급으로 넘어가 봅시다.

최소 비율 표시가 있죠. 이건 바로 선택한 요소의 얼만큼이 노출되어야 인정해주느냐 입니다.

50 퍼센트로 한다면 제가 요소로 선택한 이 영역에서 절반 정도가 노출되면 이벤트 발생으로 취급하는 겁니다. 0에서 100까지 선택할 수 있는데요, 100은 당연히 이 전부가 노출 되어야만 트리거가 발동된다고 보시면 됩니다.

또한 화면 표시 최소 시간 설정이 있죠. 밀리초 단위로 얼마나 봤느냐에 따라 이벤트 발생 기준이 됩니다. 3초로 하고 싶으시다면 3000을 입력해주시면 되겠죠.

이를 저장하면 트리거가 완성된 것입니다. 이제 태그로 가서 마저 마무리를 해주셔야겠죠.

태그를 만드는 방법은 앞선 문서들에서 수없이 반복했으니 그를 참고해주시기 바랍니다. 이벤트로 새 태그를 만드시고 아까 전 만든 트리거를 넣어주세요. 이대로 저장하면 태그가 만들어지겠죠?

이제 상단의 제출을 눌러 홈페이지의 적용시켜주시면 모두 완료된 것입니다.

이후 이벤트는 구글 애널리틱스의 이벤트 보고서에서 수집되는 것을 확인할 수 있습니다.

구글 태그 매니저 설치나 고도화가 필요하시다면 하이프마크에 문의해주세요.

감사합니다.