이벤트 코드

기본 코드를 추가한 후 이벤트 코드를 추가하여 회원님의 웹사이트에서 특정 전환 이벤트를 추적할 수 있습니다.

아래 표에는 Pinterest 태그로 추적할 수 있는 이벤트와 해당 이벤트가 독자 만들기 및 전환 보고서를 포함하는지 여부가 나와 있습니다.

이벤트

목적

독자 만들기

전환 보고서

Checkout

거래를 완료한 사람을 추적합니다.

AddToCart

장바구니에 품목을 추가한 사람을 추적합니다.

Pagevisit

제품 페이지나 기사 페이지 등 주요 페이지를 조회한 사람을 추적합니다.

Signup

제품 또는 서비스를 신청한 사람을 추적합니다.

WatchVideo

동영상을 시청한 사람을 추적합니다.

Lead

제품 또는 서비스에 관심을 보인 사람을 추적합니다.

Search

웹사이트 검색으로 특정 제품이나 매장 위치를 찾은 사람을 추적합니다.

ViewCategory

카테고리 페이지를 조회한 사람을 추적합니다.

Custom

사용자 지정 이벤트를 추적합니다. 전환 보고서에 포함하고 싶은 특별한 이벤트를 추적하려면 이 이벤트 이름을 사용하세요.

[사용자 정의 이벤트]

독자 타겟팅을 위해 사용자 정의 이벤트를 추가합니다. 고유 이벤트는 전환 보고서가 지원되지 않습니다. 태그를 통해 전달되는 원시 이벤트 이름에서는 공백이 삭제된다는 점에 유의하세요.

 

배치

전환을 추적하고 싶은 모든 페이지에 기본 코드와 이벤트 코드를 모두 추가해야 합니다. 기본 코드는 웹사이트의 모든 페이지에 추가해야 하지만 이벤트 코드는 전환을 추적하고 싶은 페이지에만 추가하면 됩니다. 기본 코드는 이벤트 코드 전에 실행되어야 하므로 반드시 이벤트 코드 앞에 추가하세요.

예를 들어, 결제를 추적하고 싶다면 기본 코드를 추가한 다음 결제 이벤트 코드를 결제 확인 페이지의 <head>와 </head> 태그 사이에 추가합니다. 이렇게 해야 페이지를 불러오는 즉시 코드가 실행됩니다.

반면 사용자가 해당 페이지에서 버튼 클릭 또는 양식 제출 등의 특정 행동을 했을 때만 이벤트가 발생하는 경우 이벤트 코드가 해당 작업의 결과로만 실행되는지 확인해야 합니다. 이 경우 페이지의 JavaScript 코드에 있는 기존 이벤트 처리기에 대한 이해가 필요합니다.

이벤트 데이터

이벤트 데이터가 포함된 개체를 첨부하여 이벤트에 대한 추가 정보를 제공할 수 있습니다.

현재 Pinterest에서는 value 및 order_quantity 이벤트 데이터에 관한 보고서만 제공합니다. 추가 이벤트 데이터는 독자 타겟팅에는 이용할 수 있으나 전환 보고서에는 이용할 수 없습니다.

값은 적절한 통화 코드와 함께 다시 전달되어야 합니다. 전환 태그에서 다시 전달된 통화 코드와 회원님의 계정 통화 간의 환율을 적용하여 광고 관리자 보고의 전환값을 회원님 계정 통화로 전환합니다.

이벤트 데이터

샘플 값

유형

독자 만들기

전환 보고서

value

100.00

숫자(정수 또는 부동 소수점)

order_quantity

1

정수

currency

USD

USD, GBP, CAD, EUR, AUD, NZD 중 하나

 

product_name

파커 부츠

line_items 배열

 

product_id

1414

line_items 배열

 

product_category

신발

line_items 배열

 

product_variant_id

1414-레드

line_items 배열

 

product_variant

레드

line_items 배열

 

product_price

99.99

숫자(정수 또는 부동 소수점), line_items 배열

 

product_quantity

1

정수, line_items 배열

 

product_brand

파커

line_items 배열

 

promo_code

WINTER10

문자열

 

property

Athleta

문자열

 

search_query

부츠

문자열

 

video_title

파커 부츠로 스타일링하기

문자열

 

lead_type

뉴스레터

문자열

 

 

아래의 예시 이벤트 코드는 두 제품의 구매를 나타내는 이벤트 데이터를 사용하여 결제 이벤트를 추적합니다. 이 예시는 이벤트 코드의 JavaScript 부분임을 기억하세요. 이 예시에서는 order_quantity와 value가 정적이지만, 이러한 값들을 동적으로 전달할 수도 있습니다.

동적 값과 수량에 대한 예를 보려면 아래의 값 및 수량 이벤트 데이터 섹션을 참조하세요.
 

<script>
 pintrk('track', 'checkout', {
   value: 10.00,
   order_quantity: 2,
   currency: 'USD',
   line_items: [
     {
       product_name: 'Parker Boots',
       product_id: '1414',
       product_price: 5.00,
       product_quantity: 1
     },
     {
       product_name: 'Parker Sandals',
       product_id: 'ABC',
       product_price: 5.00,
       product_quantity: 1
     }
   ]
 });
</script>

값 및 수량 이벤트 데이터

값과 주문 수량은 현재 전환 보고서에 사용되고 있는 이벤트 데이터의 두 부분입니다. 값과 수량을 추가할 때 정적 값을 사용해도 되고 동적으로 전달해도 됩니다. 앞서 설명한 대로 값과 수량을 동적으로 전달하고자 하는 경우, 동적 전달은 웹사이트와 판매를 기록하는 방식에 따라 달라집니다. 일반적으로 웹사이트에서 이루어지는 각 주문별로 제품의 값과 수량은 다릅니다. 매출에 대한 총 값을 정확하게 추적하려면, 전환 태그에서 수량과 값을 추적할 수 있는 동적 변수를 사용할 것을 추천합니다.

하드 코딩된 값과 수량의 예

<script>
 pintrk('track', 'checkout', {
   value: 10.00, // Read this value (must be a number)
   order_quantity: 5 // Read this quantity (must be an integer)
 });
</script>
<noscript>
 <img height="1" width="1" style="display:none;" alt="" src="https://ct.pinterest.com/v3/?tid=123456789&event=checkout&ed[value]=10.00&ed[order_quantity]=5&noscript=1"/>
</noscript>

보고된 값: 10.00

보고된 수량: 5

동적 값과 수량의 예

<script>
 pintrk('track', 'checkout', {
   value: {{Enhanced Transaction Revenue}},
   order_quantity: {{item.quantity}}
 });
</script>
<noscript>
 <img height="1" width="1" style="display:none;" alt="" src="https://ct.pinterest.com/v3/?tid=123456789&event=checkout&ed[value]={{Enhanced Transaction Revenue}}&ed[order_quantity]={{item.quantity}}&noscript=1" />
</noscript>

보고된 값: 해당 결제로 구매한 동적 금액

보고된 수량: 해당 결제로 구매한 동적 수량

동적 주문 수량 및 값의 설정은 웹사이트에 따라 다릅니다.

콜백

이벤트 데이터 이외에도 JavaScript 콜백 함수를 선택적 인수로 하여 pintrk() 함수에 전달할 수 있습니다. 이벤트 추적 호출인 pintrk() 함수가 발생될 때마다 이 콜백 함수가 실행됩니다.

콜백 함수는 다음 두 인수를 사용합니다.

function(didInit, error) {}
  • didInit: 이 첫 번째 인수는 이벤트 추적 호출이 성공적으로 구성되는 경우 true로 설정된 불값을 받고, 해당 이벤트 추적 호출을 구성하는 도중 오류가 감지된 경우에는 false로 설정된 불값을 받습니다.

  • error: 이 두 번째 인수는 didInit 인수가 false를 반환했을 때 해당 오류를 설명하는 문자열을 받습니다. didInit 인수가 true일 경우 이 문자열은 정의되지 않습니다.

예시

<script>
 pintrk('track', 'checkout', {
   value: 10.00,
   order_quantity: 2,
   currency: 'USD',
   line_items: [
     {
       product_name: 'Parker Boots',
       product_id: '1414',
       product_price: 5.00,
       product_quantity: 1
     },
     {
       product_name: 'Parker Sandals'
       product_id: 'ABC',
       product_price: 5.00,
       product_quantity: 1
     }
   ]
 }, function(didInit, error) { if (!didInit) { console.log(error); }
 });
</script>

다음 단계

여기에서 더 많은 예시를 볼 수 있습니다. 기본 코드와 이벤트 코드를 추가한 후에는 Pinterest Tag Helper를 통해 태그가 올바르게 구현되었는지 확인할 수 있습니다.

아직 도움이 필요하세요?
문의하기