08 Nov 2021
#googleTagManager, #DataLayer
※ GTM 스터디를 위한 요약 문서입니다.
1. DataLayer
: GA “페이지뷰 추적”을 목표로 GTM을 활용하는 예시
1) GTM 주요 3요소
- 태그 : 변수와 트리거가 실행될 때 명령
- 트리거 : 행동
- 변수 : 트리거를 동작하는 변할 수 있는 값(조건)
------------[작업 순서]------------
1) 변수 생성 (기본 제공 & 사용자 정의 변수)
2) 트리거 생성
3) 태그 생성
4) 제출 & 게시
5) 작동 확인
1) 미리보기(디버거)로 확인
2) 애널리틱스 실시간 보고서 확인(스피어)
3) 태그 어시스턴트로 확인
1) 변수 생성
- 상황에 따라 다른값을 가질 수 있음
- 트리거의 실행조건을 정의하거나 태그의 동적인 정보를 전달
트리거의 실행 조건이 아래와 같을
Reference
[1] 구글 태그 관리자 설치 및 사용법
[2] GTM사용하기
[3] 지원되는 태그
31 Oct 2021
#googleTagManager
※ GTM 스터디를 위한 요약 문서입니다.
GTM 사용 방법
: 기본 GTM 스니펫을 설치했다면, 이제 사이트의 정보를 분석툴(ex. GA, Sphere 등등)로 전달하기 위한 절차를 살펴 보자.
1. GTM 주요 3요소
: 우선 GTM의 태그를 설정하기 위해선 아래 3가지 요소를 잘 이해해야 한다.
- 태그(how) : 변수와 트리거가 실행될 때 명령
- Ex) “{회원가입}버튼 클릭시 {GA(or Sphere)}로 보내라”
- 트리거(when) : 행동 조건 및 발송 시점(특정 행동이 발생할 “때”)
- 변수(what)): 트리거를 동작하는 변할 수 있는 값으로 이벤트에 담길 데이터 자체
---------------[작업 순서]---------------
1) 변수 생성 (기본 제공 & 사용자 정의 변수)
2) 트리거 생성
3) 태그 생성
4) 제출 & 게시
5) 작동 확인
1) 미리보기(디버거)로 확인
2) 애널리틱스 실시간 보고서 확인(스피어)
3) 태그 어시스턴트로 확인
2. 변수 생성
- 상황에 따라 다른값을 가질 수 있음
- 트리거의 실행조건을 정의하거나 태그의 동적인 정보를 전달
(1) GTM에 양식이 지정되어 있는 변수
트리거의 실행 조건이 아래와 같을
Reference
[1] 구글 태그 관리자 설치 및 사용법
[2] GTM사용하기
[3] 지원되는 태그
31 Oct 2021
#googleTagManager
※ GTM 스터디를 위한 마케톨로지 가이드 요약 문서입니다.
1. 구글 태그 관리자(GTM)란?
: 구글 + 태그 + 관리자 ‘구글에서 만든 태그를 (효율적으로) 관리해 주는 툴’
1) 태그(Tag)
- 태그 : 광고나 로그분석 프로그램을 실행시키는 짧은 자바스크립트 코드(= 스니펫)로 html 문서ㅔ 추가되어 코드내에 지정된 작업이 실행됨.
"GTM을 사용해 위 코드 대신, GTM의 코드가 설치되고,
기능과 설정을 GTM에서 쉽게 관리가능"
2.태그 관리자 장점
1) html문서 편집 필요 X
: 대시보드에 값을 입력하는 방식으로 작성하기에, html 문서를 편집할 위험성이 낮음.
2) 태그 관리자 코드가 여러 코드를 대신함
: GA, 카카오광고, 페이스북 등 여러 서비스의 추적 기능을 활성화 할 수 있음.
3) 트리거를 이용해 복잡한 기능 구현 가능
: 이벤트가 전달 복잡한 조건문을 마케터가 설정가능
2. GTM 설치 방법
1) GTM 컨테이너 스니펫(태그)
: GTM의 추적을 가능하게 해주는, 웹페이지상의 짧은 스크립트 코드
2) [컨테이너 스니펫] 스크립트 발급받기
- step_1 : 구글 계정 준비
- GA or Google Ads 에 사용한 메일 주소 추천)
- step_2 : 컨테이너 생성
- 계정을 회사 / 컨테이너를 웹(앱) 단위로 관리 추천
- step_3 : 컨테이너 클릭시 스니펫(태그 : 추적 코드) 출력!
- step_4 : 설치가이드에 따라 코드를 복사 & 웹페이지 상의 html 상단에 추가
- 대부분의 웹사이트 및 쇼핑몰 솔류션에서 웹페이지 상단 부분을 별도의 헤더 파일로 관리함.
- 워드프레서, 카페24, 고도몰 등 헤더 파일이 따로 있고, 그안에 <head> 태그가 있는 경우, 해당 파일에만 코드 추가시 모든 페이지에 적용됨.
Reference
[1] GTM관리자란 무엇이고 왜 사용하는가 - 마케톨로지
[2] 구글 태그 관리자 설치 및 사용법 - 마케톨로지
07 Oct 2021
#git, #gitlab, #github, #branch, #collaboration
이전 문서에서, Git을 활용한 프로젝트 관리의 시작 단계를 살펴보았다.
그러나 실제 팀원과 동일한 코드 내에서 작업을 해야하는 환경에서는 Git을 활용하더라도 코드가 충돌하여 에러가 뜨는 경우가 자주 발생하였다.
이에, Git을 이용한 협업 전략을 살펴보자.
현재 브랜치 상태
- 최종 코드 : Master branch
- 개발 코드 : dev branch
Step 1. 격리된 개별 브랜치 생성하기
: main - dev 뼈대를 두고, 각자의 브랜치 생성하하고 각자의 브랜치에서 작업을 수행
- 이때 브랜치이름을 ‘feature/main’, ‘feature/run’ 이렇게 네이밍을 항
git branch [branch_nm] # 브랜치 생성
git checkout [branch_nm]# 생성한 독립된 브랜치로 이동
2. 개별 브랜치에서 dev브랜치에 합치기 전에 검토 요청하기 (pull request)
: 개별 브랜치에서 만든 내용을 다시 dev에 합치려고 합니다. 이때 바로 합치기 보다, dev 브랜치에 내 코드를 합칠테니 검토를 부탁한다는 요청을 보냅니다.
Reference
[1] 초심자를 위한 Github 협업