- 9월 15일
- 3분 분량
[GTM]
개발자 없이 AI활용 구글태그매니저 맞춤 자바스크립트 변수 생성하기

안녕하세요! 🙋♀️
데이터 마케팅 전문 에이전시 지아이코퍼레이션
harry 입니다.
최근 다양한 산업 군에서 AI 활용이 활발히 이루어지고 있으며,
실제 업무 효율성 향상에도 큰 기여를 하고 있습니다.
마케팅 분야 역시 예외가 아닙니다. 머신러닝 기반의 무효 타겟 제거, 유효 타겟 범위 확대(플랫폼 최적화),
성과 예측, 비효율 요소 제거, 크리에이티브 개선 등 여러 영역에서 AI의 역할이 강화되고 있는데요,
특히
데이터 분석을 위한 핵심 전제인 ‘추적(Tracking)’ 설정 또한
AI를 통해 정합성 높은 데이터를 더욱 손쉽게 확보
할 수 있습니다.
과거에는 개발자의 지원이 필수적이었던 부분을 AI가 직접 보완할 수 있게 되면서,
데이터 분석과 추적 범위 확장 측면에서 새로운 가능성이 열리고 있습니다.
오늘은
AI를 활용해 구글 태그매니저(GTM)에서 맞춤 자바스크립트 변수를 생성하는 방법
을 단계적으로 안내드리겠습니다.
구글태그매니저 기본 제공 변수의 한계

(구글태그매니저 기본 제공 페이지 변수)

(구글태그매니저 기본 제공 클릭 변수)
우선,
변수라는 것은 말 그대로 '변하는 수치'로써, 태그매니저가 설치된 웹사이트에서 확인 가능한
페이지, 클릭, 이벤트, 스크롤, 동영상 등 요소
들이라고 이해하실 수 있습니다.
예를 들면, 웹사이트 내 메뉴바를 클릭할 경우, 메뉴바의 클릭 텍스트와 클릭 URL 등 여러 요소들이
모두 변수에 해당한다고 볼 수 있습니다.
https://blog.naver.com/gicorp/223156453432
태그매니저에서 꼭 필요한 개념 (1)태그 (2)트리거 (3)변수에 대한 자세한 설명은
위의 태그매니저 스크롤뎁스 추적하기 편을 참고해 주세요!
구글태그매니저에서 제공하는 기본 변수 중
페이지, 클릭, 이벤트 변수는 실무에서 가장 많이 사용하는 유형 중 하나입니다.
반면, 전자상거래 혹은 유저 ID 등 특수한 영역을 추적해야 하는 경우,
개발자를 통한 이벤트를 자체 발생시키거나 데이터레이어푸쉬 작업이 선행되어야 합니다.
즉, 개발자의 도움 없이는 기본 제공 변수 외 추가 데이터를 수집하기 쉽지 않다는 한계가 있습니다.
맞춤 자바스크립트 변수란?

맞춤 자바스크립트 변수란,
기본 제공 변수 외 원하는 조건의 데이터(function)를 수집할 수 있도록(return)
사용자가 직접 자바스크립트 구문을 통해 생성한 변수
를 말합니다.

예를 들어, 앞에서 언급한 기본 제공 변수(클릭, 페이지, 이벤트 정보 등) 외
사이트 내
추가적인 정보에 대해서는 태그매니저가 인식할 수 없기 때문에
별도의 변수를 생성하는 작업
이 필요하며,
개발자 혹은 퍼블리셔를 통해 자바스크립트 변수를 추가하게 됩니다.
*특정 페이지에서 클릭하지 않아도 텍스트를 가져와야 할 때
*특정 페이지에서 가격(가치)를 추적해야 할 때
*특정 페이지에서 품목 이름과 옵션을 추적해야 할 때
이와 같은 상황에서 맞춤 자바스크립트 변수를 활용하면,
태그매니저가 기본적으로 인식하지 못하는 정보를 직접 수집할 수 있습니다.
AI를 활용한 맞춤 자바스크립트 변수 생성 방법

그럼 AI를 활용하여 맞춤 자바스크립트 변수를 생성하고,
위의 박스 표시 부분 '댓글'의 값을 추적해 보겠습니다.

우선, 댓글이 완료되었을 때
"맞춤 자바스크립트 변수"라고 기재한 부분에 대해 가져올 수 있는 변수는 없는 기본 상태입니다.

생성형 AI에 요청하기 전,
검사 도구를 통해서 추적 영역에 대한 요소
를 복사합니다.
(F12 > 화살표로 추적 영역 선택 > 스크립트 중 element 복사)

그리고 생성형 AI에 상기와 같이 프롬프트를 입력합니다.
저는 주로 GPT를 활용하는데, 코파일럿 또는 제미나이 등 여러 AI를 사용하셔도 무방합니다.
(1) 역할 설정
(2) 목적 설명
(3) 조건 안내
위의 구조로 설명하게 되면 아래와 같이 변수를 생성할 수 있는 코드를 확인할 수 있습니다.

앞서 언급한 function으로 시작하여 return값을 구현하는 구조로 실행됩니다.

복사한 코드를
변수 > 사용자 정의 변수 > 맞춤 자바스크립트 설정에서 붙여 넣고 제출
해 주세요.
그럼 다시 댓글이 완료되었을 때 텍스트 값이 확인 가능한 지 테스트해 보겠습니다.

실제 댓글 작성을 완료했을 때 텍스트 값(AI활용~완료하였음) 텍스트가
정상적으로 수집된 것을 확인할 수 있습니다.
구글애널리틱스 맞춤 자바스크립트 변수 추출

AI를 통해 맞춤 자바스크립트 변수 생성 및 확인되었다면,
최종적으로 애널리틱스로 데이터를 점검하는 단계가 남았습니다.
새로운 이벤트 태그를 생성하되,
이벤트 매개변수에는 값을 가져올 수 있도록 변수 처리({{중괄호}})
를 반드시 해주셔야 합니다.

설정을 완료한 후 애널리틱스 디버그 모드로 접속하였을 때
태그매니저에서 설정한 값(AI활용~하였음)이 정상적으로 수집되고 있음이 확인됩니다.

마지막으로, 맞춤 보고서에서 댓글 코멘트를 추출할 때
'comment'라는 측정기준을
확인하기 위해 위와 같이 애널리틱스 맞춤 측정기준을 꼭 설정
해 주세요!
위에 설명한 내용은 단순히 댓글을 추출하는 내용이지만,
실제로 전자상거래 product, value 등 값을 추출할 때도 매우 유용한 방법입니다.
또한, 웹사이트에 자체적으로 스크립트를 삽입하여 데이터레이어를 발동시키는 방법보다
1차 검증이 가능하기 때문에 더 안정적인 방법입니다.
앞으로도 AI를 활용한 데이터 분석에 소요되는 리소스를 줄이고 생산성을 더 확대할 수 있는
유용한 방법에 대해 안내드리겠습니다^^
그럼 다음 콘텐츠에서 만나요!
안녕
👋
데이터 마케팅 전문 에이전시 | 지아이코퍼레이션
퍼포먼스 전문 온라인광고대행사 지아이코퍼레이션은 온라인광고를 통해 클라이언트에 좋은 영향력을 제공하며 궁극적인 성장을 위한 전략을 제안합니다. (무료 상담하기)
www.gi-corp.co.kr

이 글은 네이버 블로그에도 실려 있습니다.