커뮤니티2
페이스북
트위터
카카오톡
카카오스토리
네이버밴드
URL복사
어도비런치[Adobelaunch] 어도비런치 커뮤니티입니다.
어도비(Data Collection) 디버깅하기 - 1. 런치가 제대로 설치되어있는지 확인하기
어도비 런치(Data Collection)을 통해 룰을 생성하게되면 해당 룰을 배포해야하는데요 그 전에 정상적으로 작동하는지 또한 확인해야합니다.
실제로 Production에 배포하기 전에 개발 단계에서도 제대로 작동하는지 확인하지 않으면 배포 후 데이터가 수집되지 않는 등 안좋은 결과를 초래할 수 있습니다.
여기서 Chrome의 Adobe Experience Platform Debugger를 사용하면 손쉽게 배포 전 그리고 배포 후에도 디버깅을 진행할 수 있습니다.
- https://chromewebstore.google.com/detail/adobe-experience-platform/bfnnokhpnncpkdmbokanobigaccjkpob
위 URL에 접근하여 [Chrome에 추가]를 클릭하면 됩니다.
추가가 완료되었다면 이제 어도비 런치가 설치되어있는 사이트로 이동합니다. 그리고 Adobe Experience Platform Debugger를 실행합니다.
배포 없이 처음 실행하면 다음과 같이 Not Found만 표시될 것 입니다. 이 상태에서 사이트를 다시 [새로고침]해줍니다.
그리고나서 [Experience Platform Tags > Configuration]을 클릭해보면 실제로 내가 추가한 Production의 어도비 런치(Data Collection)코드를 확인할 수 있습니다.
내가 넣은 코드가 확인되었다면 정상적으로 삽입이 완료된 것 입니다.
다음 글에서 실제로 개발환경 디버깅 및 배포를 진행해보겠습니다.
-
Adobe Launch를 통해 Adobe Analytics 설치하기
이번 글에서는 Adobe Launch를 통해 Adobe Analytics를 설치하는 방법에 대해 알아보겠습니다. Adobe Analytics Report Suite의 경우 이전 게시글에서 이미 만들어놨기 때문에 해당 Report Suite을 사용하도록 하겠습니다. Report Suite관련 글 - 링크 바로 실습을 진행해보겠습니다. 1 - 프로퍼티로 이동하여 [Extensions]로 이동합니다. Adobe Launch의 Extension은 어도비 런치에서 사용할 수 있는 도구(Tools)들을 모아놓은 공간이라고 보면 됩니다. 맨 처음 접속하면 Core가 이미 설치돼있는데 코어는 어도비 런치에서 Rule을 만들 때 기본적으로 설정할 수 있는 내용들을 내포하고 있습니다. 가령 Adobe Launch코드가 발동할 때 Dom Ready에서 룰이 발동하게 하거나 특정 페이지에서 발동하게 하거나 하는 등 기본적인 조건을 설정할 수 있게 해줍니다. 바로 이런 룰을 설정하는데 필요한 도구를 모아둔 공간이 Extension입니다. 정리하자면 우리가 Launch의 Rule을 통해 어떤 조건을 설정하거나 어디로 데이터를 전송하거나 하려면 바로 이 Extension을 설치해야 하는 것 입니다. 즉 Adobe Analytics로 데이터를 보내거나 혹은 Adobe Target을 설치하거나 심지어 Google Analytics로 데이터를 보내고싶다면 바로 여기서 Extension을 설치하여 룰에서 사용하면 됩니다. 2 - 상단의 [Catalog]를 클릭한 뒤 [Adobe Analytics]를 검색합니다. 그럼 Adobe Analytics Extension이 나오는데요 해당 Extension을 클릭합니다. 3 - 우측의 Install을 클릭합니다. 4 - 다음과 같은 화면이 나온다면 이제 추가 정보를 입력해야합니다. 많은 정보를 입력할 수 있지만 오늘은 우선 [Report Suites]영역만 채워 페이지뷰만 전달받아 볼 예정입니다. 이미 눈치채셨겠지만 Report Suite에 지난번 만들었던 Report Suite을 입력하면 됩니다. 다만 입력하는 곳이 총 세 군데 존재하는데 지난번 글에서 이야기했던 Dev, Staging, Production 환경입니다. 각각 환경별로 다른 Report Suite에 데이터를 집어넣어 개발때 테스트한 데이터가 실제 운영환경에는 수집되지 않도록 조절할 수 있습니다만 지금 우리는 그렇게까지 복잡하게 하지 않고 하나의 Report suite을 세 환경 모두에 사용하는 것으로 하겠습니다. Report suite에 값을 모두 넣었다면 우측 상단의 [Save]를 눌러 완료합니다. 5 - 이제 [Rules]로 이동해 [Add Rule]을 클릭합니다. 그런 뒤 Events의 [+ Add]를 클릭합니다. 6 - Event Type을 Library Loaded (Page Top)으로 선택한 뒤 우측 상단의 [Keep Changes]를 클릭합니다. 7 - 그런 다음 Action의 [+ Add]를 클릭합니다. 8 - Extension을 [Core]에서 [Adobe Analytics]로 변경하고 Action Type을 [Send Beacon]으로 변경합니다. 그런 뒤 s.t()를 선택합니다. 간략하게 이야기하자면 어도비로 데이터를 전송할 것 인데 써있는 그대로 해당 데이터는 페이지뷰 형태로 보낸다는 의미로 받아들이면 됩니다. 9 - 완료되었다면 우측 상단의 [Save]를 클릭합니다. 10 - 이제 Publishing Flow로 이동해 지난번 [First work]처럼 배포를 진행합니다. 11 - 배포가 완료되면 사이트로 이동해 디버거를 실행하고 왼쪽 메뉴의 [Analytics]를 클릭한 뒤 사이트를 새로고침합니다. 그럼 다음과 같이 이벤트가 발동한 것을 확인할 수 있습니다.
-
어도비(Data Collection) 디버깅하기 - 3. 실제 Production환경에 배포하기
이번 글에서는 지난번 Dev에 배포했던 내용을 실제 Production에 배포해보도록 하겠습니다. 지난 어도비(Data Collection) 디버깅하기 - 2. 디버거를 통해 개발환경 적용해보기에서 console.log("Custom Rule");을 Dev에 배포했었는데요 Production으로 옮겨보겠습니다. 어렵지 않기 때문에 바로 진행해보도록 하겠습니다. 1 - Adobe Launch에 접속해 왼쪽의 [Publishing Flow]를 클릭한 뒤 지난번 Dev에 배포했던 카드 우측 상단의[...]을 클릭합니다. 그리고나서 [Approve & Publish to Production]을 클릭하면 끝입니다. 여기서 보면 그 외에도 여러가지 옵션이 있지만 모두 Submitted와 Approved에 연관된 옵션들입니다. 따라서 우리 회사에서 배포 프로세스를 어떻게 타는지에 따라 나머지도 이용하면 됩니다. 대부분은 Dev에서 디버깅을 통해 태깅을 완료하면 Production으로 바로 옮기는 경우가 많습니다. 2 - 클릭하면 처음에 Published로 바로 안가고 Approved로 이동하는 것을 확인할 수 있습니다. 원래는 Approved단계가 완료된 후 Published로 이동하기 때문에 해당 단계로 잠시 이동하는것 뿐 조금 기다리면 Published로 이동합니다. 3 - 모든 작업이 완료되면 아래와 같이 Published로 이동하게 됩니다. 4 - 사이트로 이동해 개발자도구(F12)의 콘솔을 확인해보면 Dev환경으로 Replace하지 않아도 정상적으로 "Custom Rule"이 출력되는 것을 확인할 수 있습니다.
-
어도비(Data Collection) 디버깅하기 - 2. 디버거를 통해 개발환경 적용해보기
어도비 런치(Data Collection)로 룰을 작성한 뒤에 우리는 세 가지 환경에 데이터를 배포할 수 있습니다. 각각 Dev, Staging, Production환경인데요 앞에서 계속 이야기했듯이 Production환경은 실제 작업 내용이 배포되는 환경입니다. 그렇다면 Production이 아닌 Dev 혹은 Staging에서 데이터를 확인해야하는데 실제 Dev나 Staging서버가 없는 경우 참 난감합니다. 하지만 다행히도 어도비 디버거(Adobe Experience Platform Dibugger)를 사용하면 이를 해결할 수 있는데요 실제 Production환경에서도 디버거를 통해 Dev환경을 적용해볼 수 있습니다. 단순히 배포되는 형태가 아닌 내가 사용하고있는 크롬 브라우저에서만 작동하기 때문에 테스트용도로 활용할 수 있습니다. 마치 GTM의 미리보기 처럼 말이죠 실제로 진행해보겠습니다. 지난번 실습에서 테스트 룰을 하나 만들어놨었는데요 해당 룰에는 다음과 같이 코딩을 진행했었습니다 - 지난번 실습 내용: http://googleanalytics360.com/board/view.php?bo_table=adobelaunch&wr_id=3&page= 해당 룰이 발동하면 개발자 콘솔(F12)에 "Custom Rule" 이라는 문자를 확인할 수 있게 될 것입니다. 해당 룰을 Dev환경에 배포한 뒤 실제로 확인해보겠습니다. 1 - 왼쪽 메뉴의 Publishing Flow로 이동합니다. 2 - 오른쪽 상단의 [Add Library]를 클릭합니다. 3 - 그 뒤 뜨는 창에서 Name을 입력하고 Environment를 [Development]로 설정한 뒤 [Add All Changed Resource]를 클릭하고 [Save & Build to Development]를 클릭합니다. 여기서 Add All Changed Resource를 클릭하면 가운데 목록이 뜨는데 내가 작업한 룰을 모두 가져오는 버튼입니다. 따라서 정리하자면 내가 작업한 룰들을 배포할건데 [Development] 환경에 배포할 거라는 뜻이 됩니다. 간단하죠? 4 - 그럼 아래와 같이 Development영역에 First work가 생기고 로딩중인 것을 확인할 수 있습니다. 이미 예상하시겠지만 Development에서 최종 Production으로 배포를 하면 Published쪽으로 카드가 이동하게 됩니다. Approved영역을 Staging으로 보면 되는데 사실 잘 사용하진 않습니다. 5 - 아래와 같이 준비가 완료되면 초록색 불이 들어옵니다. 6 - 이제 Dev환경에 배포가 완료되었으니 해당 환경을 적용해보겠습니다. 왼쪽의 [Environments]를 클릭한 뒤 Development환경의 Install영역 박스를 클릭합니다. 7 - 박스의 중간 영역의 script를 복사합니다. 해당 스크립트는 프로덕션과는 다른 스크립트입니다. 8 - 사이트로 이동해 어도비 디버거(Adobe Experience Platform Dibugger)를 실행한 뒤 [새로고침] 하고 [Experience Platform Tags > Configuration]으로 이동합니다. 그런 뒤 중간 script에 [Action > Replace]를 클릭합니다. 9 - 복사해뒀던 Dev script를 집어넣어 Replace 해줍니다. 10 - 그런 뒤 개발자 도구(F12)로 이동하여 [콘솔]을 확인해보면 Custom Rule이 정상적으로 출력되는것을 확인할 수 있습니다. 다음 게시글에서는 실제로 Publishing 배포를 시도해보도록 하겠습니다.
-
어도비(Data Collection) 디버깅하기 - 1. 런치가 제대로 설치되어있는지 확인하기
어도비 런치(Data Collection)을 통해 룰을 생성하게되면 해당 룰을 배포해야하는데요 그 전에 정상적으로 작동하는지 또한 확인해야합니다. 실제로 Production에 배포하기 전에 개발 단계에서도 제대로 작동하는지 확인하지 않으면 배포 후 데이터가 수집되지 않는 등 안좋은 결과를 초래할 수 있습니다. 여기서 Chrome의 Adobe Experience Platform Debugger를 사용하면 손쉽게 배포 전 그리고 배포 후에도 디버깅을 진행할 수 있습니다. - https://chromewebstore.google.com/detail/adobe-experience-platform/bfnnokhpnncpkdmbokanobigaccjkpob 위 URL에 접근하여 [Chrome에 추가]를 클릭하면 됩니다. 추가가 완료되었다면 이제 어도비 런치가 설치되어있는 사이트로 이동합니다. 그리고 Adobe Experience Platform Debugger를 실행합니다. 배포 없이 처음 실행하면 다음과 같이 Not Found만 표시될 것 입니다. 이 상태에서 사이트를 다시 [새로고침]해줍니다. 그리고나서 [Experience Platform Tags > Configuration]을 클릭해보면 실제로 내가 추가한 Production의 어도비 런치(Data Collection)코드를 확인할 수 있습니다. 내가 넣은 코드가 확인되었다면 정상적으로 삽입이 완료된 것 입니다. 다음 글에서 실제로 개발환경 디버깅 및 배포를 진행해보겠습니다.
-
어도비 런치(Adobe launch) Rules 이해하기
사이트에 어도비 런치(Adobe launch)의 설치가 완료되면 기본적으로 룰(Rules)을 이용해 사이트에 간섭하게 됩니다. 룰을 통해 할 수 있는 일을 예로 들자면 1. 페이지가 로드될 때 Adobe Analytics로 데이터를 전송한다. 2. 특정 버튼을 클릭했을 때 Adobe Analytics로 데이터를 전송한다. 3. 특정 페이지에 접근했을 때 팝업을 띄운다. 등 특정 페이지, 특정 버튼에 대한 데이터 Adobe Aanalytics(AA) /Google Aanalytics(GA)로 수집하거나 사이트에서 조작가능한 수준의 html, js, css를 통해 팝업을 띄우는 등 많은 일을 할 수 있습니다. 같은 태그 매니지먼트 시스템(Tag Management System)인 Google Tag Manager(GTM)에서는 태그와 트리거를 통해 룰(Rules)과 동일한 동작을 수행하게 됩니다. 즉 GTM에서 태그와 트리거가 어도비 런치의 룰과 동일하다고 생각하면 됩니다. 어도비 런치의 룰 메뉴에 접근하여 [Create New Rule]을 클릭합니다. 그럼 다음과 같은 화면을 볼 수 있는데요 여기서 IF가 바로 어떤 조건에서 동작을 수행할거냐에 대한 이야기이며 THEN이 그 동작에 해당됩니다. 정리하면 IF -> 어떤 타이밍에 이 Rule을 발동시킬 것 인가? (GTM의 트리거에 해당합니다.) THEN -> Rule이 어떤 동작을 할 것인가? (GTM의 태그에 해당합니다.) 위의 예시를 통해 다시 살펴보자면 1. (IF)페이지가 로드될 때 (THEN)Adobe Analytics로 데이터를 전송한다. 2. (IF)특정 버튼을 클릭했을 때 (THEN)Adobe Analytics로 데이터를 전송한다. 3. (IF)특정 페이지에 접근했을 때 (THEN)팝업을 띄운다. 이 됩니다. 또 IF안에 EVENTS와 CONDITIONS이 나눠지는데 EVENTS는 룰을 발동시킬 트리거이며 CONDITIONS은 해당 트리거 내에서의 제한사항 입니다. 즉 특정 페이지에서 룰을 발동시킨다면 EVENTS -> 페이지에서 룰을 발동시킨다 CONDITIONS -> B페이지로 제한 이 됩니다. 이부분은 헷갈리니 나중에 알아보고 룰을 실제로 만들어보겠습니다. EVENTS의 [+ Add]를 클릭합니다. 그럼 아래와 같은 화면이 나옵니다. 이벤트 타입을 [Library Loaded (Page Top)]을 선택한 뒤 [Keep Changes]를 클릭합니다. 여기서 Library Loaded의 의미는 어도비 런치가 로드되는 순간에 룰을 발동하겠다는 의미입니다. 그런다음 THEN의 [Add]를 클릭합니다. 그런다음 Action Type을 Custom Code로 입력한 뒤 [ Open Editer]를 클릭합니다. console.log("Custom Rule");이라는 코드를 집어넣은 뒤 우측 상단의 [Save]를 클릭한 뒤 [Keep change]를 클릭합니다. 그런 뒤 이름을 [테스트]로 입력한 뒤 [Save]를 클릭합니다. 이렇게 첫 룰을 만들어봤습니다. 이 룰을 해석하자면 [(IF)어도비 런치가 로드되면 (THEN)브라우저의 콘솔창에 Custom Rule이라는 텍스트를 출력한다.] 가 됩니다. 다음번에는 해당 룰을 배포해 실제로 사이트의 콘솔창에 Custom Rule이라는 텍스트가 출력되는지 확인해보겠습니다.
-
웹사이트에 어도비 런치(Adobe launch) 설치하기
웹사이트에 어도비 런치를 설치하기 위해서는 먼저 환경(Environments)을 이해해야 합니다. 환경(Environments)는 GTM에도 존재하는 기능으로 환경을 나누어 해당 환경에 배포할 수 있는 기능을 이야기합니다. 예를들면 웹 개발 프로젝트에서 개발서버, 스테이징서버, 실서버가 나누어지는 것 처럼 어도비 런치도 각 환경을 특정하여 내가 작업한 내용을 특정 환경에 배포할 수 있고 그에따른 환경별 스크립트가 존재합니다. 우선 태그가 존재하는 Environments로 이동해보겠습니다. 어도비 런치에서 생성한 속성(Property)를 선택한 뒤 왼쪽의 Environments를 클릭합니다. 그럼 위와 같은 화면을 확인할 수 있습니다. 위에서 이야기한 것 처럼 기본적으로 Development, Staging, Production이 존재하는데 여기서 Production이 실제 어도비 런치에 작업한 내용을 최종 배포했을 때 적용되는 곳입니다. 필요한 경우 더 많은 환경을 생성하여 사용할 수 있습니다. 더 자세한 내용은 이후 실제로 배포작업을 진행할 때 알아보도록 하겠습니다. Production의 우측에 보면 INSTALL부분에 박스를 확인할 수 있는데 이 박스를 클릭하면 아래와 같이 [<script src="]로 시작하는 자바스크립트 코드를 확인할 수 있습니다. 해당 코드를 복사하여 웹사이트의 <head>에 붙여넣기하여 코드를 배포하면 됩니다.
-
데이터 수집을 위한 어도비 런치(Adobe Launch) 프로퍼티 생성하기
어도비 애널리틱스(Adobe Analytics)에 데이터를 수집하는 방법 중 하나로 어도비 런치(Adobe Launch)를 활용할 수 있습니다. 어도비 런치의 기본적인 구조는 프로젝트(Project) -> 프로퍼티(Property)로 구성됩니다. 여기서 프로젝트는 Adobe Experience Platform에 접속했을 때 가장 큰 범위로 구글 마케팅 플랫폼의 프로젝트에 해당된다고 볼 수 있습니다. 아래 스크린샷의 상단의 [PLUS Zero Partner Sandbox]가 프로젝트입니다. 다음 으로 프로퍼티(Property)입니다. 구글 태그매니저는 계정내부에 컨테이너가 존재하지만 어도비는 단순히 프로퍼티만 존재합니다. 따라서 프로퍼티 만으로 구분을 해야하기 때문에 네이밍 규칙을 잘 정할 필요가 있습니다. 기본적으로 프로퍼티에서 플랫폼 (웹, 모바일)을 선택할 수 있어 본인이 서비스하고있는 플랫폼에 따라 구분지을 수 있습니다. 또한 글로벌 서비스를 하고있다면 프로퍼티를 어도비 런치(Adobe launch)에서 국가별로 나누어 생성할 수도 있습니다. 이제 본격적으로 프로퍼티를 생성해보겠습니다. 1. 아래 화면의 우측 중앙부의 [New Property]를 클릭합니다. 2. 어도비 런치(Adobe launch) 프로퍼티 생성 화면이 나오면 프로퍼티 이름을 입력한 뒤 플랫폼을 선택하고 어도비 런치를 사용하고자 하는 웹사이트의 도메인을 입력한 뒤 [Save]를 클릭합니다. 3. 성공적으로 프로퍼티가 생성된 것을 확인할 수 있습니다.
전체댓글0