> ## Documentation Index
> Fetch the complete documentation index at: https://help.airbridge.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Google Tag Manager 설정하기 - Web SDK

## **Google 태그 관리자를 이용한 SDK 설치**

이 문서는 [Google 태그 관리자](https://tagmanager.google.com/)를 통해 에어브릿지 Web SDK를 설치하는 방법에 대해 설명합니다.

에어브릿지 Web SDK의 설치와 이벤트 전송에 관한 설명은 [Web SDK 설치하기](/ko/developers/web-sdk#web-sdk-설치하기), [웹 이벤트 전송하기](/ko/developers/web-sdk#웹-이벤트-전송하기)를 참고해 주세요.

### Web SDK 설치하기

1. 컨테이너에서 **작업공간 → 개요 → 새 태그** 또는 **작업공간 → 태그 → 새로 만들기**를 클릭합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/2biko8ux8AcBzrIa/asset/image/google-tag-manager-workspace-new-tag.png?fit=max&auto=format&n=2biko8ux8AcBzrIa&q=85&s=99e439564224ef33700def38bb12e050" alt="Web SDK - GTM - 설치하기 1" width="1396" height="1154" data-path="asset/image/google-tag-manager-workspace-new-tag.png" />
</Frame>

2. **태그 구성 → 태그 유형 선택 → 맞춤설정 → 맞춤 HTML**을 선택합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-tag-trigger-configuration.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=b4560a9341476ee6d1f0d85886fb8975" alt="Web SDK - GTM - 설치하기 2" width="1500" height="762" data-path="asset/image/google-tag-manager-tag-trigger-configuration.png" />
</Frame>

3. **HTML** 편집기에 [Web SDK 설치 스크립트](/ko/developers/web-sdk#web-sdk-설치하기)를 작성해 주세요.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-web-sdk-custom-html.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=b345071ae0df537292b095fef98baf48" alt="Web SDK - GTM - 설치하기 3" width="1500" height="1041" data-path="asset/image/google-tag-manager-web-sdk-custom-html.png" />
</Frame>

4. Web SDK 의 `init` 함수는 다른 함수보다 먼저 실행해야 합니다. **고급 설정**에서 **태그 실행 우선순위**를 0보다 큰 숫자(예: 9999)로 입력해 주세요.
5. Web SDK 의 `init` 함수는 한 번만 실행해야 합니다. **고급 설정**에서 **태그 실행 옵션**을 **페이지당 한 번**으로 선택해 주세요.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/2biko8ux8AcBzrIa/asset/image/google-tag-manager-firing-settings.png?fit=max&auto=format&n=2biko8ux8AcBzrIa&q=85&s=32df4b587a6ba63f37e071865f768e58" alt="Web SDK - GTM - 설치하기 4" width="722" height="894" data-path="asset/image/google-tag-manager-firing-settings.png" />
</Frame>

6. **트리거**를 클릭하여 **유형**이 **DOM 사용 가능**인 트리거를 선택해 주세요.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-trigger-list.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=b01b40bf537d11e877aa2fdee8b58151" alt="Web SDK - GTM - 설치하기 5" width="1500" height="208" data-path="asset/image/google-tag-manager-trigger-list.png" />
</Frame>

1. 기존에 만들어진 트리거가 없다면 **+ 버튼**을 눌러 **페이지뷰 → DOM 사용 가능**을 선택해 트리거를 생성해 주세요.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-empty-trigger.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=43cededd7a81aeeca7e78b1a029566e8" alt="Web SDK - GTM - 설치하기 6" width="1500" height="484" data-path="asset/image/google-tag-manager-empty-trigger.png" />
</Frame>

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-page-view-dom-ready-trigger.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=369e77717db0723dbbdcd96019cd5f8f" alt="Web SDK - GTM - 설치하기 7" width="1500" height="2254" data-path="asset/image/google-tag-manager-page-view-dom-ready-trigger.png" />
</Frame>

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-dom-ready-trigger.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=2781316acfe2a56bf1ab9def2f750199" alt="Web SDK - GTM - 설치하기 8" width="1500" height="281" data-path="asset/image/google-tag-manager-dom-ready-trigger.png" />
</Frame>

7. **저장**을 눌러 태그를 생성합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-save-web-sdk-tag.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=1290a217ece77acb386ec912a3006cb2" alt="Web SDK - GTM - 설치하기 9" width="1500" height="1061" data-path="asset/image/google-tag-manager-save-web-sdk-tag.png" />
</Frame>

8. **제출**을 눌러 변경 사항을 반영합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/2biko8ux8AcBzrIa/asset/image/google-tag-manager-preview-submit.png?fit=max&auto=format&n=2biko8ux8AcBzrIa&q=85&s=4c669d75fce487cb71b3727850a7c355" alt="Web SDK - GTM - 설치하기 10" width="430" height="258" data-path="asset/image/google-tag-manager-preview-submit.png" />
</Frame>

9. 에어브릿지 대시보드에서 **웹 이벤트 실시간 로그**가 발생하는지 확인합니다.

### 이벤트 추적하기

1. 컨테이너에서 **작업공간 → 개요 → 새 태그** 또는 **작업공간 → 태그 → 새로 만들기**를 클릭합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/2biko8ux8AcBzrIa/asset/image/google-tag-manager-workspace-new-tag.png?fit=max&auto=format&n=2biko8ux8AcBzrIa&q=85&s=99e439564224ef33700def38bb12e050" alt="Web SDK - GTM - 설치하기 1" width="1396" height="1154" data-path="asset/image/google-tag-manager-workspace-new-tag.png" />
</Frame>

2. **태그 구성 → 태그 유형 선택 → 맞춤설정 → 맞춤 HTML**을 선택합니다.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-tag-trigger-configuration.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=b4560a9341476ee6d1f0d85886fb8975" alt="Web SDK - GTM - 설치하기 2" width="1500" height="762" data-path="asset/image/google-tag-manager-tag-trigger-configuration.png" />
</Frame>

3. **HTML** 편집기에 [Web SDK 이벤트 전송 스크립트](/ko/developers/web-sdk#웹-이벤트-전송하기)를 작성해 주세요.

<Frame>
  <img src="https://mintcdn.com/airbridge-help-center/6CTRFgWYblklSTQJ/asset/image/google-tag-manager-event-code.png?fit=max&auto=format&n=6CTRFgWYblklSTQJ&q=85&s=5c98dd60f60abeec4e743bccf0ce559d" alt="Web SDK - GTM - 이벤트 추적하기" width="1500" height="1392" data-path="asset/image/google-tag-manager-event-code.png" />
</Frame>

4. 이벤트가 발생하는 상황에 따라 **고급 설정**에서 **태그 실행 옵션**을 **무제한**, **이벤트당 한 번** 또는 **페이지당 한 번**으로 선택해 주세요.
5. **트리거**를 클릭하여 이벤트가 발생하는 상황에 맞는 트리거를 선택해 주세요.
6. **저장**을 눌러 태그를 생성합니다.
7. **제출**을 눌러 변경 사항을 반영합니다.
8. 에어브릿지 대시보드에서 **웹 이벤트 실시간 로그**가 발생하는지 확인합니다.

<link rel="alternate" hrefLang="en" href="https://help.airbridge.io/en/developers/google-tag-manager-web-sdk" />

<link rel="alternate" hrefLang="ko" href="https://help.airbridge.io/ko/developers/google-tag-manager-web-sdk" />