닥치고 마케팅

[GTM] '메이크샵' 구글태그매니저(GTM) 설치 방법 본문

디지털마케팅 노하우/데이터분석

[GTM] '메이크샵' 구글태그매니저(GTM) 설치 방법

닥치고마케팅 2020. 12. 12. 14:56

안녕하세요~
닥치고마케팅 입니다! :)

네이버, 다음, 구글 등 어떤 곳에서 찾아봐도 
카페24 솔루션에 구글 애널리틱스, 구글 태그매니저 설치하는 방법들은 많이 소개되어 있는데
유독 메이크샵, 고도몰 관련된 정보는 많이 없더라구요...

서비스 인지도나 이용자 수가 많이 차이 나서 그런지도 모르겠네요

그래도! 메이크샵은 카페24 다음으로 이용자 수가 많다고 하니
이 정보를 필요로 하시는 분들도 분명 많겠죠!

그런 분들을 위해 조금이나마 도움을 드리고자
카페24 다음으로 이용자 수가 많은 메이크샵에
구글 태그매니저(GTM) 설치하는 방법을 알려드리도록 하겠습니다!

 

'메이크샵' 구글 태그매니저(GTM) 설치 방법


[PC Version]

01. 개별 디자인 이동

- '카페24'나 '메이크샵'은 html 소스를 설치하는 방법이 쉬워서 코딩을 전혀 모르셔도 됩니다.
- 구글 태그매니저(GTM)를 비롯해 PC 사이트에 html 수정이 필요한 경우 아래 경로에서 진행해주시면 됩니다.
- [개별 디자인] > [디자인 스킨 관리] > [디자인 편집하기] 

 

02. 디자인 편집 및 디자인 환경 설정

- 지난번 구글 애널리틱스(Google Analytics) 범용 사이트 태그(gtag.js) 설치할 때와 마찬가지로
- 디자인 편집 페이지에서 디자인 환경 설정 메뉴로 이동해주시고요

 

03. HEAD 입력

- 발급 받은 구글 태그매니저(GTM) <head> 코드를 복사하여 아래 위치에 붙여주세요.
- 구글 태그매니저(GTM) 코드는 아래 경로에서 확인하실 수 있습니다.
- [구글 태그매니저(GTM)] 접속 > [(생성한) 컨테이너] 선택 > [관리자] 메뉴 선택 > [Google 태그 관리자] 설치 선택

 

04. <body> 코드 입력

- 좌측 메뉴 중 [상단] > [기본 상단] 메뉴를 선택해주시고
- 최상단에 복사한 구글 태그매니저(GTM) <body> 코드를 붙여주시면 끝납니다.

 

[MOBILE Version : 메이크샵D4 or 파워팩]

01. 공통 : 개별 디자인 이동

- PC와 같이 모바일 사이트 html 소스 수정이 필요한 경우는
- [모바일샵] > [모바일 D4(개별 디자인)] > [디자인 편집하기]로 이동해서 수정해주시면 됩니다.

 

02-01. 메이크샵D4 기준 : 디자인 편집 및 디자인 환경 설정

- 모바일샵 디자인 편집 페이지로 이동 후 디자인 환경 설정 메뉴를 선택해주세요.

 

02-02. 메이크샵D4 기준 : HEAD 입력

- PC 사이트에 붙여 넣은 구글 태그매니저(GTM) <head> 코드를 똑같이 붙여 넣어 주세요.

 

02-03. 메이크샵D4 기준 : <body> 코드 입력

- 마찬 가지로 복사한 구글 태그매니저(GTM) <body> 코드는
- [상단] > [기본 상단] 메뉴로 이동하셔서 최상단에 붙여 넣어 주시면 됩니다.

 

03-01. 메이크샵 파워팩 기준 : 디자인 편집 및 디자인 환경 설정

- 만약 메이크샵D4가 아닌 파워팩을 이용 중이시라면
- [모바일샵] 페이지에서 [디자인 편집] 버튼 클릭 시 아래처럼 파워팩 페이지로 이동하게 됩니다.
- 파워팩 페이지에서 [모바일 샵 환경 설정] > [디자인 고급 편집] 메뉴를 선택해주세요

 

03-02. 메이크샵 파워팩 기준 : HEAD 입력

- 복사하신 구글 태그매니저(GTM) head 코드는 아래 위치에 붙여 넣어 주시고

 

03-03. 메이크샵 파워팩 기준 : <body> 코드 입력

- 여기서부터는 메이크샵D4 보다 조금은 복잡(?)하실 수도 있습니다.
- 우선 [상단] > [기본 상단] 메뉴를 선택해 주시고요

- 아래에 [추가+] 버튼 클릭 후 [디자인] > [영역 제목] 입력 > [디자인 타입 - HTML 영역] 선택하고
- [확인] 버튼을 클릭해 주세요~!

- 그럼 아래처럼 위에서 생성한 html 디자인 메뉴가 생성이 됩니다.
- 생성된 메뉴를 선택하고 [HTML 디자인] 영역에 복사한 <body> 코드를 붙여주시면 끝납니다. 

 

어떠 셨나요? 카페24 보다는 이용자들의 버전에 따라
설치하는 방법이 다소 헷갈리실 수도 있다고 생각됩니다.

하지만, 위 가이드만 잘 따라오시면 누구나 쉽게 설치하실 수 있으니
차근차근 읽어보시고 시작해보시길 권장드립니다~

긴 글 읽어 주셔서 감사합니다 :)

Comments