아웃바운드 링크는 우리 웹사이트 내부가 아닌 외부의 다른 웹사이트로 연결되는 링크를 의미합니다. 아웃바운드 이벤트 설정은 바로 이러한 외부 링크에 대한 클릭을 추적하는 것을 말합니다. 이전 포스팅에서의 이벤트와 마찬가지로 링크클릭 이벤트에 속하는 아웃바운드 링크클릭 추적은 제휴사이트를 운영하는 경우 특히 유용합니다.

구글애널리틱스(GA)에서 직접 설정하는 방법은 구글 애널리틱스 도움말(https://support.google.com/analytics/answer/1136920?hl=ko)을 참조하시면 됩니다만, 설정이 까다로운 편이며 아웃바운드 링크에 일일히 작업을 해야하기 때문에 이들 링크가 여러 페이지에서 걸쳐 아주 많이 존재하는 경우는 현실적으로 세팅이 불가능하기도 합니다.

구글태그매니저(GTM)를 사용하면 간단하게 아웃바운드 이벤트 설정을 할 수 있는데요, 그럼 지금부터 알아보도록 하겠습니다.

 

 

# 아웃바운드 이벤트 설정 – A사이트

1단계 : 고유 식별자 확인

2단계 : 이벤트 태그 생성

3단계 : 트리거 생성

 

이벤트 설정 방법/단계는 이전 포스팅([Google Tag Manager] 4. 구글태그관리자를 활용한 이벤트 설정 – 링크클릭)에서 자세하게 다뤘기 때문에 앞으로는 간략하게 설명하도록 하겠습니다.

 

1단계 : 고유 식별자 확인

 

구글태그관리자_이벤트설정_아웃바운드_01

우선 아웃바운드 추적을 하고자 하는 링크는 총 3개이며 위 이미지 중 우측 2개 카테고리가 이에 속합니다. 카테고리 링크 클릭 시 하나투어 본사 웹사이트의 항공권 및 호텔 예약 페이지로 이동하게 됩니다. 크롬 개발자도구의 ‘요소 검사’ 결과는 각각 아래와 같습니다.

– 할인항공권

<a href="http://www.hanatour.com/asp/booking/airticket/gi-10000.asp?hanacode=main_GNB_air" target="_blank">
<img src="/images/navi/tour01.gif" border="0"></a>

 

– 해외호텔

<a href="http://www.hanatour.com/asp/booking/lodge/lg-30000.asp?hanacode=FIT_GNB_hotel" target="_blank">
<img src="/images/navi/tour02.gif" border="0"></a>

위 연결 링크(<a>태그)의 주소를 보면 두 링크 모두 하나투어 웹사이트 주소(www.hanatour.com)를 포함하되 하나는 항공권(airticket), 다른 하나는 호텔/숙박(lodge) 페이지를 포함하고 있음을 알 수 있습니다.

 

구글태그관리자_이벤트설정_아웃바운드_02

세 번째 아웃바운드 링크는 위 이미지에 포함되어 있으며 클릭 시 와우비자 웹사이트의 자회사 사이트(하나투어 여행사 사이트)로 이동하게 됩니다.  요소 검사 결과는 아래와 같습니다.

<a href="http://wing.hanatour.com" target="_blank">
<img src="/upload/banner/banner140331183222.jpg" border="0" width="215" height="110"></a>

연결 링크 주소에 자회사 웹사이트 주소(wing.hanatour.com)가 포함되어 있음을 알 수 있습니다.

 

2단계 : 이벤트 태그 생성

이벤트 태그는 실제로 (1) 이벤트_아웃바운드_항공권 (2) 이벤트_아웃바운드_호텔 (3) 이벤트_아웃바운드_여행 총 3개의 태그를 생성하였으며, 트리거 또한 각 이벤트의 실행 조건을 담은 3개의 트리거를 생성하였습니다.

 

(1) 이벤트_아웃바운드_항공권

구글태그관리자_이벤트설정_아웃바운드_03

1) 제품 선택 : ‘구글 애널리틱스’ 선택

2) 태그 유형 : ‘유니버설 애널리틱스’ 선택

3) 태그 구성

– 추적 ID : {{ua tracking id}} – 추적 ID

– 추적 유형 : ‘이벤트’ 선택

– 카테고리 : ‘아웃바운드’ 입력

– 작업 : ‘하나투어본점’ 입력

– 라벨 : ‘할인항공권’ 입력

4) 실행 시점 : 트리거 유형으로 ‘클릭’ 선택 > ‘아웃바운드_항공권’ 트리거 선택

 

(2) 이벤트_아웃바운드_호텔

구글태그관리자_이벤트설정_아웃바운드_04

 

1) 제품 선택 : ‘구글 애널리틱스’ 선택

2) 태그 유형 : ‘유니버설 애널리틱스’ 선택

3) 태그 구성

– 추적 ID : {{ua tracking id}} – 추적 ID

– 추적 유형 : ‘이벤트’ 선택

– 카테고리 : ‘아웃바운드’ 

– 작업 : ‘하나투어본점’ 

– 라벨 : ‘해외호텔’ 

4) 실행 시점 : 트리거 유형으로 ‘클릭’ 선택 > ‘아웃바운드_호텔’ 트리거 선택

 

(3) 이벤트_아웃바운드_여행

구글태그관리자_이벤트설정_아웃바운드_05

1) 제품 선택 : ‘구글 애널리틱스’ 선택

2) 태그 유형 : ‘유니버설 애널리틱스’ 선택

3) 태그 구성

– 추적 ID : {{ua tracking id}} – 추적 ID

– 추적 유형 : ‘이벤트’ 선택

– 카테고리 : ‘아웃바운드’ 

– 작업 : ‘윙메이트’ ⇒ 자회사 웹사이트명

– 라벨 : ‘해외여행’ 

4) 실행 시점 : 트리거 유형으로 ‘클릭’ 선택 > ‘아웃바운드_여행’ 트리거 선택

 

보시다시피 각 이벤트 태그는 분류(카테고리/작업/라벨)와 트리거만 다르고 나머지 설정은 동일합니다. 그리고 카테고리, 작업, 라벨 값은 인식하고 분류하기 편하도록 정하면 됩니다.

 

3단계 : 트리거 생성

아래는 세 개 트리거 중 ‘아웃바운드_항공권’ 트리거를 캡처한 이미지입니다.

 

구글태그관리자_이벤트설정_아웃바운드_06

트리거의 실행시점(조건)은 총 세 개로 구성되어 있으며 이들 조건을 모두 충족시킬 때 태그가 실행됩니다.

우선 모든 아웃바운드 트리거의 기본 조건은 Click URL(연결 링크)가 현재 웹사이트 주소(여기에서는 wowvisa.com)를 포함하지 않는 것이며 위 예시에서도 첫 번째 조건이 됩니다. 두 번째 조건은 Click URL이 하나투어본사 주소(www.hanatour.com)를 포함하는 것입니다. 여기에 세 번째 조건이 추가된 것은 하나투어본사 사이트로 이동하는 클릭 중 항공권 예약 페이지와 호텔 예약 페이지로의 이동을 구분해서 파악하고자 했기 때문입니다.

* 첫 번째 실행 조건의 연산자가 ‘제외’로 표시되는데 영문 표기( ‘does not contain’)를 놓고 보면 ‘포함하지 않음’이 더 정확합니다. 링크 주소가 내 웹사이트 주소를 포함하지 않고 있다는 뜻이자 사이트 내부에서의 이동이 아니라 외부로 나간다는 것을 의미합니다.

 

아래 이미지에는 나머지 두 개 트리거 조건이 포함되어 있습니다. 이들  트리거의 조건을 비교해 보면 앞으로 그리 어렵지 않게 응용해서 사용할 수 있을 겁니다.

구글태그관리자_이벤트설정_아웃바운드_07

 

위와 같이 설정이 완료되면 디버깅을 거쳐 태그를 게시합니다. 그리고 시간이 지나 구글 애널리틱스 ‘방문 형태’ > ‘이벤트’ > ‘인기 이벤트’ 보고서에 들어가 보면 아래와 같이 데이터가 수집되는 걸 확인할 수 있습니다.

구글태그관리자_이벤트설정_아웃바운드_08

 

 

# 아웃바운드 이벤트 설정 – B사이트

 

위 예시에서는 제휴사이트로 연결되는 특정한 링크에 대한 클릭을 추적해봤는데요, 이번에는 웹사이트 내에서 클릭되는 모든 링크를 추적하는 설정을 해보도록 하겠습니다.

지금 보고 계시는 분석마케팅 사이트만 하더라도 포스팅 중간중간에 외부 참조 링크들이 꽤 포함되어 있습니다. 방문자들이 주로 어떠한 링크들을 클릭하는지를 추적하면 방문자들의 컨텐츠를 원하는지를 이해하는 데 도움이 될 것입니다.

 

1단계 : 고유 식별자 확인

이 이벤트의 경우 식별자는 단순히 링크가 외부로 나가는지 여부가 됩니다.

 

2단계 : 이벤트 태그 생성

 

구글태그관리자_이벤트설정_아웃바운드_11

1) 제품 선택 : ‘구글 애널리틱스’ 선택

2) 태그 유형 : ‘유니버설 애널리틱스’ 선택

3) 태그 구성

– 추적 ID : {{ua tracking id}} – 추적 ID

– 추적 유형 : ‘이벤트’ 선택

– 카테고리 : ‘아웃바운드’ 

– 작업 : {{Page Path}}

– 라벨 : {{Click URL}} 

4) 실행 시점 : 트리거 유형으로 ‘클릭’ 선택 > ‘아웃바운드’ 트리거 선택

 

카테고리는 ‘아웃바운드’라는 지정값을 사용하되 기본 제공 변수 중 작업은  ‘페이지 경로(Page Path)’를 선택해서 어떤 페이지에서 클릭이 발생하는지를, 라벨은 ‘링크(Click URL)’를 선택해서 어떤 사이트로 이동하는지를 파악할 수 있도록 했습니다.

 

3단계 : 트리거 생성

 

구글태그관리자_이벤트설정_아웃바운드_12

1) 이벤트 선택 : ‘클릭’ 선택

2) 트리거 구성 :  ‘링크만’ 선택

– 태그 대기 및 유효성 확인 체크박스에 체크

3) 설정 시간 : Page URL이 정규 표현식(.*)과 일치

4) 실행 시점 : Click URL이 analyticsmarketing.co.kr 제외

 

실행 조건이 간단합니다. 위와 같이 설정하면 GA에서와 같이 각각의 외부 링크에 이벤트를 설정하지 않고도 모든 외부 링크 클릭을 추적할 수 있습니다.

 

구글태그관리자_이벤트설정_아웃바운드_13

GA 방문 형태 > 이벤트 > 인기 이벤트 보고서에서 보여는 이벤트 액션과 이벤트 라벨 값입니다. 어느 페이지에서 어떤 사이트를 참조했는지를 알 수 있습니다.

 

지금까지 두 개의 사이트를 예시로 설명을 드렸는데요 기본 설정법만 익히면 이를 다양한 상황에 적용할 수 있습니다.

 

 

* 표시가 있는 항목은 필수 입력란입니다.

 

국내 최대의 온라인마케팅 커뮤니티/매체인 아이보스에서 구글 태그관리자(GA) 강의를 진행하고 있습니다. 커리큐럼 등 자세한 사항은 아래 링크를 참조하세요.

구글태그관리자 이해와 활용: http://www.i-boss.co.kr/ab-goods-237

 

[Google Tag Manager] 5. 구글태그관리자를 활용한 이벤트 설정 – 아웃바운드

[Google Tag Manager] 5. 구글태그관리자를 활용한 이벤트 설정 – 아웃바운드”에 대한 6개의 생각

  • 2018년 7월 16일 6:57 오후
    고유주소

    안녕하세요? 항상 글을 보면서 많은 도움을 얻고 있음에 감사드립니다.
    다름이아니라 이번에 네이버페이로 구매하기 클릭버튼을 추적하기 위하여,
    해당 글을 보며 태그를 설치하던 중 문의 사항이 있어 글 남깁니다.

    추적하고 싶은 클릭버튼(npay버튼) 검사 시 위 글처럼 링크로 나오는 것이 아니라
    <a id="NPAY_BUY_LINK_IDNC_ID_1531733029139116" href="#" class="npay_btn_link npay_btn_pay btn_green" 블라블라 이런식으로 나타납니다.
    그래서 제 추측으로는 작성자님 처럼 링크가 뜬 것이 아니기 때문에
    트리거 설정 시 링크를 넣는 것이 아닌 것 같아서 아래와 같이 설정을 하였는데요
    Click ID 포함 NPAY_BUY_LINK_IDNC_ID
    Click Classes 포함npay_btn_link npay_btn_pay btn_green

    역시나 미리보기로 확인하니 적용이 되고 있지가 않고 있었습니다..
    혹시 위와같이 뜬다면 어떻게 설정을해야할까요?? ㅜㅜ

    ps. 그리고 혹시 GTM이 뭐 업데이트 되면서 ui가 바뀐건가요? 작성자님 글에서 확인되는 GTM 구조와 실제 제가 사용하는 구조가 달라서요.. (이번에 GTM을 첨 알게되어 첨으로 써보는 초짜입니당)

    응답
    • 2018년 7월 17일 12:09 오후
      고유주소

      안녕하세요. Click ID에 ‘NPAY_BUY_LINK_IDNC_ID’ 또는 Click Classes에 ‘npay_btn_pay’ 하나만 포함시키는 조건으로 입력하시면 됩니다. 물론 둘 다 포함하는 조건도 가능하구요. ‘npay_btn_link npay_btn_pay btn_green’ 부분에 세 개의 클래스 값이 들어가 있는데 이걸 하나의 클래스로 취급해서 발생한 문제로 보입니다. 그리고 말씀하신대로 업데이트로 인해 UI가 바뀐 게 맞습니다.^^

      응답
      • 2018년 7월 17일 1:41 오후
        고유주소

        답변 너무 감사드립니다!!
        작성자님께서 말씀해주신 것 처럼 트리거에는 ‘Click ID 포함 NPAY_BUY_LINK_IDNC_ID’으로만 설정하였고, 트리거 유형은 링크가 아니기때문에 제 임의로 ‘클릭-링크만’에서 ‘클릭-모든요소’로 바꿔서 재설정하였습니다. 그리고 홈페이지 메인페이지에서 미리보기 확인하니 이번에도 적용이 안되있었습니다(Tags NOT Fired On This Page)ㅜㅜ
        그런데 의아한 점은 제가 혹시나해서 상품페이지로 넘어가 NPAY구매버튼을 클릭해보니까 갑자기 미리보기 창에서 적용이 되는걸로( Tags Fired On This Page)바뀌었습니다.
        그래서 문뜩 든 생각이 원래 이벤트 트리거는 해당 이벤트에 행동을 보였을 때만 적용이 되는 건지 궁금하여 다시한 번 문의 드립니다!
        (저는 GA설치 때 처럼 모든 페이지에서 Tags Fired On This Page 가 뜨는 줄 알고있었습니다..ㅎㅎ;)

        응답
        • 2018년 7월 19일 1:31 오전
          고유주소

          상품 상세페이지에서 네이버페이 버튼을 클릭하여 네이버 사이트로 이동하기 때문에 상세페이지에서만 이벤트 태그가 실행되는 게 맞습니다. 위 설명대로라면 제대로 설정된 것 같습니다.

          응답
  • 2019년 1월 15일 11:37 오전
    고유주소

    안녕하세요유용한 정보 너무 감사합니다 진짜 정보네요!
    댓글을 남겼는데 어디로 전송이 된건지 오류때문에 사라진건지 몰라 다시 남깁니다.
    wowvisa라는 주소를 제외하는 트리거글 넣으셨는데
    이 부분이 잘 이해가 안되네요. wowvisa라는 주소 제외 트리거가 없어도
    작동이 될 것 같은데 현재 페이지의 주소 제외 트리거는 아웃바운드를 하기 위한 일종의 약속 같은 것으로 외워야 하는 것인가요? 아니면 다른 논리적인 절차가 있어서 그렇게 하는 것인지요?

    응답
    • 2019년 1월 18일 12:30 오전
      고유주소

      안녕하세요. 답변이 늦었습니다. 먼저 글이 유용하다는 말씀 감사합니다. 그리고 문의글에서 지적하신 부분 맞습니다. 트리거 조건에서 wowvisa라는 주소를 꼭 제외하지 않더라도 문제 없이 제대로 작동합니다.

      보통 아웃바운드 이벤트는 사용자가 내 웹사이트에서 제휴사이트와 같이 특정 사이트로 이동을 할 때 이를 추적하기 위해 설정하는데요, 이 경우 특정 사이트로 연결되는 링크 즉 Click URL 값에는 기본적으로 내 웹사이트 주소가 포함되지 않기 때문에 내 웹사이트 주소를 제외시키는 조건을 사용한다 정도로 이해하시면 좋을 듯합니다.^^

      응답

댓글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다