Vimeo Business, Premium 또는 Enterprise 회원이고 Google Analytics를 사용하는 경우, Google 태그 관리자를 사용하여 사이트에 임베드된 Vimeo 플레이어에 이벤트 추적을 설정할 수도 있습니다. 시작하기 전에 Google 태그 관리자 계정이 설정되어 있고 페이지에 Google 태그 관리자가 설치되어 있는지 확인해야 합니다. 이에 대한 자세한 내용은 Google 태그 관리자 지원 사이트에서 찾을 수 있습니다.
이 도움말에 포함된 내용:
- 1단계: 사이트에 Vimeo 추적 스크립트 추가하기
- 2단계: Vimeo 추적 코드가 제대로 설치되었는지 확인하기
- 3단계: Vimeo 이벤트 변수 만들기
- 4단계: Vimeo 이벤트 추적을 위한 트리거 생성하기
- 5단계:트리거를 GTM 태그에 연결하기
- 6단계: 변경 사항 게시 및 추적 시작하기
1단계: 사이트에 Vimeo 추적 스크립트 추가하기
Vimeo 플레이어 이벤트를 Google 태그 관리자 이벤트로 변환하는 커스텀 스크립트를 추가해야 합니다. 로그인하여 https://vimeo.com/settings/으로 이동합니다. 마케팅 탭 아래에 추적 코드가 표시되며 추적하려는 페이지에 스크립트를 추가하는 방법을 확인하실 수 있습니다.
추적 코드가 웹사이트의 HTML 소스 코드에 나타날 때마다 Google Analytics 스크립트 아래에 추적 코드를 붙여넣어야 합니다.
💡팁: 내 사이트의 HTML 코드를 수정할 수 없는 경우에는 Google 태그 관리자를 이용해 사이트에 추적 코드를 삽입할 수도 있습니다. 방법은 다음과 같습니다.
- 사이트의 Google 태그 관리자 작업 공간으로 이동합니다.
- 태그 관리자의 메인 작업 공간 메뉴에서 "트리거"로 이동합니다.
- "새로 만들기"를 클릭합니다.
- 페이지뷰에서 트리거 유형을 "DOM 사용 가능"으로 선택하고 모든 이벤트에 대해 설정합니다.
- 변경 사항을 저장합니다.
- 이제 태그 관리자의 메인 작업 공간 메뉴에서 "태그"를 클릭합니다.
- "새로 만들기"를 클릭합니다.
- 태그 구성에서 "맞춤 HTML" 태그 유형을 선택합니다.
- Vimeo 고유 추적 코드를 HTML 상자에 입력합니다.
- Triggering 아래에서 이전 단계에서 만든 'DOM Ready'를 선택합니다.
⚠️ 초기 로드 (예: 라이트박스 또는 팝업 플레이어 사용 시) 후 페이지에 새 임베드를 추가하는 고급 셋업이 있는 경우 iframe 임베드를 로드하는 데 사용한 스크립트의 함수 window.__vimeoRefresh()를 호출하거나 이 커스텀 스크립트를 Vimeo GA 스크립트 아래에 있는 웹페이지의 소스 코드에 삽입할 수 있습니다.
<script>setTimeout(function(){ window.__vimeoRefresh(); }, 3000);</script>
다음과 같이 Vimeo GA 추적 스크립트를 트리거하는 데 사용된 동일한 태그 내에 GTM을 사용하여 이 스크립트를 삽입할 수 있습니다.
2단계: Vimeo 추적 코드가 제대로 설치되었는지 확인하기
먼저 Google 태그 관리자로 이동한 다음 미리 보기 버튼을 클릭하면 미리 보기 모드로 들어갈 수 있습니다.
추적 코드를 설정한 사이트로 이동하면 Google 태그 관리자 콘솔이 나타납니다. "요약" 섹션에 Vimeo 항목이 있는지 확인하고 콘솔 자체에서 "데이터 영역" 탭을 클릭하여 Vimeo 이벤트가 있는지 볼 수도 있습니다.
⚠️웹페이지에 접속할 때 디버그 창이 나타나지 않으면 웹사이트에 Google 태그 관리자가 올바르게 설치됐는지 확인하세요.
3단계: Vimeo 이벤트 변수 만들기
Google Tag Manager 계정에서 다음 데이터 레이어 값의 각 GTM의 '변수' 섹션에서 새 사용자 지정 변수를 생성합니다.
- event_category (항상 '동영상')
- event_action (로드, 재생, 진행률 - 25%, 진행률 - 50%, 진행률 - 75%, 진행률 - 100%, 이메일 수집)
- event_label (동영상 제목 + 동영상 ID, 예: "My Vimeo Video | 78934")
이 데이터 레이어에 대한 변수를 이미 생성한 경우 해당 변수를 재사용해도 됩니다.
이벤트 카테고리
- 변수 유형에서 '데이터 영역 변수'를 선택합니다.
- 변수 이름 event_category를 입력합니다. (참고: 이 값은 소문자로 입력하고 정확하게 일치해야 합니다.)
- 데이터 영역 버전의 경우 "버전 2"를 선택합니다.
- "기본값 설정"이 해제되어 있는지 확인하십시오.
- 저장을 누릅니다
이벤트 액션
- 새 변수 만들기
- 변수 유형에서 '데이터 영역 변수'를 선택합니다.
- 변수 이름 event_action을 입력합니다. (참고: 이 값은 소문자로 입력하고 정확하게 일치해야 합니다.)
- 데이터 영역 버전의 경우 "버전 2"를 선택합니다.
- "기본값 설정"이 해제되어 있는지 확인하십시오.
- 저장을 누릅니다
이벤트 라벨
- 새 변수 만들기
- 변수 유형에서 '데이터 영역 변수'를 선택합니다.
- 변수 이름 event_label을 입력합니다. (참고: 이 값은 소문자로 입력하고 정확하게 일치해야 합니다.)
- 데이터 영역 버전의 경우 "버전 2"를 선택합니다.
- "기본값 설정"이 해제되어 있는지 확인하십시오.
- 저장을 누릅니다
마지막으로 Google 태그 관리자 메인 작업 공간으로 돌아가 방금 만든 모든 새 변수를 확인합니다.
4단계: Vimeo 이벤트 추적을 위한 트리거 생성하기
새 트리거 만들기
-
Google 태그 관리자 작업 공간에서 트리거 섹션으로 이동하여 '새로 만들기'를 선택합니다.
-
트리거 유형에서 "맞춤 이벤트"를 선택합니다.
-
이벤트 이름에 vimeo를 입력합니다. (참고: 이 값은 소문자로 입력하고 정확하게 일치해야 합니다.)
-
트리거가 "모든 맞춤 이벤트"에 대해 실행되도록 설정합니다.
이 트리거 구성을 사용하면 내 페이지에 임베드된 Vimeo 플레이어의 모든 이벤트가 자동으로 추적됩니다.
*선택 사항* 만약 플레이어에서 특정한 이벤트만을 추적하고 싶다면, 트리거 구성에서 "일부 맞춤 이벤트"를 선택하고 특정 범위로 좁힐 수 있습니다.
아래 이미지는 재생 이벤트만을 추적하는 예시입니다.
플레이어가 보낸 다음 이벤트 액션은 모두 추적 가능합니다.
- 로드
- 재생
- 진행률 - 25%
- progress - 50%
- progress - 75%
- progress - 100%
- 이메일 수집
(참고: 모든 이벤트 액션 값은 소문자로 입력하고 위의 형식과 일치해야 합니다.
5단계: 트리거를 GTM 태그에 연결하기
모든 Vimeo 이벤트에 대한 변수 및 트리거를 셋업한 후 Universal Analytics와 같은 실제 트래킹 서비스와 연결시킬 수 있습니다.
다음은 모든 Vimeo 이벤트를 Universal Analytics 이벤트에 연결한 예시입니다.
- 태그 관리자 작업 공간에서 "새로 만들기" 태그를 선택합니다.
- 태그 유형에서 'Universal Analytics'를 선택합니다.
- 트랙 유형에서 "이벤트"를 선택합니다.
- 3단계에서 설정한 카테고리, 액션, 라벨 변수에 연결합니다.
(참고: Google Analytics 설정은 Vimeo 설정과 별도로 변수로 사전에 구성해야 합니다. 이렇게 하면 태그 전체의 설정을 유지할 수 있습니다.) - 트리거 아래에서 Vimeo 트리거를 선택합니다. (이전 단계에서 생성한 트리거)