google analytics 추적 코드 설치 방법 3가지

오쿨스

google analytics 추적 코드 설치 방법을 안내합니다. GA4 기준 측정 ID(G-XXXXXXX)를 찾는 방법부터 수동 설치, Google 태그 관리자(GTM) 활용법, 설치 확인까지 자세히 설명합니다.

google analytics 추적 코드 개요

google analytics 추적 코드는 웹사이트 방문자의 행동을 분석하기 위해 사용됩니다. 이 코드는 웹페이지에 삽입된 자바스크립트 코드로, 사용자의 방문 기록, 페이지 이동, 체류 시간 등의 데이터를 수집하여 google analytics 대시보드에서 확인할 수 있도록 합니다.

역할

google analytics 추적 코드는 방문자의 행동 패턴을 분석하고, 이를 기반으로 웹사이트의 성과를 측정하는 데 중요한 역할을 합니다. 이를 통해 트래픽이 어떤 경로를 통해 유입되는지, 사용자가 어떤 페이지에서 이탈하는지 등을 확인할 수 있습니다.

작동 방식

google analytics 추적 코드는 웹사이트의 각 페이지에 삽입되어 실행됩니다. 사용자가 웹사이트에 접속하면 브라우저가 google analytics 서버로 데이터를 전송하며, 이 데이터는 google analytics 계정에서 실시간으로 확인할 수 있습니다.

활용 예시

google analytics 추적 코드를 사용하면 방문자의 유입 경로 분석, 전환율 추적, A/B 테스트 수행 등이 가능합니다. 예를 들어, 특정 광고 캠페인의 효과를 분석할 때 google analytics 추적 코드를 활용하면 어떤 광고에서 가장 많은 방문자가 유입되었는지 확인할 수 있습니다.

google analytics 측정 ID 찾는 방법

google analytics 추적 코드를 설치하기 위해서는 측정 ID를 먼저 확인해야 합니다. 측정 ID는 웹사이트 데이터를 수집하는 데 사용되는 고유한 식별자로, GA4 기준으로 ‘G-XXXXXXX’ 형식을 가집니다. 이 측정 ID는 google analytics 계정에서 확인할 수 있습니다.

google analytics 측정 ID 확인 절차

google analytics 측정 ID를 찾기 위해 다음 단계를 따르면 됩니다.

1. google analytics 계정 로그인

google analytics에 접속한 후, 자신의 계정으로 로그인합니다.

2. 관리자 페이지 이동

좌측 하단에 위치한 톱니바퀴 아이콘(관리자 메뉴)을 클릭하여 설정 페이지로 이동합니다.

3. 데이터 스트림 선택

관리자 페이지에서 “속성” 섹션을 찾고, 그 안에 있는 “데이터 스트림” 옵션을 클릭합니다. 이후 추적할 웹사이트의 스트림을 선택합니다.

4. 측정 ID 확인

선택한 데이터 스트림의 상세 정보 페이지에서 “측정 ID” 항목을 찾을 수 있습니다. 이 ID는 “G-“로 시작하는 코드이며, google analytics 추적 코드 삽입 시 사용됩니다.

google analytics 측정 ID 활용

측정 ID를 찾은 후에는 이를 google analytics 추적 코드에 삽입해야 합니다. 수동으로 설치하는 방법과 Google 태그 관리자를 사용하는 방법이 있으며, 다음 단계에서 각각의 방법을 설명합니다.

수동 설치

google analytics 추적 코드를 수동으로 설치하면 웹사이트의 모든 페이지에서 방문자 데이터를 추적할 수 있습니다. 수동 설치는 직접 HTML 코드에 삽입하는 방식이며, 웹사이트의 태그에 google analytics 추적 코드를 추가하는 것이 중요합니다.

google analytics 추적 코드 삽입 방법

google analytics 추적 코드를 웹사이트에 직접 삽입하려면 아래 단계를 따릅니다.

1. 복사

google analytics 관리자 페이지에서 측정 ID를 확인한 후, 제공되는 추적 코드를 복사합니다. GA4 기준으로 제공되는 기본 코드는 다음과 같습니다.

<!-- Google 애널리틱스 추적 코드 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
</script>

2. HTML 파일의 <head> 태그에 삽입

위 코드를 복사한 후, 웹사이트의 모든 페이지에 적용되도록 <head> 태그 내 적절한 위치에 붙여넣습니다.

<html>
<head>
  <!-- Google 애널리틱스 추적 코드 -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'G-XXXXXXX');
  </script>
</head>
<body>
  <h1>웹사이트 방문을 환영합니다</h1>
</body>
</html>

3. 코드가 정상적으로 실행되는지 확인

코드가 올바르게 삽입되었는지 확인하려면 브라우저에서 웹사이트를 열고, 개발자 도구(F12)를 실행한 후 ‘Console’에서 오류가 없는지 확인합니다.

주의할 점

수동으로 삽입할 때 아래 사항을 고려해야 합니다.

  • 코드는 반드시 <head> 태그 안에 삽입해야 합니다.
  • 같은 코드가 중복으로 삽입되지 않도록 주의해야 합니다.
  • HTTPS가 적용된 사이트에서는 보안 프로토콜을 유지해야 합니다.

다음으로 Google 태그 관리자를 이용한 설정 방법을 설명합니다.

Google 태그 관리자(GTM)로 설정

Google 태그 관리자(GTM)를 사용하면 google analytics 추적 코드를 손쉽게 관리할 수 있습니다. 수동으로 HTML 코드에 삽입하는 방식과 달리, GTM을 이용하면 여러 개의 추적 코드와 이벤트를 중앙에서 제어할 수 있습니다.

Google 태그 관리자 설정 방법

1. Google 태그 관리자 계정 생성

Google 태그 관리자(GTM) 공식 웹사이트에 접속하여 계정을 생성한 후, 컨테이너(Container)를 추가합니다. 컨테이너는 특정 웹사이트 또는 앱에서 사용할 태그들을 관리하는 단위입니다.

2. 컨테이너 설치 코드 삽입

계정을 만들고 컨테이너를 생성하면, 다음과 같은 설치 코드가 제공됩니다.

<!-- Google 태그 관리자 -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':  
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],  
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=  
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);  
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google 태그 관리자 -->

위 코드를 복사하여 웹사이트의 <head> 태그 내 적절한 위치에 삽입합니다.

3. Google 애널리틱스 GA4 태그 추가

GTM 대시보드에서 ‘태그’ 메뉴로 이동한 후, ‘새 태그’를 추가합니다.

  • 태그 유형 선택: ‘Google 애널리틱스: GA4 설정’을 선택합니다.
  • 측정 ID 입력: google analytics에서 확인한 측정 ID(G-XXXXXXX)를 입력합니다.
  • 트리거 설정: 모든 페이지에서 실행되도록 ‘All Pages’ 트리거를 선택합니다.

4. 태그 배포(Publish)

설정이 완료되면 ‘제출(Submit)’ 버튼을 클릭하여 변경 사항을 배포합니다. 배포가 완료되면 정상적으로 실행됩니다.

Google 태그 관리자 사용의 장점

GTM을 사용하면 google analytics 추적 코드뿐만 아니라 Facebook 픽셀, 광고 태그 등 다양한 추적 코드를 한곳에서 관리할 수 있습니다. 또한, 코드 변경 없이 태그를 업데이트할 수 있어 유지보수가 간편합니다.

google analytics 추적 코드 설치 방법 3가지

정상 작동 여부 확인

google analytics 추적 코드가 올바르게 설치되었는지 확인하는 과정은 매우 중요합니다. 정상적으로 작동하지 않을 경우, 데이터가 수집되지 않거나 분석이 부정확할 수 있습니다. google analytics 추적 코드의 정상 작동 여부를 확인하는 방법을 알아보겠습니다.

1. 실시간 보고서를 통한 확인

google analytics에 로그인한 후, 좌측 메뉴에서 ‘실시간’ 보고서로 이동합니다. 해당 페이지에서 현재 웹사이트에 접속한 사용자의 데이터를 실시간으로 확인할 수 있습니다. 정상적으로 추적 코드가 설치되었다면, 웹사이트에 방문자가 있을 때 실시간 보고서에 반영됩니다.

2. 브라우저 개발자 도구 이용

웹사이트에서 정상적으로 실행되고 있는지 확인하려면 브라우저의 개발자 도구를 활용할 수 있습니다.

  • Chrome 브라우저에서 ‘F12’ 키 또는 ‘Ctrl + Shift + I’를 눌러 개발자 도구를 엽니다.
  • ‘Network’ 탭을 선택한 후, 필터에 ‘collect’를 입력합니다.
  • 웹사이트를 새로고침(F5)하면 google analytics 서버로 데이터가 전송되는 요청이 표시됩니다.

3. Google 태그 도우미 확장 프로그램 사용

Google에서 제공하는 ‘Google 태그 도우미(Google Tag Assistant)’ 확장 프로그램을 이용하면 google analytics 추적 코드가 정상적으로 실행되고 있는지 손쉽게 확인할 수 있습니다.

  • Chrome 웹 스토어에서 ‘Google 태그 도우미’ 확장 프로그램을 설치합니다.
  • 웹사이트를 방문한 후, 확장 프로그램을 실행하면 추적 코드의 상태를 분석해 줍니다.
  • 설치된 코드가 올바르게 실행되지 않는 경우, 오류 메시지를 통해 원인을 확인할 수 있습니다.

4. GA Checker와 같은 외부 도구 활용

GA Checker와 같은 외부 도구를 이용하면 웹사이트 내 google analytics 추적 코드가 정상적으로 삽입되었는지 확인할 수 있습니다. URL을 입력하면 google analytics 추적 코드가 포함되어 있는지 검사하고, 오류 여부를 분석해 줍니다.

5. 데이터 지연 여부 확인

google analytics 추적 코드는 설치 후 최대 24시간까지 데이터 반영이 지연될 수 있습니다. 따라서 실시간 보고서에서 즉시 데이터가 표시되지 않는 경우, 일정 시간을 두고 다시 확인하는 것이 필요합니다.