brunch

매거진 구글 태그 매니저

라이킷 1

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 하이프마크 Dec 06. 2021

구글 태그 매니저 : 데이터레이어(dataLayer)

GTM

구글 태그 매니저에서 자주 언급되는 데이터레이어(dataLayer)는 표준화된 방식으로 웹사이트의 데이터를 수집해 구글 태그 매니저로 정보를 전달하는 자바스크립트 개체입니다.

따라서 데이터 레이어는 변수를 생성하거나, 트리거를 활성하는데 사용되며, 안정적이고 유연한 데이터 수집이 가능합니다.

구글 태그 매니저는 변수, 거래 정보, 페이지 카테고리 및 페이지 곳곳에 존재하는 기타 중요 신호를 참조하는 대신 데이터 영역 소스 코드에 있는 정보를 쉽게 참조하도록 설계되었습니다. 데이터 영역은 변수를 비롯한 연결된 값을 사용해 구현되기 때문에 태그를 실행해야 할 때 변수와 값을 바로 사용할 수 있습니다.

따라서 데이터레이어는 데이터의 신뢰성을 높이고 정보를 최적화시킬 수 있습니다. 만약 데이터레이어가 없다면 HTML의 특정 부분을 찾아 그에 맞는 값을 하나하나 긁어내고 데이터 분석 툴로 연결하는 것까지 설정해줘야겠죠. 여기서 만약 업그레이드라도 하게 된다면 이를 전부 다시 추적해야합니다.

데이터레이어는 이때 사용 됩니다. 데이터레이어에 정보가 저장될 경우, 이 정보 자체가 손상되지 않을 경우 계속 이 데이터레이어에서 값을 가져올 수 있기 때문입니다. 또한 수정 역시 가능합니다.

데이터레이어는 보통 이런 형태를 띄고 있습니다. 모든 정보가 안에 들어가있는 것을 확인할 수 있죠.

구글 태그 매니저에서는 일부 데이터가 웹사이트에서 GTM으로 직접 이동할 수 없을 때가 있습니다.. 예를 들어, 구매한 특정 품목 및 구매 금액과 관련된 구매 데이터는 GTM이 해당 정보를 가져오기 전에 데이터레이어를 통해 중간 저장된 후 전송됩니다. 이처럼 데이터레이어는 특정 컨텍스트에 대한 데이터를 저장, 처리 및 전달합니다.

웹사이트 또는 모바일 앱이 태그 관리자 및 데이터 영역과 호환되도록 설정하려면 다음과 같이 데이터레이어가 처리해야 할 정보 카테고리에 대해서 생각해볼 필요가 있습니다.

제품 데이터: 제품 이름, 가격, 카테고리

마케팅 캠페인 정보: 트래픽 소스, 매체

거래 데이터: 장바구니 금액, 체크아웃 날짜

고객 정보: 신규 또는 재방문 고객

데이터레이어 변수는 태그 관리자가 데이터 영역 구현에서 값을 읽어 와서 태그, 트리거 및 기타 변수에 전달할 수 있는 방법입니다. 데이터 영역 개체는 키-값 쌍 목록으로 구성됩니다. 여기에서 키는 책의 카테고리, 제목, 저자와 같은 사물 카테고리입니다. 각 키는 값이 다를 수 있습니다.책 제목의 키 값은 ‘Ulysses’, ‘War in Peace’, ‘A Brief History of Time’ 등이 될 수 있습니다.

그럼 이제 어떻게 데이터레이어를 구축하는지 알아봐야겠죠. 사실 이 다음부터는 개발지식이 필요합니다. 어려우신 분들은 개발자와의 협업을 추천드립니다. 하이프마크에서도 이에 대한 도움을 드리고 있습니다.

개발자에게 의뢰를 해 웹페이지에서 다음과 같은 형태의 코드 스니펫을 컨테이너 스니펫 위에 있는 <head> 섹션에 추가하세요.

이런 형태로 넣으시면 되는데요, 더 자세하게 알아보고 싶으신 분은 이 개발 가이드를 참고하시기 바랍니다.

위와 같이 데이터레이어를 선언해준 뒤 이제 GTM에서 데이터 영역 변수로 셋팅해 만드시면 되는데요.

저는 데이터레이어를 통한 맞춤이벤트를 설정해보겠습니다.

데이터 스튜디오에 들어가 변수를 클릭해주세요. 새로 만들기를 클릭해 변수 유형은 데이터 영역 변수로 설정해주시기 바랍니다. 그럼 이제 데이터 영역 변수 이름과 데이터 영역 버전이 있는데요. 여기서 데이터 영역 변수 이름을 코드에 작성된 그대로 정확하게 입력하셔야 합니다. 즉, 키를 입력하셔야 한다는 뜻입니다.

데이터 영역 버전을 웬만하면 기본값인 버전 2로 그대로 두세요. 이렇게 하면 데이터레이어 변수 설정이 완료된 것입니다.

트리거 역시 마찬가지 방법인데요.