맞춤 Viewed Page 지표를 만드는 방법

학습 내용

맞춤 Viewed Page 지표를 만드는 방법을 알아보고, 고객이 사이트에서 제품 페이지가 아닌 페이지를 방문하는 시점을 파악해 보세요.

시작하기 전에 알아야 할 것

계속하기 전에 트래킹하려는 각 페이지에 Klaviyo의 온사이트 JavaScript(Klaviyo.js)가 설치되어 있는지 확인해 주세요. Shopify의 경우, 설정 가이드를 사용해 스토어를 통합하고 사이트 내 트래킹을 활성화해 주세요. 다른 사이트의 경우 Klaviyo 온사이트 트래킹 시작하기를 따르세요. 아래 코드 스니펫은 Klaviyo.js가 계정으로 이벤트를 전송할 수 있어야 해요.

페이지 조회 지표를 추적하려는 사이트의 각 페이지에 다음 JavaScript 코드 조각을 추가하는 것이 중요해요. 이 코드 조각은 랜딩 페이지와 기타 모든 사이트 페이지에서 모두 작동해요.

코드 조각 설치

1. 추적하려는 각 페이지에 아래의 전체 스니펫을 복사해 붙여넣어 주세요. 게시하기 전에 아래 설명에 따라 페이지 이름과 (선택 사항인) 이벤트 이름을 맞춤설정하거나, 대체 URL 스니펫을 사용해 주세요.
2. 그런 다음 업데이트된 코드로 웹사이트 파일을 저장하고 게시하세요.

<script type="text/javascript"> 
//Script to initialize Klaviyo object on page load
!function(){if(!window.klaviyo){window._klOnsite=window._klOnsite||[];try{window.klaviyo=new Proxy({},{get:function(n,i){return"push"===i?function(){var n;(n=window._klOnsite).push.apply(n,arguments)}:function(){for(var n=arguments.length,o=new Array(n),w=0;w<n;w++)o[w]=arguments[w];var t="function"==typeof o[o.length-1]?o.pop():void 0,e=new Promise((function(n){window._klOnsite.push([i].concat(o,[function(i){t&&t(i),n(i)}]))}));return e}}})}catch(n){window.klaviyo=window.klaviyo||[],window.klaviyo.push=function(){var n;(n=window._klOnsite).push.apply(n,arguments)}}}}(); </script>
<script type="text/javascript"> 
//Script to track viewed page
klaviyo.track("Viewed Page", {           
   PageName: "About Us"   
}); 
</script>

식별된 방문자가 이 스니펫이 포함된 페이지를 조회하면, Klaviyo가 사용자 지정 Viewed Page 지표 아래에 PageName 값 "About Us"로 이벤트를 기록해요.

PageName 값 변경

위의 예시 값을 변경해 사이트의 다른 페이지 이름을 나타낼 수 있어요.

1. 예시 "About Us" 값을 삭제하세요.
2. 따옴표 안에 원하는 텍스트를 추가해 주세요. 예를 들어 브랜드 스토리 페이지 방문을 추적하려면 값으로 "Customer Stories"를 대신 사용할 수 있어요.

조회한 페이지 이벤트 이름 변경하기

Viewed Page 이벤트 이름을 다른 이름(예: Visited Page, Tracked Page 등)으로 변경할 수 있어요.

1. 예시 페이지 조회 이벤트 이름을 삭제해 주세요.
2. 따옴표 안에 포함된 원하는 텍스트를 추가하세요.

URL로 조회한 페이지 트래킹

페이지 이름 대신 URL로 Viewed Page를 추적하려면, 첫 번째 스니펫 대신 아래의 대체 스니펫을 사용해 주세요. 따옴표 없이, 표시된 그대로 window.location.href을(를) 그대로 유지해 주세요. 방문자가 보고 있는 페이지의 URL로 url 속성을 자동으로 설정해요.

<script type="text/javascript"> 
//Script to initialize Klaviyo object on page load
!function(){if(!window.klaviyo){window._klOnsite=window._klOnsite||[];try{window.klaviyo=new Proxy({},{get:function(n,i){return"push"===i?function(){var n;(n=window._klOnsite).push.apply(n,arguments)}:function(){for(var n=arguments.length,o=new Array(n),w=0;w<n;w++)o[w]=arguments[w];var t="function"==typeof o[o.length-1]?o.pop():void 0,e=new Promise((function(n){window._klOnsite.push([i].concat(o,[function(i){t&&t(i),n(i)}]))}));return e}}})}catch(n){window.klaviyo=window.klaviyo||[],window.klaviyo.push=function(){var n;(n=window._klOnsite).push.apply(n,arguments)}}}}(); </script>
<script type="text/javascript"> 
//Script to track viewed page
klaviyo.track("Viewed Page", {           
      url: window.location.href   
}); 
</script>

조회한 페이지 트래킹 테스트

Viewed Page 트래킹이 작동하는지 테스트하려면 페이지가 게시되었는지 확인해 주세요. 페이지 URL에 ?utm_email=youremail@example.com을(를) 추가하고, youremail@example.com을(를) 본인의 테스트 이메일 주소로 바꿔 주세요. URL에 이미 ?이(가) 포함되어 있다면 대신 &utm_email=youremail@example.com을(를) 사용해 주세요. 매개변수를 # 프래그먼트 앞에 추가한 다음 페이지를 다시 로드해서 브라우저를 식별하고 방문을 추적하세요.

1. 페이지를 방문한 후 Klaviyo 계정으로 들어가세요.
2. 분석 > 지표로 이동합니다.
3. 위 필드에서 Viewed Page (또는 이 지표에 사용하는 대체 이름)를 검색하세요.

4. Viewed Page 지표(또는 사용 중인 다른 지표)를 클릭해 주세요.
5. 활동 피드 탭을 선택해 주세요. 테스트 프로필의 이벤트를 찾아보세요. 해당 메뉴를 열고 활동 세부 정보를 선택한 다음, 페이지 이름 또는 URL이 방문한 페이지와 일치하는지 확인해 주세요.

활동이 보이면 지표가 성공적으로 트래킹되고 있다는 뜻이에요. 활동이 보이지 않으면 Klaviyo에서 페이지를 새로고침해 보세요. 그래도 표시되지 않으면 게시된 페이지에 Klaviyo.js와 선택한 스니펫이 설치되어 있는지 확인한 다음, 테스트 이메일 주소로 다시 방문해 보세요. Shopify의 경우 아래의 동의 요구 사항도 확인해 보세요.

추가 자료