Google 유니버설 애널리틱스를 프레시마케터와 통합하기

웹사이트에서 Google Universal Analytics (UA)를 사용하는 경우, Freshmarketer와 UA를 통합하여 UA가 수집한 웹 메트릭과 함께 실험 결과를 얻을 수 있습니다.

Freshmarketer와 UA를 통합해야 하는 이유는 무엇인가요?

Freshmarketer와 UA를 통합하면 다음을 할 수 있습니다:

• 실험의 각 변형에 대해 UA가 추적한 웹 메트릭 보기 (Freshmarketer에서 실행 중)

• Freshmarketer 실험에 포함된 방문자만 필터링하여 UA에서 보고서 보기

• Freshmarketer 실험이 Google Analytics가 추적하는 메트릭에 미치는 영향 이해

아래의 단계를 따라 UA와 Freshmarketer를 성공적으로 통합하세요

STEP 1:

Freshmarketer JS 스니펫이 웹사이트 헤더에 삽입되어 있는지 확인하세요

아직 삽입하지 않았다면, 아래 도움말 문서를 참조하여 Freshmarketer JS 스니펫을 웹사이트에 삽입하는 방법을 알아보세요

1. 웹사이트에 Freshmarketer 스니펫 추가하기

2. Freshmarketer 스니펫 설치 확인을 위한 개발자 가이드

STEP 2:

Freshmarketer JS 스니펫을 설치한 후, GA JS 스니펫을 Freshmarketer JS 스니펫 바로 아래에 삽입해야 합니다

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script>

위 스니펫에서 ID를 자신의 GA 추적 ID로 교체하세요. Google Analytics 추적 ID는 Google Analytics 계정에 로그인 => 관리자 => 속성 아래 => 추적 정보 JS 선택 => 상단에서 UA ID를 확인할 수 있습니다 (스크린샷 참조)

STEP 3:

Freshmarketer JS 스니펫과 GA 코드 스니펫을 삽입한 후, 이제 사용자 정의 차원을 생성해야 합니다

Freshmarketer 데이터가 UA에 정확하게 매핑되도록 UA에서 사용자 정의 차원을 생성하는 것이 매우 중요합니다.

UA 계정에 로그인하세요. '관리자' 탭으로 이동하여 "사용자 정의 차원"을 선택하세요

"사용자 정의 차원" 선택하기

새로운 ‘사용자 정의 차원’ 생성하기

새로운 "사용자 정의 차원" 생성

1. 실험마다 하나의 사용자 정의 차원을 사용하여 모호성을 방지하세요.

2. 생성한 사용자 정의 차원을 만든 후 차원 매개변수를 추적하세요 (아래 참조)

GA 코드 생성

단계 4:

Freshmarketer의 GA 코드 통합

Freshmarketer의 GA 코드는 각기 다른 목적에 따라 두 가지 유형으로 제공됩니다:

1. A/B 테스트 및 개인화를 위한 GA 통합

2. 모든 기능(히트맵, URL 분할 테스트 등)을 위한 GA 통합

3. 특정 실험을 위한 GA 통합

A/B 테스트를 위한 GA 통합:

Freshmarketer의 A/B 테스트 데이터를 GA 계정으로 전송하려면 아래 코드를 복사한 후 GA 추적 ID를 GA 계정 추적 ID 및 사용자 정의 차원을 생성할 때 기록한 Dimensionindex 값으로 교체하세요.

<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config', 'GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + exps[0]['experimentName'] +' : ' + exps[0]['appliedVariationName']});

}

});

</script>

참고: 코드의 GA_Tracking_ID를 추적 ID로 교체하고 Index를 사용자 정의 차원 ID로 교체하세요. GA의 추적 코드 및 Freshmarketer의 GA 통합 코드 다음에 Freshmarketer의 JS 코드를 붙여넣으세요.

교체 후 최종 코드는 다음과 같습니다:

A/B 테스트 및 개인화를 위한 최종 예제 코드:

<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS 코드**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script> 

<script>   //**GA 추적 코드**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config', 'UA-4428xxx2-1', {   //**GA 추적 ID**

'custom_map': {'dimension1': 'zarget'}  //**3단계에서 기록한 차원 값 “1”**

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + exps[0]['experimentName'] +' : ' + exps[0]['appliedVariationName']});

}

});

</script>

모든 기능에 대한 GA 통합:

히트맵 및 분할 URL 테스트와 같은 Freshmarketer의 다른 기능 데이터를 전송하려면 다음 통합 코드를 복사하여 붙여넣으십시오.

<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

});

}

});

</script>

참고: 코드에서 GA_Tracking_ID를 추적 ID로 교체하십시오. GA의 사용자 정의 차원 인덱스로 Index를 교체하십시오. Freshmarketer의 JS 코드를 GA의 추적 코드 및 Freshmarketer의 GA 통합 코드 뒤에 붙여넣으십시오.

교체 후 최종 코드는 아래와 같이 보일 것입니다:

모든 다른 기능에 대한 최종 예제 코드:

<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS 코드**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script> 

<script>    //**GA 추적 코드**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','UA-4428XXXX-1', {   //**GA 추적 ID**

'custom_map': {'dimension1': 'zarget'}      //** STEP 3에서 기록한 고객 차원 값 **

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

});

}

});

</script>

특정 실험에 대한 GA 통합:

특정 실험 또는 캠페인의 Freshmarketer 데이터를 추적하려면 다음 GA 통합 코드를 복사하여 붙여넣으십시오. 실험 ID는 실험의 요약 탭에서 찾을 수 있습니다. 스크린샷을 참조하십시오 

<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.id === XXXX){                 =========> //**obj.id는 실험의 해시 ID입니다**//

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

}

});

}

});

</script>

참고: 위 코드의 "XXXX"를 Preflight -> Experiment Info에 있는 해시 ID로 교체하세요

값을 교체한 후 최종 코드는 아래와 같이 보일 것입니다:

특정 실험에 대한 최종 예제 코드:

<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS 코드**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script>

<script>    //**GA 추적 코드**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config',”UA-4428XXXX-1”, {         //**GA 추적 ID**

'custom_map': {'dimension1': 'zarget'}     //** STEP 3에서 기록한 고객 차원 값 **

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.id === "425350525A514XX159535D564XXC5D5C58XX5B5B"){   ==> //**obj.id is Hash ID of your experiment**//

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

}

});

}

});

</script>

STEP 5:   

데이터 수집이 시작되면, Google Analytics 계정 => 행동 => 이벤트 => 상위 이벤트로 이동합니다.

보조 차원을 클릭하고 이전에 생성한 사용자 정의 차원을 선택합니다. 이제 Freshmarketer를 통해 GA에서 생성된 변형별 데이터를 볼 수 있습니다.

기술 지원 

 찾고 있는 것이 보이지 않나요? 메일을 보내주세요