2023년 6월 22일 목요일

구글 애널리틱스 4 (GA4) 추적코드를 웹사이트( 블로그 등)에 연동(설치) 하는 방법


지난 포스팅에서 구글 애널리틱스 4 시작하기 위해 계정 생성 및 속성하는 방법에 대해 알아보았다. 이번 포스팅에서는 발급 받은 추적코드(Google Analytics Tracking Code)(측정ID)를 웹사이트에 연결(연동) 하는 방법을 알아봅니다.

애널리틱스4에서 실제로 내 웹사이트(블로그 등)를 방문한 사용자 데이터를 분석에 활용하려면, 계정 생성 시 발급 받은 GA 추적코드(Google Analytics Tracking Code, GATC)를 내 웹사이트(블로그 등)에 추가해 주어야 합니다. 추적코드는 자바스크립트 언어로 되어 있는데, 흔히 스크립트(script)나 태그(tag)라고도 합니다. 즉 추적코드를 내 웹페이지에 심어야 내 웹페이지 방문자들의 데이터를 수집하여 구글애널리틱스 서버로 전송하게 됩니다.


내 웹사이트에 추적코드를 연결하는 방법 3가지 

1. 소스 코드에 구글 태그(GA 태그)를 직접 설치하는 방법 

2. 구글 태그관리자(Google Tag Manager, GTM)를 통해 설치하는 방법

3, ‘웹사이트 작성도구 또는 CMS로 설치’ 하는 방법

구글 태그관리자(GTM)을 사용하면 분석 및 광고성과 추적 용도의 다양한 태그를 손쉽게 연결하고, 이런 태그들을 효율적으로 관리할 수 있습니다. 특히 이벤트 설정을 포함하여 향후 다양한 설정을 하게될 때 훨씬 더 많은 것을 쉽게 할 수 있기 때문에 GTM 활용을 권장합니다. Wix, Squarespace 웹사이트 플랫폼 등을 사용하시거나 Site Kit 혹은 MonsterInsights 플러그인을 사용하시는 워프 블로그 유저분들은 CMS 상에서 또는 플러그인으로 쉽게 설치할 수 있습니다.


소스 코드에 직접 GA 태그를 추가하는 방법 

구글애널리틱스 사이트에서 본인의 추척코드를 확인 후 추적코드가 포함된 스크립트를 복사하여 내 웹사이트에 해당 스크립트를 추가해주어야합니다. 추적코드는 속성 별로 발급이 됩니다.

1. 애널리틱스 사이트에서 연결 하고자 하는 속성의 ‘데이터 스트림’ 메뉴를 클릭합니다.

2. 내 웹사이트의 데이터스트림을 선택합니다.

3. ‘웹 스트림 세부정보’ 레이어팝업창에서 에서 아래쪽에 Google 태그 영역의 ‘태그 안내 보기’ 탭을 클릭합니다.

4. 직접설치 탭을 클릭합니다.

5. 하단 영역에 애널리틱스4 (GA4) 추적 코드가 포함된 스크립트를 우측 상단 복사 버튼을 클릭하여 복사합니다.


내 웹사이트에 추적코드가 포함된 스크립트를 추가하기

구글 블로그에 추적코드를 추가하는 예시 방법을 보여드리겠습니다.

1. 내 구글 블로그(www.blogger.com)에 로그인합니다.

2. 왼쪽 메뉴에서 "테마"를 선택합니다.

3. "맞춤설정" 버튼을 클릭 후 HTML편집 메뉴를 선택합니다.

4. html 코드 편집기가 열리면 최상단 <head></head>태그 안에 위에서 복사했던 스크립트를 추가해줍니다. 필자의 경우 보통 </head> 태그 바로 위에 추가합니다.

   ..............생략...............

    <!-- Google tag (gtag.js) -->

    <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXX"></script>

    <script>

      window.dataLayer = window.dataLayer || [];

      function gtag(){dataLayer.push(arguments);}

      gtag('js', new Date());


      gtag('config', 'G-XXXXXXXX');

    </script>

  </head>

  <body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

........생략....

 5. 상단에 디스켓 모양의 아이콘을 클릭하여 저장합니다.


추적코드 동작여부 확인

추적코드 스크립트가 <head>에 태그안에 정상적으로 추가되었다면 구글 애널리틱스(GA) 대시보드에서 보고서 개요 > 실시간 탭에서 내 웹사이트(블로그) 방문자의 정보를 실시간으로  확인되는 것을 보실 수 있습니다.

이번 포스팅에서는 소스 코드에 구글 태그(GA 태그)를 직접 설치하는 방법에 대해 알아보았습니다. 다음 포스팅에서는 구글 태그관리자(Google Tag Manager, GTM) 툴을 통해 설치하는 방법에 대해 알아볼게요. 구글 태그 관리자 계정 생성 및 내 웹사이트에 설치하는 방법 포스팅 글을 참고하시어 사전에 가입 및 설치를 해주세요.



Share this

0 Comment to "구글 애널리틱스 4 (GA4) 추적코드를 웹사이트( 블로그 등)에 연동(설치) 하는 방법"

댓글 쓰기