9.3 Google 태그 관리자 변수 구성

https://tagmanager.google.com/ 으로 이동하여 개인 로그인 세부 정보를 사용하여 로그인합니다.

Google Analytics 태그를 만들고 구성한 후에는 이제 Google 태그 관리자 변수(Adobe Launch에서 사용하는 데이터 요소 등)를 구성할 준비가 되었습니다.

Google 태그 관리자 UI에서 변수로 이동합니다. 내장 변수 목록이 표시됩니다.

Google 태그 관리자 설정

추가해야 하는 첫 번째 변수가 호출됩니다 customerEmail. 고객이 Platform Demo 웹 사이트에서 프로파일을 작성하면 Platform(플랫폼)에서 고객의 이메일 주소를 고객 프로파일에 연결합니다.
플랫폼 데모 웹 사이트에서 정보는 종종 localStorage에 저장됩니다. 이 변수에 액세스하려면 Google 태그 관리자 변수를 채우는 사용자 지정 Javascript가 필요합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

Google 태그 관리자 설정

Google 태그 관리자 설정

먼저 "제목이 없는 변수"의 이름을 좀 더 설명적인 이름으로 바꿉니다.

제목 없는 변수
customerEmail

구성 부품을 클릭하면 변수 유형을 선택할 수 있습니다.

Google 태그 관리자 설정

이거 골라보세요

변수 유형
사용자 지정 Javascript

Google 태그 관리자 설정

아래 화면에 입력할 사용자 지정 코드입니다.

function() {
  var email = localStorage.getItem("email");
  return email;
}

코드를 붙여넣은 후에 스크린이 이렇게 보입니다.
Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

스크린이 이렇습니다.

Google 태그 관리자 설정

다음 변수에 대해 이 프로세스를 반복합니다.

  • 사용자 정의 변수 섹션에서 새로 만들기를 클릭합니다.
  • 이름 바꾸기 Untitled Variable
  • 구성 유형으로 사용자 지정 JavaScript 선택
  • Java-Script 코드 붙여넣기
  • 저장을 클릭하여 새 변수를 저장합니다.

다음 변수가 됩니다 customerMobileNr. 고객이 Platform Demo 웹 사이트에서 프로파일을 작성하면 Platform(플랫폼)에서 고객의 모바일 번호를 고객 프로파일에 연결합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 customerMobileNr
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var mobilenr = localStorage.getItem("mobilenr");
  return mobilenr;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음 변수가 됩니다 customerFirstName. 고객이 Platform Demo 웹 사이트에서 프로파일을 작성하면 Platform(플랫폼)에서 고객의 이름을 고객 프로파일에 연결합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 customerFirstName
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var firstname = localStorage.getItem("firstname");
  return firstname;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: customerLastName. 고객이 Platform Demo 웹 사이트에서 프로파일을 작성하면 Platform에서 고객의 성을 고객 프로파일에 연결합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 customerLastName
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var lastname = localStorage.getItem("lastname");
  return lastname;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: aepTenantId. 고객이 Platform Demo 웹 사이트에서 프로파일을 작성하면 Platform에서 고객의 성을 고객 프로파일에 연결합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 aepTenantId
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var aepTenantId = localStorage.getItem("aepTenantId");
  return aepTenantId;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: customerLoggedIn. 고객이 플랫폼 데모 웹 사이트에 로그인하면 이 변수를 [예]로 설정하고 시작 규칙 구성에서 해당 조건을 사용합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 customerLoggedIn
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var loggedin = localStorage.getItem("loggedin");
  return loggedin;
}

화면이 다음과 같아야 합니다.
Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: brandName. 관리 - 메뉴에서 데모할 브랜드를 선택하면 brandName이 Adobe Experience Platform으로 전송됩니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 brandName
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var brandName = localStorage.getItem("brandName");
  return brandName;
}

화면이 다음과 같아야 합니다.
Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음 변수는 같은 프로세스에서 만들어지지만 코드가 약간 다릅니다.

필요한 다음 변수를 productProductView호출합니다. 고객이 제품을 볼 때 이 변수는 제품 보기 정보를 저장합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 productProductView
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var productview = JSON.parse(localStorage.getItem("thisProductView"));
  return productview;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음 변수가 호출됩니다 return1. 필요한 경우 이 변수를 사용하여 숫자 값 1을 반환합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 return1
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  return 1;
}

화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

Adobe 애플리케이션을 사용하여 작업했다면 ECID를 캡처해야 합니다. 우리는 쇼케이스할 것이기 때문에, 플랫폼에 대한 Google 전용 접근 방식으로도 이 작업을 수행할 수 있습니다. 우리는 Google Analytics의 고유한 Google 식별자를 저장할 것입니다. 이 변수에 클라이언트측 ID 값을 할당합니다.

다음 변수가 호출됩니다 gaClientId. 모든 Google Analytics 데이터의 키로 이 변수를 사용합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 변수 유형으로 1차 쿠키 선택

Google 태그 관리자 설정

  • 쿠키 _ga 이름으로 선택

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: pageTimeStamp. Adobe Platform(플래시 플랫폼)을 방문할 때마다 고유한 타임스탬프가 필요합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 pageTimeStamp
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
var date = new Date();

var month = date.getUTCMonth();
var day = date.getUTCDate();
var hour = date.getUTCHours();
var min = date.getUTCMinutes();
var sec = date.getUTCSeconds();

month = (month < 9 ? "0" : "") + (month+1);
day = (day < 10 ? "0" : "") + day;
hour = (hour < 10 ? "0" : "") + hour;
min = (min < 10 ? "0" : "") + min;
sec = (sec < 10 ? "0" : "") + sec;

var str = date.getFullYear() + "-" + month + "-" + day + "T" +  hour + ":" + min + ":" + sec + ".000Z";

return str;
}

Google 태그 관리자 설정

저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: pageHitId. Adobe는 플랫폼에 대한 모든 호출에서 고유한 HitId가 필요합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 Untitled Variable 바꾸기 pageHitId
  • 사용자 지정 Javascript를 변수 유형으로 선택
  • 이 사용자 지정 JavaScript 코드를 붙여넣습니다.
function() {
  var min = 111111111;
  var max = 9999999999999;
  var randomNumber = Math.random() * (max - min) + min;
  return String(randomNumber);
}

Google 태그 관리자 설정

코드 조각을 저장한 다음 저장을 다시 클릭하여 변수 구성을 저장합니다.

Google 태그 관리자 설정

다음으로 JavaScript 객체를 참조하여 사용자 지정 코드 없이 Google 태그 관리자에서 사용할 수 있는 일부 변수를 캡처합니다.

이렇게 하려면 다음 4단계를 수행합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름 바꾸기 Untitled Variable
  • 변수 유형으로 JavaScript 변수 선택
  • JavaScript 변수 이름을 입력합니다.
  • 저장을 클릭하여 새 변수를 저장합니다.

첫 번째: customerLanguage. 브라우저 설정에서 고객이 선호하는 언어를 캡처합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 customerLanguage.
  • 변수 유형으로 JavaScript 변수를 선택합니다.

Google 태그 관리자 설정

  • Enter the JavaScript Variable name: navigator.language.
    이제 화면이 다음과 같아야 합니다.

Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: pageType. 새로운 페이지를 로드할 때마다 페이지 유형을 캡처해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 pageType.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: digitalData.category.siteSection.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: productCategory. 모든 제품 보기에 대해 제품의 카테고리를 캡처하여 Platform으로 전송해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 productCategory.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: digitalData.product.category.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: productName. 모든 제품 보기에 대해 제품 이름을 캡처하여 Platform(플랫폼)으로 전송해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 productName.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: digitalData.product.name.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: productPrice. 모든 제품 보기에 대해 제품 가격을 캡처하여 Platform(플랫폼)으로 전송해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 productPrice.
  • 사용자 지정 Javascript를 변수 유형으로 선택합니다.
  • 아래 코드를 붙여 넣어 사용자 지정 Javascript를 입력합니다.
function() {
  var price = Number(digitalData.product.price);
  return price;
}

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: productImageUrl. 모든 제품 보기에 대해 제품의 이미지 URL을 캡처하여 Platform으로 전송해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 productImageUrl.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: digitalData.product.imageUrl.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: productInteraction. 모든 제품 보기의 경우 상호 작용 유형(보기, 장바구니에 추가, 구매 등)을 캡처하여 플랫폼에 보내야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 productInteraction.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: digitalData.product.interaction.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

다음: pageUserAgent. 모든 페이지 보기의 경우 사용자 장치 유형 및 운영 체제를 캡처하여 Platform으로 전송해야 합니다. 사용자 에이전트를 사용하여 이 정보를 파생합니다. 사용자 에이전트에 대한 자세한 내용은 다음 링크를 참조하십시오. https://en.wikipedia.org/wiki/User_agent

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 pageUserAgent.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: navigator.userAgent.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

거의 완료되었습니다. 이제 다음을 수행할 시간: pageName. 새로운 페이지를 로드할 때마다 페이지 이름을 캡처하여 AA, AAM 및 Platform로 전송해야 합니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 pageName.
  • 변수 유형으로 JavaScript 변수를 선택합니다.
  • Enter the JavaScript Variable name: document.title.

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

그리고 마지막 것은: pageUrl. 새로운 페이지를 로드할 때마다 URL을 캡처하여 다른 솔루션으로 전송해야 합니다.
페이지 URL은 이미 Google 태그 관리자에 내장된 변수이므로 이 변수를 정의할 필요가 없습니다. 그러나 플랫폼에 대한 다른 정보와의 일관성을 위해 pageUrl을 정의할 것입니다.

사용자 정의 변수 - 섹션에서 새로 만들기를 클릭합니다.

  • 이름을 다음으로 Untitled Variable 변경합니다 pageUrl.
  • URL 변수 유형으로 선택합니다.

Google 태그 관리자 설정

이제 화면이 다음과 같아야 합니다.Google 태그 관리자 설정

  • 저장을 클릭하여 새 변수를 저장합니다.

Google 태그 관리자 설정

필요한 모든 Google 태그 관리자 변수 구성을 완료했습니다.

다음 단계: 9.4 플랫폼 데이터 세트 검색

모듈 9로 돌아가기

모든 모듈로 돌아가기

이 페이지에서는