analytics.js용 향상된 전자상거래 플러그인을 사용하면 사용자 쇼핑 환경 전반의 전자상거래 웹사이트에서 제품 노출수, 제품 클릭수, 제품 세부정보 보기, 장바구니에 제품 추가, 결제 절치 시작, 거래, 환불과 같은 사용자의 제품 상호작용을 측정할 수 있습니다.
이전 및 전자상거래 플러그인과의 호환성(ecommerce.js)
전자상거래 측정을 이미 구현했으며 향상된 전자상거래를 사용하려는 경우 두 가지 방법이 있습니다.
새 속성 사용
새로 만든 속성에 추적기를 추가하고 새 속성에 향상된 전자상거래를 태그하거나 사용 설정할 수 있습니다. 한 페이지에서 여러 속성으로 데이터를 전송하는 방법에 관한 자세한 내용은 여러 추적 객체 사용을 참고하세요.
기존 속성 이전
현재 analytics.js 사용자가 전자상거래 플러그인에서 향상된 전자상거래 플러그인으로 이전하려면 참조를 삭제하고 향상된 전자상거래 코드로 대체해야 합니다.
현재 ga.js를 사용 중인 경우 향상된 전자상거래 플러그인을 사용하기 전에 analytics.js로 이전해야 합니다.
이전에 ecommerce.js 플러그인을 사용하여 수집된 거래 및 상품 데이터는 이전의 영향을 받지 않으며 처음에 전송된 속성 및 프로필에서 계속 사용할 수 있습니다.
향상된 전자상거래 데이터 유형 및 작업
여러 가지 유형의 전자상거래 데이터를 전송할 수 있습니다.
노출 데이터
조회한 제품에 대한 정보를 나타냅니다. impressionFieldObject라고 하며
다음 값을 포함합니다.
| 키 | 값 유형 | 필수사항 | 설명 |
|---|---|---|---|
id |
텍스트 | *예 |
제품 ID 또는 SKU입니다(예: P67890).
* |
name |
텍스트 | *예 |
제품의 이름입니다(예: Android 티셔츠).
* |
list |
텍스트 | 아니요 | 제품이 속한 목록 또는 컬렉션입니다(예: 검색결과). |
list_name |
텍스트 | 아니요 | 제품이 속한 목록 또는 컬렉션입니다(예: 검색결과). |
brand |
텍스트 | 아니요 | 제품과 연결된 브랜드입니다(예: Google). |
category |
텍스트 | 아니요 |
제품이 속한 카테고리입니다(예: 의류). /를 구분 기호로 사용하여 최대 5개 수준의 계층 구조를 지정합니다(예:
의류/남성/티셔츠).
|
variant |
텍스트 | 아니요 | 제품의 옵션 (예: 블랙)입니다. |
position |
정수 | 아니요 | 목록 또는 컬렉션에서 제품의 위치입니다 (예: 2). |
list_position |
정수 | 아니요 | 목록 또는 컬렉션에서 제품의 위치입니다 (예: 2). |
price |
숫자 | 아니요 | 제품의 가격입니다(예: 29.20). |
제품 데이터
제품 데이터는 조회, 장바구니에 추가 등
작업이 실행된 개별 제품을 나타냅니다.
productFieldObject라고 하며 다음 값을 포함합니다.
| 키 | 값 유형 | 필수사항 | 설명 |
|---|---|---|---|
id |
텍스트 | *예 |
제품 ID 또는 SKU입니다(예: P67890).
* ID 중 하나 또는 |
name |
텍스트 | *예 |
제품의 이름입니다(예: Android 티셔츠).
* ID 중 하나 또는 |
brand |
텍스트 | 아니요 | 제품과 연결된 브랜드입니다(예: Google). |
category |
텍스트 | 아니요 | 제품이 속한 카테고리입니다(예: 의류). 구분 기호로 /를 사용하여 계층 구조를 최대 5개 수준 (예: 의류/남성/티셔츠)으로 지정합니다. |
variant |
텍스트 | 아니요 | 제품의 옵션 (예: 블랙)입니다. |
price |
숫자 | 아니요 | 제품의 가격입니다(예: 29.20). |
quantity |
정수 | 아니요 | 제품의 수량입니다(예: 2). |
coupon |
텍스트 | 아니요 | 제품과 연결된 쿠폰 코드입니다(예: SUMMER_SALE13). |
position |
정수 | 아니요 | 목록 또는 컬렉션에서 제품의 위치입니다 (예: 2). |
list_position |
정수 | 아니요 | 목록 또는 컬렉션에서 제품의 위치입니다 (예: 2). |
프로모션 데이터
조회한 프로모션에 대한 정보를 나타냅니다. promoFieldObject라고 하며
다음 값을 포함합니다.
| 키 | 값 유형 | 필수사항 | 설명 |
|---|---|---|---|
id |
텍스트 | *예 |
프로모션 ID입니다(예: PROMO_1234).
* |
name |
텍스트 | *예 |
프로모션의 이름입니다(예: 여름 세일).
* |
creative |
텍스트 | 아니요 | 프로모션과 연결된 광고 소재입니다(예: summer_banner2). |
creative_name |
텍스트 | 아니요 | 광고 소재의 이름입니다(예: summer_banner2). |
position |
텍스트 | 아니요 | 광고 소재의 위치입니다(예: banner_slot_1). |
creative_slot |
텍스트 | 아니요 | 광고 소재 슬롯의 이름입니다(예: banner_slot_1). |
작업 데이터
발생한 전자상거래 관련 활동에 대한 정보를 나타냅니다.
actionFieldObject라고 하며 다음 값을 포함합니다.
| 키 | 값 유형 | 필수사항 | 설명 |
|---|---|---|---|
id |
텍스트 | *예 |
거래 ID입니다(예: T1234).
* 작업 유형이 |
affiliation |
텍스트 | 아니요 | 거래가 발생한 매장 또는 제휴사입니다(예: Google 스토어). |
revenue |
숫자 | 아니요 |
거래와 연결된 총 수익 또는 총 합계를 지정합니다(예: 11.99). 이 값에는 배송비, 세금 또는 기타 수익 계산에 포함하려는 총 수익의 조정 금액이 포함될 수 있습니다. |
| 값 | 숫자 | 아니요 | 이벤트와 연결된 가치(수익)입니다. |
tax |
숫자 | 아니요 | 거래와 연결된 총 세금입니다. |
shipping |
숫자 | 아니요 | 거래와 연결된 배송비입니다. |
coupon |
텍스트 | 아니요 | 거래에 사용된 거래 쿠폰입니다. |
list |
텍스트 | 아니요 | 연결된 제품이 속한 목록입니다. 선택사항입니다. |
items |
배열 | 아니요 | 연결된 제품이 포함된 배열입니다. |
step |
정수 | 아니요 | 결제 프로세스의 단계를 나타내는 숫자입니다. '결제' 작업 시 선택사항입니다. |
checkout_step |
정수 | 아니요 | 결제 프로세스의 단계를 나타내는 숫자입니다. |
option |
텍스트 | 아니요 |
선택한 결제 수단과 같이
결제 페이지의 옵션 정보를 설명할 수 있는 checkout 및
checkout_option 작업의 추가 필드입니다.
|
checkout_option |
텍스트 | 아니요 | 결제 옵션입니다(예: 선택한 결제 수단). |
제품 및 프로모션 작업
작업은 Google 애널리틱스로 전송하는 제품 및 프로모션 데이터를 해석하는 방법을 지정합니다.
| 작업 | 이벤트 | 설명 |
|---|---|---|
click |
하나 이상의 제품에 대한 제품 또는 제품 연결을 클릭합니다. | |
detail |
제품 세부정보를 봅니다. | |
add |
장바구니에 하나 이상의 제품을 추가합니다. | |
remove |
장바구니에서 하나 이상의 제품을 삭제합니다. | |
checkout |
하나 이상의 제품에 대한 결제 절차를 시작합니다. | |
checkout_option |
지정된 결제 단계의 옵션 값을 전송합니다. | |
purchase |
하나 이상의 제품을 판매합니다. | |
refund |
하나 이상의 제품에 대한 환불을 처리합니다. | |
promo_click |
내부 프로모션을 클릭합니다. | |
add_to_cart |
사용자가 장바구니에 하나 이상의 제품을 추가합니다. | |
begin_checkout |
사용자가 하나 이상의 제품에 대한 결제 절차를 시작합니다. | |
checkout_progress |
사용자가 첫 번째 결제 단계 후 결제 단계를 완료합니다. | |
purchase |
사용자가 구매를 완료합니다. | |
refund |
사용자가 하나 이상의 제품에 대한 환불을 받습니다. | |
remove_from_cart |
사용자가 장바구니에서 하나 이상의 제품을 삭제합니다. | |
select_content |
사용자가 제품 또는 제품 링크를 클릭합니다. | |
set_checkout_option |
사용자가 완료하는 결제 단계입니다. | |
view_item |
사용자가 제품의 세부정보를 봅니다. | |
view_item_list |
사용자가 하나 이상의 제품 목록을 봅니다. | |
view_promotion |
사용자가 내부 프로모션을 클릭합니다. | |
view_refund |
사용자가 하나 이상의 제품에 대한 환불 정보를 봅니다. |
구현
다음 섹션에서는 향상된 전자상거래 플러그인을 구현하여 analytics.js 라이브러리를 사용하여 웹사이트의 전자상거래 활동을 측정하는 방법을 설명합니다.
전자상거래 플러그인 로드
analytics.js 라이브러리의 크기를 줄이기 위해 향상된 전자상거래 기능은 기본 라이브러리에 제공되지 않습니다. 대신, 사용 전에 로드해야 하는 플러그인 모듈로 제공됩니다.
향상된 전자상거래 플러그인을 로드하려면 다음 명령어를 사용하세요.
ga('require', 'ec');
이 명령어는 추적기 개체를 생성한 후 향상된 전자상거래 관련 기능을 사용하기 전에 실행해야 합니다.
향상된 전자상거래 데이터 전송
로드가 완료되면 향상된 전자상거래 측정과 관련된 새로운 명령어가 기본 추적기에 추가되고 전자상거래 데이터를 전송할 수 있습니다.
전자상거래 활동 측정
일반적인 향상된 전자상거래 구현은 제품 노출수 및 다음 작업을 측정합니다.
- 제품 링크 클릭수
- 제품 세부정보 보기
- 내부 프로모션 노출수 및 클릭수
- 장바구니에서 제품 추가/삭제
- 제품의 결제 절차 시작
- 구매 및 환불
노출수 측정
제품 노출수는 ec:addImpression 명령어를 사용하여 측정됩니다. 제품에 대한
세부정보가 impressionFieldObject에 추가됩니다.
예를 들어 다음 코드는 검색결과 목록에서 제품의 노출을 측정합니다.
ga('ec:addImpression', { // Provide product details in an impressionFieldObject.
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel/T-Shirts', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'Black', // Product variant (string).
'list': 'Search Results', // Product list (string).
'position': 1, // Product position (number).
'dimension1': 'Member' // Custom dimension (string).
});
impressionFieldObject에는 name 또는 id 값이 있어야 합니다. 다른 모든 값은
선택사항이며 설정할 필요가 없습니다.
작업 측정
작업은 ec:addProduct 명령어를
productFieldObject와 함께 사용하여 제품 세부정보를 추가하고
ec:setAction 명령어를 사용하여 실행할 작업을 지정합니다.
예를 들어 다음 코드는 검색결과 목록에 표시된 제품 링크의 클릭을 측정합니다.
ga('ec:addProduct', { // Provide product details in a productFieldObject.
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'Black', // Product variant (string).
'position': 1, // Product position (number).
'dimension1': 'Member' // Custom dimension (string).
});
ga('ec:setAction', 'click', { // click action.
'list': 'Search Results' // Product list (string).
});
productFieldObject에는 name 또는 id 값이 있어야 합니다. 다른 모든 값은 선택사항이며
설정할 필요가 없습니다.
노출수 및 작업의 결합
제품 노출수와 작업이 모두 있는 경우 단일 조회에서 결합하고 측정할 수 있습니다.
아래 예에서는 관련 상품 섹션을 사용하여 제품 세부정보 보기를 측정하는 방법을 보여줍니다.
// The impression from a Related Products section.
ga('ec:addImpression', { // Provide product details in an impressionFieldObject.
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel/T-Shirts', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'Black', // Product variant (string).
'list': 'Related Products', // Product list (string).
'position': 1 // Product position (number).
});
// The product being viewed.
ga('ec:addProduct', { // Provide product details in an productFieldObject.
'id': 'P67890', // Product ID (string).
'name': 'YouTube Organic T-Shirt', // Product name (string).
'category': 'Apparel/T-Shirts', // Product category (string).
'brand': 'YouTube', // Product brand (string).
'variant': 'gray', // Product variant (string).
'position': 2 // Product position (number).
});
ga('ec:setAction', 'detail'); // Detail action.
거래 측정
ec:setAction 명령어를 사용하고
작업 유형을 purchase로 설정하여 거래를 측정합니다. 총 수익, 세금, 배송비와 같은
거래 수준 세부정보는
actionFieldObject에 제공됩니다.
ga('ec:addProduct', { // Provide product details in an productFieldObject.
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'black', // Product variant (string).
'price': '29.20', // Product price (number).
'coupon': 'APPARELSALE', // Product coupon (string).
'quantity': 1 // Product quantity (number).
});
ga('ec:setAction', 'purchase', { // Transaction details are provided in an actionFieldObject.
'id': 'T12345', // (Required) Transaction id (string).
'affiliation': 'Google Store - Online', // Affiliation (string).
'revenue': '37.39', // Revenue (number).
'tax': '2.85', // Tax (number).
'shipping': '5.34', // Shipping (number).
'coupon': 'SUMMER2013' // Transaction coupon (string).
});
작업 유형이 purchase 또는 refund인 경우 actionFieldObject에
id 값이 있어야 합니다. 다른 모든 값은 선택사항이며 설정할 필요가 없습니다.
환불 측정
전체 거래를 환불하려면 refund 작업을 설정하고
트랜잭션 ID를 제공합니다.
// Refund an entire transaction.
ga('ec:setAction', 'refund', {
// Transaction ID is only required field for full refund.
'id': 'T12345'
});
일치하는 거래가 없으면 refund 조회가 처리되지 않습니다.
부분 환불을 측정하려면 refund 작업을 설정하고 환불할 거래 ID, 제품 ID,
제품 수량을 지정합니다.
// Refund a single product.
ga('ec:addProduct', {
'id': 'P12345', // Product ID is required for partial refund.
'quantity': 1 // Quantity is required for partial refund.
});
ga('ec:setAction', 'refund', {
'id': 'T12345', // Transaction ID is required for partial refund.
});
환불에 비상호작용 이벤트 사용
이벤트를 사용하여 환불 데이터를 보내야 하는데 이벤트가 일반적으로 측정되는 현장 동작에 포함되어 있지 않은 경우(예: 사용자가 시작하지 않음) 비상호작용 이벤트를 전송하는 것이 좋습니다. 이렇게 하면 이탈률, 사이트에 머문 시간 등의 측정항목이 이벤트에 영향을 받지 않습니다. 예:
ga('send', 'event', 'Ecommerce', 'Refund', {'nonInteraction': 1});
결제 절차 측정
결제 절차의 각 단계를 측정하는 방법은 다음과 같습니다.
- 결제 절차의 각 단계를 측정하는 코드를 추가합니다.
- 해당하는 경우 코드를 추가하여 결제 옵션을 측정합니다.
- 원하는 경우 웹 인터페이스의 관리 섹션에서 전자상거래 설정을 구성하여 결제 유입경로 보고서에 사용자 친화적인 단계 이름을 설정합니다.
1. 결제 단계 측정
결제 절차의 각 단계에 대해 해당하는 코드를 구현하여 Google 애널리틱스로 데이터를 전송해야 합니다.
step필드측정하는 각 결제 단계에 대해
step값을 포함해야 합니다. 이 값은 결제 작업을 전자상거래 설정의 각 단계에 대해 구성한 라벨에 매핑하는 데 사용됩니다.option필드단계가 측정되는 시점에 지정된 결제 단계에 대한 추가 정보가 있는 경우
checkout작업으로option필드를 설정하여 이 정보를 캡처할 수 있습니다. 예를 들어 사용자의 기본 결제 유형을 캡처할 수 있습니다(예:Visa).결제 단계 측정
결제 단계를 측정하려면 각 제품에
ec:addProduct를 사용하세요.ec:setAction은 결제를 나타냅니다. 해당하는 경우ec:setAction에서 추가actionFieldObject를 가져와step및option으로 결제 단계를 설명할 수 있습니다.다음 예에서는 단일 제품으로 결제 절차의 첫 번째 단계를 측정하는 방법 및 결제 유형에 대한 추가 정보를 보여줍니다.
ga('ec:addProduct', { // Provide product details in an productFieldObject. 'id': 'P12345', // Product ID (string). 'name': 'Android Warhol T-Shirt', // Product name (string). 'category': 'Apparel', // Product category (string). 'brand': 'Google', // Product brand (string). 'variant': 'black', // Product variant (string). 'price': '29.20', // Product price (number). 'quantity': 1 // Product quantity (number). }); // Add the step number and additional info about the checkout to the action. ga('ec:setAction','checkout', { 'step': 1, 'option': 'Visa' });
2 결제 옵션 측정
결제 옵션을 사용하면 결제 상태에 대한 추가 정보를 측정할 수 있습니다. 초기 페이지 조회 시 결제 단계를 측정했지만 사용자가 선택한 옵션이 설정된 후 동일한 결제 단계에 대한 추가 정보를 확인할 수 있는 경우에 유용합니다. 예를 들어 사용자가 배송 방법을 선택합니다.
결제 옵션을 측정하려면 ec:setAction를 사용하여 checkout_option을
나타내고 단계 번호와 옵션 설명을 포함합니다.
사용자가 클릭하여 결제 절차의 다음 단계로 이동한 후 이 작업을 측정할 수 있습니다. 예:
// (On "Next" button click)
ga('ec:setAction', 'checkout_option', {'step': 2, 'option': 'FedEx'});
ga('send', 'event', 'Checkout', 'Option', {
hitCallback: function() {
// advance to next page
},
});
3. 결제 유입경로 구성
결제 절차의 각 단계에 보고서에 사용될 설명이 포함된 이름을 지정할 수 있습니다. 이러한 이름을 구성하려면 Google 애널리틱스 웹 인터페이스의 관리 섹션에서 보기(프로필)를 선택하고 전자상거래 설정을 클릭하세요. 전자상거래 설정 안내에 따라 측정할 각 결제 단계에 라벨을 지정합니다.
내부 프로모션 측정
향상된 전자상거래 플러그인에는 웹사이트의 다른 섹션에서 판매를 홍보하기 위해 표시되는 배너와 같은 내부 프로모션의 노출수 및 클릭수를 측정하기 위한 지원이 포함됩니다.
프로모션 노출수
일반적으로 내부 프로모션 노출수는 페이지가 로드될 때 측정되며
ec:addPromo 명령어를 사용하여 초기 페이지 조회와 함께 전송됩니다. 예:
ga('ec:addPromo', { // Promo details provided in a promoFieldObject.
'id': 'PROMO_1234', // Promotion ID. Required (string).
'name': 'Summer Sale', // Promotion name (string).
'creative': 'summer_banner2', // Creative (string).
'position': 'banner_slot1' // Position (string).
});
프로모션 클릭수
내부 프로모션 클릭수는 promo_click
작업을 설정하여 측정할 수 있습니다. 예:
// Identify the promotion that was clicked.
ga('ec:addPromo', {
'id': 'PROMO_1234',
'name': 'Summer Sale',
'creative': 'summer_banner2',
'position': 'banner_slot1'
});
// Send the promo_click action with an event.
ga('ec:setAction', 'promo_click');
ga('send', 'event', 'Internal Promotions', 'click', 'Summer Sale');
예를 들어 노출 및 프로모션 클릭이 포함된 제품 세부정보 페이지를 측정하려면 먼저 초기 페이지 조회로 제품 및 노출 데이터를 전송한 다음 별도의 이벤트로 프로모션 클릭 데이터를 전송합니다.
// 1. Send product and impression data with pageview.
ga('ec:addProduct', {
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'Black', // Product variant (string).
'position': 1, // Product position (number).
});
// The impression from the Related Products section.
ga('ec:addImpression', {
'id': 'P12345', // Product ID (string).
'name': 'Android Warhol T-Shirt', // Product name (string).
'category': 'Apparel/T-Shirts', // Product category (string).
'brand': 'Google', // Product brand (string).
'variant': 'Black', // Product variant (string).
'list': 'Related Products', // Product list (string).
'position': 1, // Product position (number).
});
ga('ec:setAction', 'detail'); // Detail action.
ga('send', 'pageview'); // Send the product data with initial pageview.
// 2. Send the promo click data when the promo click occurs.
// Call this function when promo click occurs.
function onPromoClick() {
ga('ec:addPromo', {
'id': 'PROMO_1234',
'name': 'Summer Sale',
'creative': 'summer_banner2',
'position': 'banner_slot1'
});
// Send the promo_click action with an event.
ga('ec:setAction', 'promo_click');
ga('send', 'event', 'Internal Promotions', 'click', 'Summer Sale');
}
promoFieldObject에는 name 또는 id 값이 있어야 합니다. 다른 모든 값은
선택사항이며 설정할 필요가 없습니다.
전체 예
아래의 코드 스니펫은 향상된 전자상거래 플러그인을 사용하여 초기 노출에서 거래잭션까지 단일 제품의 전자상거래 수명 주기를 측정하는 방법을 보여줍니다.
제품 노출 측정
이 예에서 사용자는 먼저 검색결과 목록에서 제품을 봅니다. 이
제품 노출을 측정하려면 ec:addImpression 명령어를 사용하여
impressionFieldObject에 제품 세부정보를 제공합니다.
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
ga('ec:addImpression', {
'id': 'P12345', // Product details are provided in an impressionFieldObject.
'name': 'Android Warhol T-Shirt',
'category': 'Apparel/T-Shirts',
'brand': 'Google',
'variant': 'black',
'list': 'Search Results',
'position': 1 // 'position' indicates the product position in the list.
});
ga('ec:addImpression', {
'id': 'P67890',
'name': 'YouTube Organic T-Shirt',
'category': 'Apparel/T-Shirts',
'brand': 'YouTube',
'variant': 'gray',
'list': 'Search Results',
'position': 2
});
ga('send', 'pageview'); // Send product impressions with initial pageview.
제품 클릭 측정
그런 다음 사용자가 제품 등록정보를 클릭하여 세부정보를 확인하는 방법으로 특정 제품에 관심을 표현합니다.
해당 제품 클릭을 측정하려면 ec:addProduct 및 ec:setAction을 사용합니다.
// Called when a link to a product is clicked.
function onProductClick() {
ga('ec:addProduct', {
'id': 'P12345',
'name': 'Android Warhol T-Shirt',
'category': 'Apparel',
'brand': 'Google',
'variant': 'black',
'position': 1
});
ga('ec:setAction', 'click', {list: 'Search Results'});
// Send click with an event, then send user to product page.
ga('send', 'event', 'UX', 'click', 'Results', {
hitCallback: function() {
document.location = '/product_details?id=P12345';
}
});
}
그러면 제품 링크를 다음과 같이 구현할 수 있습니다.
<a href="/next-page.html"
onclick="onProductClick(); return !ga.loaded;">
Android Warhol T-Shirt
</a>
제품 세부정보 보기 측정
제품 등록정보를 클릭한 후 사용자가 제품 세부정보 페이지를 봅니다.
이 제품 세부정보 보기를 측정하려면 ec:addProduct 및 ec:setAction을 사용하여
detail 작업을 지정합니다.
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
ga('ec:addProduct', {
'id': 'P12345',
'name': 'Android Warhol T-Shirt',
'category': 'Apparel',
'brand': 'Google',
'variant': 'black'
});
ga('ec:setAction', 'detail');
ga('send', 'pageview'); // Send product details view with the initial pageview.
장바구니에 추가 또는 삭제 측정
사용자가 상품을 장바구니에 추가하여 구매 의도를 표현합니다.
장바구니에 제품 추가 또는 삭제를 측정하려면
ec:addProduct를 사용하고 유형 add 또는 remove를 설정합니다.
// Called when a product is added to a shopping cart.
function addToCart(product) {
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
ga('ec:setAction', 'add');
ga('send', 'event', 'UX', 'click', 'add to cart'); // Send data using an event.
}
결제 절차 측정
이제 사용자가 결제 절차를 시작할 준비가 되었습니다. 이 예에서는 두 단계가 포함되며 각 단계가 별도의 페이지에 표시되어 있습니다.
- 결제 세부정보(payment.html)를 추가합니다.
- 배송 세부정보(shipping.html)를 추가합니다.
해당하는 경우 웹 인터페이스의 관리, 전자상거래 설정에서 결제 유입경로를 제대로 구성했는지 확인하세요. 예:
1단계 - 결제
결제의 첫 번째 단계를 측정하려면 장바구니의 각 제품에 대해 ec:addProduct를 사용하고
ec:setAction을 사용하여 checkout을 표시합니다.
ec:setAction는 actionFieldObject를 사용하여 숫자로 결제 단계를 설명합니다.
또한 option 필드를 사용하여 이 사용자의 기본 결제 유형에 대한
추가 정보가 포함됩니다.
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
/**
* Called when the user begins the checkout process.
* @param {Array} cart An array representing the user's shopping cart.
*/
function checkout(cart) {
for(var i = 0; i < cart.length; i++) {
var product = cart[i];
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
}
}
// In the case of checkout actions, an additional actionFieldObject can
// specify a checkout step and option.
ga('ec:setAction','checkout', {
'step': 1, // A value of 1 indicates this action is first checkout step.
'option': 'Visa' // Used to specify additional info about a checkout stage, e.g. payment method.
});
ga('send', 'pageview'); // Pageview for payment.html
2단계 - 배송
결제의 두 번째 단계를 측정하려면 장바구니의 각 제품에 대해 ec:addProduct를 사용하고
ec:setAction을 사용하여 결제를 표시합니다. 이 경우
초기 페이지 조회가 전송될 때
선택된 배송 옵션에 관한 추가 정보가 없으므로
ec:setAction을 사용하여 별도로 처리되어 checkout_option을 표시합니다.
// Measure checkout step 2:
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
/**
* Called when the user begins the checkout process.
* @param {Array} cart An array representing the user's shopping cart.
*/
function checkout(cart) {
for(var i = 0; i < cart.length; i++) {
var product = cart[i];
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
}
}
ga('ec:setAction','checkout', {'step': 2});
ga('send', 'pageview'); // Pageview for shipping.html
// Called when user has completed shipping options.
function onShippingComplete(stepNumber, shippingOption) {
ga('ec:setAction', 'checkout_option', {
'step': stepNumber,
'option': shippingOption
});
ga('send', 'event', 'Checkout', 'Option', {
hitCallback: function() {
// Advance to next page.
}
});
}
그러면 양식을 다음과 같이 구현할 수 있습니다.
<a href="/next-page.html"
onclick="onShippingComplete(2, 'FedEx'); return !ga.loaded;">
Continue
</a>
거래 측정
마지막으로 사용자가 결제 절차를 완료하고 구매를 제출합니다.
하나 이상의 제품 판매를 측정하려면 ec:addProduct을 사용하여
각 제품을 추가한 다음 ec:setAction를 사용하여 purchase를 지정합니다. 총 수익, 세금 등 거래 수준 정보는
actionFieldObject를
통해 지정할 수 있습니다. 예:
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
ga('ec:addProduct', {
'id': 'P12345',
'name': 'Android Warhol T-Shirt',
'category': 'Apparel',
'brand': 'Google',
'variant': 'black',
'price': '29.20',
'quantity': 1
});
// Transaction level information is provided via an actionFieldObject.
ga('ec:setAction', 'purchase', {
'id': 'T12345',
'affiliation': 'Google Store - Online',
'revenue': '37.39',
'tax': '2.85',
'shipping': '5.34',
'coupon': 'SUMMER2013' // User added a coupon at checkout.
});
ga('send', 'pageview'); // Send transaction data with initial pageview.
현지 통화 지정
기본적으로 Google 애널리틱스 관리 웹 인터페이스를 통해 모든 거래 및 상품에 대해 공통된 전체 통화를 구성할 수 있습니다. 기본적으로 전체 통화는 모든 상품 및 거래에 사용됩니다. 여러 통화로 거래를 처리하는 웹사이트의 경우 전자상거래 플러그인을 사용하여 거래의 현지 통화를 지정할 수 있습니다.
현지 통화는 ISO 4217 표준으로 지정해야 합니다. 지원되는
통화 변환의 전체 목록은 통화 코드 참조 문서를
확인하세요.
현지 통화는 currencyCode 추적기 속성을 사용하여 지정됩니다. 예를 들어 이 추적기는 통화 값을 유로로 전송합니다.
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');
ga('set', 'currencyCode', 'EUR'); // Set currency to Euros.
ga('ec:addProduct', {
'id': 'P12345',
'name': 'Android Warhol T-Shirt',
'category': 'Apparel',
'brand': 'Google',
'variant': 'black',
'price': '21.89',
'quantity': 1
});
ga('ec:setAction', 'purchase', {
id: 'T12345',
affiliation: 'Google Store - Online',
revenue: '28.03',
tax: '2.14',
shipping: '4.00',
coupon: 'SUMMER2013'
});
ga('send', 'pageview');