Google Tag Manager
이 가이드는 귀하가 상품 조회, 장바구니 담기, 결제 등의 ecommerce 이벤트를 수신하는 Data Layer가 포함된 Google Tag Manager (GTM) 계정을 보유하고 있다고 가정합니다.
또한 귀하가 태그, 트리거, 변수, data layer 등 GTM의 핵심 개념에 익숙하다고 가정합니다. 이 가이드는 GTM에 데이터를 제공하기 위해 Data Layer를 구성하는 방법에 대해서는 설명하지 않습니다.
Shopify 사이트를 운영 중인 경우, 대신 AppLovin Shopify 앱과 연동하세요.
AppLovin Pixel 설치하기
시작하기 전에 GTM 구성이 사이트의 모든 페이지에서 작동하는지 확인하세요.
그러나 사이트가 헤드리스 모드로 Shopify를 실행하는 경우, 결제 페이지에서 이벤트를 캡처할 수 있도록 반드시 Shopify 앱을 설치하세요. Shopify 헤드리스 설정 시:
- Shopify 앱이 결제 페이지에서 이벤트 추적을 처리하도록 허용합니다.
- 결제 페이지에서 GTM pixel이 실행되지 않도록 하세요.
-
Google Tag Manager 계정에 로그인합니다. 웹사이트의 컨테이너를 클릭하고, 태그 아래에서 새로 만들기를 클릭합니다. 태그 구성에서 맞춤 HTML을 선택합니다. 이름을 입력합니다 (예: “AppLovin—Init”).
-
다음 코드를 복사하여 태그에 붙여넣습니다.
«your-event-key»부분을 귀하의 AppLovin 계정에 있는 키로 대체하세요.<script> var AXON_EVENT_KEY="«your-event-key»"; !function(e,r){var t=["https://s.axon.ai/pixel.js","https://res4.applovin.com/p/l/loader.iife.js"];if(!e.axon){var a=e.axon=function(){a.performOperation?a.performOperation.apply(a,arguments):a.operationQueue.push(arguments)};a.operationQueue=[],a.ts=Date.now(),a.eventKey=AXON_EVENT_KEY;for(var n=r.getElementsByTagName("script")[0],o=0;o<t.length;o++){var i=r.createElement("script");i.async=!0,i.src=t[o],n.parentNode.insertBefore(i,n)}}}(window,document); axon("init"); </script> -
트리거 아래를 클릭하고 Initialization - All Pages (초기화 - 모든 페이지)를 선택합니다. 이렇게 하면 AppLovin Pixel이 모든 페이지에서 로드됩니다. 저장을 클릭합니다.
AppLovin Pixel은 사이트의 각 페이지에서 로드 및 초기화되어야 합니다. 이벤트를 전송하는 각 페이지에서 GTM Initialization - All Pages Trigger가 실행되는지 확인하세요.
구매 흐름:
최소한 page_view, view_item, add_to_cart, begin_checkout, purchase 이벤트를 제공해야 합니다.
사이트에서 회원가입이나 로그인을 사용하는 경우 sign_up 또는 login도 포함하세요.
리드 생성 흐름:
최소한 page_view 및 generate_lead 이벤트를 제공해야 합니다.
AppLovin Pixel로 이벤트 추적하기
AppLovin에 ecommerce 이벤트 발생을 전송하려면 다음 구문을 사용하세요. 각 이벤트는 data layer에서 그에 해당하는 이벤트가 발생할 때 트리거되어야 합니다.
<script>
axon("track", «event-name», «event-data»);
</script>
매개변수
| 이름 | 유형 | 설명 |
|---|---|---|
event_name | string | 이 이벤트의 이름입니다. 사용 가능한 이벤트는 AppLovin Pixel 이벤트 및 객체를 참조하세요. |
event_data | object | 이 이벤트의 데이터입니다. 전송할 데이터는 AppLovin Pixel 이벤트 및 객체를 참조하세요. (참고: page_view와 함께 event_data를 전송할 필요는 없습니다.) |
모든 이벤트에는 event_name 인수가 필요합니다.
page_view를 제외한 각 이벤트에는 아래의 이벤트별 섹션에 설명된 특정 event_data도 필요합니다.
AppLovin Pixel에 데이터 전달하기
GTM에서 이벤트를 채우는 방법에는 두 가지가 있습니다.
방법 1: 단일 GTM 변수
event_data가 필요한 각 이벤트에 대해 페이로드 역할을 하는 GTM 변수를 생성하는 것을 권장합니다.
예를 들어,
<script>
axon("track", "add_to_cart", {{Axon - Add To Cart}} );
</script>
(여기서 {{Axon - Add To Cart}}는 귀하가 생성한 GTM 변수입니다).
방법 2: GTM 변수 조합
여러 변수로 구성된 객체를 직접 빌드할 수도 있습니다. 예를 들어:
<script>
axon("track", "add_to_cart",
{
"currency": "USD",
"value": {{Axon - Add To Cart - Value}},
"items": {{Axon - Add To Cart - Items}}
}
)
</script>
AppLovin Pixel은 Google Analytics 4 (GA4) API와 호환됩니다.
Data Layer가 GA4 형식으로 데이터를 저장하도록 구성된 경우, 해당 Data Layer 변수를 태그 자체에 직접 전달할 수 있습니다.
예를 들어, {{GA - Ecommerce}}가 GA4처럼 구성된 Data Layer의 ecommerce 필드를 참조하는 경우, 다음과 같이 Pixel에 직접 전달할 수 있습니다.
<script>
axon("track", "add_to_cart", {{GA - Ecommerce}} );
</script>
이렇게 하면 중간 변수를 생성할 필요가 없습니다.
Data Layer가 GA4처럼 구성되어 있지 않은 경우, AppLovin Pixel을 위한 새로운 변수를 생성해야 할 수 있습니다.
향상된 사용자 식별 (권장)
AppLovin Pixel은 사용자를 식별하기 위해 퍼스트 파티 쿠키 _axwrt를 설정합니다.
이후 웹사이트로 들어오는 각 요청에는 이 쿠키가 포함됩니다.
사용자 식별을 강화하기 위해, 사이트 백엔드에서 다음 작업을 수행할 것을 강력히 권장합니다.
HTTP 요청에서 _axwrt 쿠키를 감지할 때마다, 만료 기간이 1년인 새로운 퍼스트 파티 HTTP 쿠키 axwrt(밑줄 제거)를 설정하는 헤더가 HTTP 응답에 포함되도록 설정하세요.
- 이 쿠키의 값은 요청에서 전달된 해당 쿠키의 값과 동일해야 합니다.
- 쿠키의 도메인은 앞에 마침표가 붙은 귀하의 사이트여야 합니다.
예를 들어, 사이트가
mysite.com인 경우 도메인 속성은.mysite.com이어야 합니다. 참고: “www”는 포함하지 마세요. - 쿠키의 경로는
/여야 합니다. - 쿠키를
HttpOnly로 설정하지 마세요.
예를 들어, 사이트에서 _axwrt 쿠키의 값이 xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx인 HTTP 요청을 감지한 경우, 응답에 다음 헤더를 추가합니다.
Set-Cookie: axwrt=xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx;
Expires=«오늘부터 1년»; Domain=«.mysite.com»; Path=/; SameSite=Lax;
