이번 글에서는 우리의 웹사이트에 Adobe Data Collection(ADC)를 설치하는 방법에 대해 알아보겠습니다.
지난번 글에서 ADC의 Property를 생성하는 방법에 대해 알아봤는데요, 이번에는 해당 Property를 어떻게 사이트에 적용하는지 그 방법에 대해 알아보도록 하겠습니다.
ADC를 사이트에 설치하는 것 자체는 아주 간단합니다. 하지만 이를 설치하기 위해서는 먼저 환경(Environments)를 이해해야 합니다.
이 환경은 GTM에도 존재하는 기능이긴 한데요 GTM에서는 두드러지게 보여지지 않는 기능입니다.
보통 우리가 서비스를 제공하기 위해 홈페이지를 만들게 되면 보통 개발팀 내에서는 하나의 단일 서버로만 홈페이지를 개발하는 것이 아닌 보통 3개 정도의 서버를 통해 개발과 서비스를 진행하게 됩니다.
3가지 서버 종류별 특징 알아보기
3가지 서버는 각각 Dev, Staging, Production으로 ADC에서 이야기하는 환경과도 각각 일치합니다. 우선 서버별로 특징을 알아보자면 보통의 경우 아래와 같습니다.
- Dev – 실제 개발을 진행하는 서버로 보통 해당 서버에서 최초 개발된 코드들을 테스트하는 서버입니다.
- Staging – 배포를 위해 Production에 배포되어야 하는 코드를 테스트하기 위한 서버입니다.
- Production – 최종 사용자에게 서비스되는 서버입니다.
Adobe Data Collection도 해당 환경에 대응하여 하나의 Property를 각 환경에 맞게 삽입하여 관리할 수 있습니다.
즉 Property안에서 만든 작업물들을 Dev서버와 Staging서버에서 테스트한 뒤 Production으로 보낼 수 있다는 이야기입니다. 좋은 기능이죠?
각 환경 확인해보기
그렇다면 화면에서 실제 환경을 확인해볼까요?
이전 글에서 생성했던 Property에 접속해보면 왼쪽 메뉴에 [Environments]를 확인할 수 있습니다.
화면을 보면 기본적으로 Development, Staging, Production이 생성되어 있는 것을 확인할 수 있습니다. 거기다 추가로 우측 상단의 Add Environment를 통해 환경을 생성할 수도 있습니다.
사이트에 ADC 삽입하기
이쯤왔으면 아마 예상이 될텐데요! 우리는 실제 서비스되고 있는 사이트에 작업을 할 예정이기 때문에 “Production”환경을 사용하면 될 것입니다. 즉 세 가지 환경 중 Production을 사이트에 설치하면 된다는 것이죠
어떻게하는걸까요? 이전 화면의 Production 우측에 보면 박스모양의 아이콘이 존재합니다. 해당 박스를 클릭합니다.
그러면 아래와 같은 화면을 볼 수 있는데요 해당 화면에서 중간에 보이는 <script …>부분을 복사합니다.
그런다음 아래와 같이 우리 사이트의 <head>영역 안쪽에 해당 코드를 위치시켜주면 됩니다.
여기까지 ADC를 사이트에 설치하는 방법에 대해 알아봤습니다.
추가적으로 Adobe Analytics와 관련된 글은 아래 URL에서 확인하실 수 있습니다 🙂
