brunch

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 하이프마크 Mar 23. 2022

구글 애널리틱스 : GTM용 이벤트 설정 - 1

이번에는 구글 태그 매니저를 이용해 이벤트 몇가지를 설정해 데이터 전송까지 알아보겠습니다. GTM을 이용하면 이벤트 설정 후 즉시 데이터를 전송을해 수집/확인이 바로 가능해 상당히 좋습니다.

지난번과 동일하게 T스토리를 이용해 알아보도록 하겠습니다. 아래와 같이 로고클릭, 검색버튼 을 이용해 이벤트 설정을 해보도록 하겠습니다.

먼저 로고 클릭 태그를 생성해주도록 하겠습니다. 그전에 로고 개발자도구로 들어가 확인먼저 해주겠습니다. 로고 마우스 우측 클릭후 검사로 들어가주시면 됩니다.

그럼 a태그안 class 에 link_logo를 복사해 두도록 합니다.

1-1 태그 생성

아래와 같이 태그 유형 선택 > 추적 유형 이벤트 설정해 줍니다.

이벤트는 카테고리 > 액션 > 라벨은 알맞게 입력해주시면 됩니다.

1-2 트리거 생성

아래와 같이 원하는 트리거를 생성하기 위해 + 를 클릭해 줍니다. 그리고 트리거 이름입력 후 트리거 링크만 선택 해줍니다. 모든요소와 링크만이 있지만 모든 요소에 링크만이 포함되어있습니다. 하지만 지금 a태그를 이용해 링크만을 설정해 주었습니다.

<a> 태그는 링크를 걸어주는 태그라 이해하시면 됩니다.

1-3 기본 제공 변수 생성

이제 구글 태그 매니저에서 기본으로 제공하는 변수를 선택해 로고 개발자도구로 확인했을때 클래스 link_logo 를 입력해 저장해 주도록 합니다.

저장하고 태그도 저장하고 나와 주시면 됩니다.

이번에도 검색 버튼도 동일하게 마우스 오른쪽 클릭을 통해 개발자 도구로가 확인해 줍니다.

이번에는 class가 icon-Search 입니다. 소문자 대문자 구별을 해주시고 타이핑보단 더블 클릭해서 복사를 해두도록 하면 좋습니다.

2-1 태그 생성

로고 클릭과 동일하게 입력해 주도록 하겠습니다. 다른점이 있다면 카테고리/액션/라벨 정도만 알맞게 입력해주시면 됩니다.

2-2 트리거 생성

이번에는 <a>태그가 아니므로 모든 요소로 선택해 주었습니다.

2-3 트리거 구성

이번에도 Click Classes 선택 후 위에서 복사해두었던 icon-Search를 입력해 저장해주도록 합니다.

이제 미리보기를 통해 로고 클릭과 검색버튼 클릭을해 작동하는지 확인하시면 됩니다.

이렇게 확인이 되셨다면 제출까지 완료해주시면 됩니다.

이제 GA로 넘어와 실시간 > 이벤트를 통해 데이터 수집이 잘 되는지 확인까지 해주시면 됩니다.

구글 애널리틱스,구글 태그매니저 설치나 고도화가 필요하시다면 하이프마크로 문의해주세요.

감사합니다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari