이전 포스팅에서는 이커머스 데이터 수집 기능과 관련된 유니버설 애널리틱스와 구글 애널리틱스 4의 같은 점과 다른 점을 개략적으로 살펴봤습니다.
더하여, 유니버설 애널리틱스와 구글 애널리틱스 4의 이벤트 데이터 모델을 충분히 이해한다는 전제를 항상 기억하셔야 합니다.
구글 애널리틱스 4의 이벤트 데이터 모델을 충분히 이해한다고 생각하지 않으신다면 아래의 포스팅부터 살펴보세요.
구글 애널리틱스로 이커머스 데이터를 수집하기 전의 기초 지식 보러가기
이제부터 구글 애널리틱스의 이커머스 수집 코드를 가능한 최고의 정확도로 가능한 간단하게 당신의 쇼핑몰에 설치하는 방법을 알려드릴게요.
1. 구글 애널리틱스의 이커머스 데이터 수집 방식
이전 포스팅에서도 말씀 드렸듯이
현재 공식적으로 구글 애널리틱스 개발팀에서는 유니버설 애널리틱스와 구글 애널리틱스 4를 병행하라고 권고하기 때문에 수집 방식을 결정하는 것이 더 복잡하고 어려워졌습니다. 그럴수록 전체 구조를 조망하는 것이 중요합니다.
이커머스 데이터 수집 방식은 크게 아래와 같이 구분해 볼 수 있습니다.
| 유니버설 애널리틱스 | 구글 애널리틱스 4 | |
|---|---|---|
| JS API | 초기 버전의 Event Data Model을 통해 유연한 이벤트 추적이 가능함. | Recommended events만 사용해도 일반적인 쇼핑몰의 Shopping behavior를 더 자세히 추적할 수 있음. |
| GTMdataLayer | 쇼핑몰 페이지에 Snippet Code를 구현하는 것 만큼 GTM Tag와 변수를 설정하는 작업이 번거로움. | Recommended events와 Item Data model이 더 체계적으로 정리되어 유니버설 애널리틱스에 비해 Snippet Code를 구현하는 것보다 GTM Tag와 변수를 설정하는 작업이 간단함. |
JS API와 GTM은 각각의 장단점은 위의 표에서 제시된 것보다 훨씬 더 많습니다.
그런데 JS API와 GTM의 장단점을 비교하다 보면 근본적으로 구글 애널리틱스 4가 신 버전이기 때문에 구글 애널리틱스 4와 GTM dataLayer 방식이 더 사용하기 편리해 보일 가능성이 높습니다.
더하여, 편리함은 유연함과 반비례한 경우가 많기 때문에 유니버설 애널리틱스와 JS API 방식은 불편하다는 단점이 더 유연하다는 역설적인 장점으로 해석할 수도 있습니다.
이러한 모호함과 복잡함을 실무자들의 입장에서 극단적인 예를 들면, 유니버설 애널리틱스는 GTM을 이용하여 데이터를 수집하고 구글 애널리틱스 4는 gtag API를 이용하여 데이터를 수집할 수도 있습니다.
하지만 이러한 중구난방 상태에서는 Snippet code 유지보수가 매우 어려워지기 때문에 결국 JS API와 GTM 방식 중 하나를 선택해야만 합니다.
저희가 여러 프로젝트를 진행해보니 Snippet Code 최적화는 대부분의 개발자에게 낯설고 달갑지 않은 업무이기 때문에 난처해 하는 경우를 자주 목격했습니다. 이런 상황을 최대한 피하기 위해서 저희는 GAECTK라는 JS Library를 개발했습니다.
2. 싱글뷰가 오픈소스로 제공하는 GAECTK JS Library는?
다행히 최근에는 구글 애널리틱스나 퍼포먼스 마케팅 강의가 급증해서 예전보다 유익한 정보가 많아졌습니다.
하지만 일상 업무로도 충분히 바쁜 실무진 입장에서는 당장 지금부터 시작해야 하는 인터넷 강의도 시간과 체력에 부담을 줄 가능성이 높습니다.
그래서 구글 애널리틱스의 JS API 규격을 설명하고 구글 태그 매니저 설정법을 더 체계적으로 혹은 더 빠르게 교육시키는 것보다 실무진들이 복잡한 라이브러리 관련 지식을 아예 공부하지 않아도
수집과 분석을 통한 성과 개선, 그리고 인센티브 달성 업무를 가능한 빠르게 시작하는 방법은 충분한 가치를 지닙니다.
위와 같은 이유로 GAECTK라는 JS Library를 2021년 8월부터 오픈소스로 공개했습니다.
직접 구현 혹은 코드 최적화에 관심이 있으시면 Github에서 소스 코드만 살펴보셔도
수년에 걸쳐 필드에서 검증된 유니버설 애널리틱스용 Snippet Code와 기존의 노하우를 토대로 신속하게 테스트 중인 구글 애널리틱스 4의 JS API와 GTM dataLayer 연동 방법을 매우 직관적으로 비교하실 수 있습니다.
3. GAECTK JS Library는 대부분의 한국형 임대형 쇼핑몰에서도 유용합니다.
만약 여러분의 학구적인 열정이 매우 강하다면 구글 애널리틱스와 GTM에 관한 방대한 전문 지식을 얼마든지 찾아보시고 공부하실 수 있습니다.
하지만 많은 해외 기술 자료가 한국 시장에서 무의미한 이유가 있습니다.
한국의 유명 임대형 쇼핑몰 서비스들은 애초에 유니버설 애널리틱스가 요구하는 아이템 데이터 모델도 충족시키지 못하는 경우가 많기 때문입니다.
쇼핑 행동 흐름 전 과정에 걸쳐서 더 다양하고 일관된 아이템 정보를 요구하는 구글 애널리틱스 4는 말할 것도 없습니다.
그래서 저희는 한국 이커머스 인프라의 현실에 맞게 GAECTK JS Library를 구성했습니다.
여러분께서도 GAECTK JS Library를 사용하시면 최소한 구글 애널리틱스의 이커머스 데이터 수집과 관련된 작업은 GTM dataLayer보다 더 간단합니다.
그래서 GTM dataLayer를 사용하지 않으시고 JS API를 선택하시면 살펴보셔야 하는 정보는 아래의 페이지가 전부입니다.
GA4 전자상거래 코드 설치 가이드 보러 가기
4. GAECTK JS Library는 한 번만 설치하면 유니버설 애널리틱스와 구글 애널리틱스 4를 모두 처리합니다.
이전 포스팅을 살펴보셨다면 어중간하게 달라진 유니버설 애널리틱스와 구글 애널리틱스 4의 이벤트 데이터 모델 때문에 유니버설 애널리틱스와 구글 애널리틱스 4를 모두 작동시키는 Snippet code 관리는 매우 난해해 졌다는 점도 쉽게 공감하실 것 같습니다.
GAECTK JS Library를 사용하시면 최소한 구글 애널리틱스4 과도기의 문제를 고민하실 이유가 없습니다. 스킨 명령어를 이용하여 호출 함수의 파라미터만 정확히 입력하시면 유니버설 애널리틱스와 구글 애널리틱스 4 계정에 동시에 완전히 동일한 데이터를 전송합니다.
5. GAECTK JS Library는 GTM dataLayer를 지원합니다.
물론, GAECTK JS Library를 사용하시면 GTM dataLayer를 사용하셔야만 하는 경우도 매우 간단하게 대응하실 수 있습니다.
실무적으로 구글 애널리틱스의 JS API를 사용하시다 GTM dataLayer로 전환하시는 과정은 초기화 함수의 인자를 바꾸시는 것이 전부입니다.
다만, 사용하시는 GTM 계정에 GAECTK JS Library가 전송하는 데이터를 처리할 태그, 트리거, 변수를 설정하는 추가 작업은 구글 GTM의 특성이기 때문에 저희 싱글뷰가 이 과정을 더 압축시킬 수 없다는 한계는 양해해 주시길 부탁드립니다.
다음 포스팅에서 GAECTK JS Library가 전송하는 데이터를 처리할 태그, 트리거, 변수를 설정하는 방법을 안내해 드리겠습니다.
매우 피곤해서 정말 중요한 업무를 처리하기 힘든 시간에 아무 생각없이 저희가 표시해 드리는 캡처 화면대로 클릭하고 저희가 표시해 드리는 문자열을 복붙하시는 것 뿐입니다.