베너가 3개일 때 데이터 수집시 변수 설정
1
작성한 질문수 6
이렇게 3개의 베너 및 밑에 '자세히 살펴보기'에 대한 데이터를 수집할때에는 변수를 어떻게 설정해야하는건가??
한개씩 dom변수 하기에는 너무 업무가 많은거 같은데. 쉽게할 수 잇는 방법이 있는지 문의드립니다.
답변 1
0
안녕하세요, 인프런 AI 인턴입니다. 포동포동님.
3개의 배너와 각 배너 아래에 있는 ‘자세히 살펴보기’ 링크에 대한 데이터를 수집하기 위해 Google Tag Manager(GTM)를 효율적으로 사용하는 방법을 안내해드리겠습니다.
자동화된 변수 설정 방법
공통 속성을 활용한 CSS Selector 사용:
- 배너와 링크가 모두 동일한 클래스를 갖고 있다면, GTM에서 해당 클래스를 사용하여 클릭 이벤트를 수집할 수 있습니다. 예를 들어, 모든 ‘자세히 살펴보기’ 링크에
detail-view라는 클래스가 있다면, CSS Selector[class='detail-view']를 사용해 모든 링크 클릭 이벤트를 한 번에 처리할 수 있습니다.
- 배너와 링크가 모두 동일한 클래스를 갖고 있다면, GTM에서 해당 클래스를 사용하여 클릭 이벤트를 수집할 수 있습니다. 예를 들어, 모든 ‘자세히 살펴보기’ 링크에
데이터 속성 사용:
- 각 요소에
data-attribute를 추가하여 이를 통해 정보를 추적할 수 있습니다. 예를 들어,<a data-banner="banner1" class="detail-view">자세히 살펴보기</a>와 같은 형식으로 설정하여 GTM에서 data-attribute를 바탕으로 특정 정보를 변수로 수집할 수 있습니다.
- 각 요소에
GTM의 Built-in Variables 활용하기:
- Built-in Variables 중에서 클릭별 요소나 텍스트를 선택하여, 이를 통해 어떤 배너가 클릭되었는지를 감지할 수 있습니다.
- Built-in Variables 중에서 클릭별 요소나 텍스트를 선택하여, 이를 통해 어떤 배너가 클릭되었는지를 감지할 수 있습니다.
참조 자료
요약
주어진 HTML 구조에서 동일하게 반복되는 패턴(예: 클래스명)을 식별하여 GTM에서 해당 요소들을 대상으로 이벤트를 수집하도록 설정하면 반복 작업을 줄이고 자동화할 수 있습니다. 또한, 데이터 속성을 적극적으로 활용하면 클릭된 요소에 대한 세부 정보(예: 배너명이나 보기를 위해 클릭한 요소)를 보다 구조적으로 수집할 수 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
요소공개 트리거만들때.
0
19
1
세션의 유입출처를 분석할때 우선순위 관련 문의
0
32
2
클릭 이벤트 - 매개변수 세팅 관련 문의드립니다.
0
30
1
utm 관련 문의 드립니다.
0
32
2
Referral에 대해 문의드립니다.
0
41
2
구글계정 1개로 로그인 후 pc와 모바일로 접속했을때.
0
43
2
ga4 reports builder 관련
0
41
2
해당 강의 단톡방
0
42
1
네이티브 앱 관련 문의
0
38
2
퍼널 분석 관련
0
40
2
강의 자료 부탁드립니다!
0
64
1
클릭이벤트셋팅실습1에서 미리보기에서 비회원구매 태그가 실행되지 않습니다
0
53
2
메타광고 시, UTM url 작성방법
0
124
2
주석 추가 기능이 안됩니다.
0
66
2
인구통계 세부정보 문의
0
64
2
스크롤 이벤트 적용 시
0
70
2
잠재고객 질문
0
51
1
전환율의 분자와 분모 이해하기 파트
0
66
2
태그 설치
0
59
2
인구통계 데이터
0
60
3
퍼널분석 문의
0
54
2
페이지별 평균 참여시간 확인
0
49
2
59.세션_개요 강의 세션수 집계 방법 질문
0
67
2
모델 비교(이메일 관련 질문입니다.)
0
53
2