1. 노티플라이 맞춤 템플릿 설치
- 최신 템플릿 다운로드
릴리스 페이지에서 템플릿을 내려받습니다.
- 한글: template.ko.tpl
- 영문: template.tpl
- GTM 좌측 하단 템플릿 메뉴로 이동 → 우측 상단 태그 템플릿 > 새로 만들기 클릭
- 템플릿 편집기 우측 상단 ⋮ > 가져오기 선택 → 내려받은 .tpl 파일을 가져옵니다.
- 저장을 클릭하면 좌측 하단에 템플릿이 생성됨 팝업이 표시되고 설치가 완료됩니다.
2. 노티플라이 SDK 초기화 태그
- Google Tag Manager 좌측 태그 메뉴 → 새로 만들기
- 태그 이름 지정 → 태그 구성 클릭
- 맞춤 템플릿 섹션에서 노티플라이 JavaScript SDK 선택
- 태그 구성에서 Tag Type: SDK 초기화 선택 후 Project ID, Username, Password 입력. (노티플라이 SDK 초기화 옵션 참고.)
- 고급 설정
- 태그 실행: 페이지당 한 번
- 트리거: Initialization – All Pages 로 지정.
3. 유저 관리
캠페인 타깃팅/개인화를 위해userId와 userProperties를 설정합니다. 푸시 수신 동의 등도 userProperties에 저장해 필터링할 수 있습니다.
반드시 SDK 초기화 태그가 선행되어야 합니다.
1. 유저 아이디 등록 (setUserId)
- 태그 > 새로 만들기 → 태그 이름(예: Notifly – setUserId) 지정 → 태그 구성 클릭.
-
Tag Type: 유저 아이디 등록 (setUserId) 선택 후, 유저 아이디 입력란에 GTM 변수(예:
{{User ID}})를 지정.\
-
태그 시퀀싱에서 SDK 초기화 태그를 먼저 실행하도록 설정. (초기화 태그가 실행되지 않으면 다른 태그들이 동작하지 않습니다.)
-
트리거는 로그인 완료 시점의 맞춤 이벤트(예: login_success)를 사용.
2. 유저 프로퍼티 등록 (setUserProperties)
- 태그 > 새로 만들기 → 태그 이름(예: Notifly – setUserProperties) 지정 → 태그 구성.
-
Tag Type: 유저 속성 등록 (setUserProperties) 선택 → 등록할 속성에 대응하는 GTM 변수들을 매핑.
-
태그 시퀀싱에서
setUserId→setUserProperties순서가 되도록 구성.
- 이메일 발송에는
$email, 카카오 알림톡/친구톡/문자 발송에는$phone_number예약 키가 필요합니다. - 예약 키는 반드시 표기 그대로 사용하세요. 예:
$email,$phone_number
4. 이벤트 로깅 (trackEvent)
유저 행동(클릭, 조회, 구매 등)을 이벤트로 전송해 세그먼트/트리거/성과 분석에 활용합니다.- 반드시 SDK 초기화 태그 실행 후 동작하도록 태그 시퀀싱을 설정하세요.
- 유저 세그먼트 이벤트 변수 목록(segmentationEventParamKeys)에 최대 1개의 키만 지정 가능합니다.
- 태그 > 새로 만들기 → 태그 이름(예: Notifly – trackEvent) 지정 → 태그 구성.
- Tag Type: 이벤트 로깅 (trackEvent) 선택 → 이벤트 이름 입력 → 필요 시 이벤트 파라미터(GTM 변수 매핑)와 세그먼트 이벤트 변수 목록 지정.
- 태그 시퀀싱에서 SDK 초기화 태그 이후에 실행되도록 구성.
- 예시: GTM에서 제공하는 **기본 변수
클릭 ID와 기본 트리거 이벤트클릭 - 모든 요소를 사용해 클릭 요소의id를element_id로 전송하고, 이를 세그먼트 이벤트 변수 목록에 추가.
5. 연동 테스트
SDK 설치 후 아래 페이지에서 실제 이벤트 및 푸시 수신 여부를 테스트하세요.👉 SDK 연동 Test
6. (심화) 웹 푸시 설정
- 웹 푸시 사용을 위해서는 Google Tag Manager 설정 이외에, 웹사이트에 스크립트를 추가해야 합니다.
- JavaScript SDK 가이드의 웹 푸시 설정 섹션을 참고하여 사이트에
notifly-service-worker.js파일을 추가해주세요. - 연동 관련 문의 사항은 contact@notifly.tech 으로 이메일 부탁드립니다.