티스토리: 구글 애널리틱스 GA4 연동 방법 (2024년 최신 방법)

워드프레스 정보를 제공하는 블로그 Avada 2024. 6. 12. 08:02 • 댓글:

구글 애널리틱스가 유니버설 애널리틱스(UA)와 구글 애널리틱스 4(GA4)로 바뀌면서 애널리틱스의 인터페이스와 방식이 크게 바뀌었습니다. GA4가 처음 도입되었을 당시 연동하는 것이 쉽지 않은 편이었지만, 이제는 쉽게 연동이 가능합니다. 티스토리에서는 구글 애널리틱스 플러그인을 제공하지만, 플러그인을 사용하면 데이터가 수집이 되지 않으므로 애널리틱스 계정과 속성을 만들고 설정한 후에 Google 태그를 헤더 섹션에 직접 추가하여 연동하시기 바랍니다.

티스토리: 구글 애널리틱스 GA4 연동 방법

워드프레스의 경우 플러그인을 사용하여 쉽게 구글 애널리틱스와 연동하고 방문자 통계를 대시보드(알림판)에서 확인할 수 있습니다(참고). 티스토리에서는 직접 GA4 속성을 만들어서 구글 태그(추적 코드)를 헤더 섹션에 추가해야 합니다. 하지만 다행히 이 과정이 초기에 비해 훨씬 간편화되고 쉬워졌습니다.

구글 애널리틱스를 연동하기 위해 먼저 애널리틱스 계정과 속성을 만들어야 합니다. 

기본적으로 계정 생성 » 속성 만들기 » 비즈니스 세부정보 » 비즈니스 목표 » 데이터 수집 순으로 진행이 됩니다.

[참고*이미 GA4 속성을 추가하고 추적 코드를 스킨 파일에 입력했지만 데이터가 수집되지 않는 경우, 기존 코드를 삭제하고 아래의 "GA4 속성 만들기 및 설정 완료하기" 이하 부분을 참고하여 새로 속성을 만들어서 추적 코드를 다시 입력해 보시기 바랍니다.*]

신규로 계정 만들기

구글 애널리틱스를 이용한 적이 없는 경우 여기에서 새로 계정을 만들어 진행할 수 있습니다.

새 계정 이름을 입력하고 계속하여 아래의 "GA4 속성 만들기 및 설정 완료하기" 부분을 참고하여 설정을 완료할 수 있습니다.

기존 UA 속성을 GA4로 전환하기

기존 UA 속성을 사용하고 있다면 상단에 "이 속성은 더 이상 새 데이터를 처리하지 않으며 2024년 7월 1일부터 영구적으로 삭제됩니다. 이전을 완료하지 않았다면 설정 어시스턴트로 이동하여 Google 애널리틱스 4(GA4)를 시작하세요. 이 속성의 데이터에 계속 액세스하려면 지금 데이터를 다운로드해야 합니다." 경고가 표시됩니다.

아마 위의 경고는 2024년 7일 1일 이전까지 표시되고, 이후에는 해당 속성 자체가 삭제될 것 같습니다. 

UA 속성을 사용하고 있고 위과 같은 경고가 표시되면 설정 어시스턴트로 이동하기를 클릭하여 GA4로 전환할 수 있습니다.

기존 계정이 있다면 속성을 추가할 수 있습니다. 또는 계정을 새롭게 추가하는 것도 가능합니다.

위의 화면을 찾기 어려운 경우 해당 계정 내의 아무 속성을 선택하고 만들기 » 속성을 선택하여 속성을 만들 수 있습니다.

GA4 속성 만들기 및 설정 완료하기

속성 만들기 버튼을 클릭하면 속성을 만들 수 있는 화면이 표시됩니다. 하나의 계정에 여러 개의 속성을 추가할 수 있습니다. 보고 시간대를 적절히 선택(예: 대한민국)하고 통화는 미국 달러($)로 그대로 두면 될 것 같습니다. 다음 버튼을 클릭합니다.

비즈니스 세부정보 설정 화면이 표시됩니다.

업종 카테고리를 선택하고 비즈니스 규모를 지정합니다. 저는 블로그라서 작음 - 직원 1~10명을 선택했습니다.😄

다음 단계에서 비즈니스 목표를 선택하는 화면이 표시됩니다.

리드 생성, 온라인 판매 증대, 브랜드 인지도 향상, 사용자 행동 검토, 기준 보고서 보기 등에서 체크가 가능합니다. 아무것이나 하나 선택하면 될 것 같습니다. 

만들기 버튼을 클릭합니다.

데이터 수집 단계 화면이 표시됩니다.

플랫폼을 선택하세요 옵션에서 을 선택합니다.

데이터 웹 스트림 설정 화면이 표시되면 웹사이트 URL을 입력하고 스트림 이름을 적당히 입력합니다.

스트림 세부정보가 표시됩니다.

티스토리에서 구글 애널리틱스 플러인을 사용하는 경우 측정 ID 또는 추적 ID에 이 코드를 입력할 수 있습니다.

티스토리 플러그인을 사용하면 Google 태그가 추가는 되지만, 데이터 수집이 되지 않습니다. 그러므로 티스토리 플러그인을 사용하지 않도록 합니다. (티스토리에서 이 문제를 인식하여 이 플러그인을 개선하거나 삭제했으면 좋겠습니다.)

대신 직접 설치에서 구글 태그(추적 코드)를 복사하여 티스토리 스킨 파일에 추가하시기 바랍니다.

속성 추가 과정이 완료되면 아래와 같은 화면이 표시되어 추적 코드를 복사할 수 있습니다.

만약 추적 코드를 확인할 수 없는 경우 이 글에서 "GA4 추적 코드 확인하기" 섹션의 내용을 참고하여 추적 코드(Google 태그)를 확인할 수 있습니다.

구글 애널리틱스 추적 코드를 스킨 파일에 추가하기

Google 태그는 다음과 같은 형식으로 되어 있습니다.

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-DPXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-DPXXXXXXX');
</script>

위와 같은 코드를 스킨 파일의 <head>...</head> 섹션에 추가합니다.

티스토리 관리자 페이지에 로그인한 다음, 꾸미기 » 스킨 편집을 클릭하고 스킨 편집 화면에서 html 편집 버튼을 누릅니다.

스킨 파일 편집 화면이 표시되면 HTML 탭에서 <head>...</head> 사이에 구글 태그를 입력합니다.

수정 사항을 저장하고 48시간 정도 기다리면 데이터 수집을 시작할 것입니다.

구글 태그가 제대로 삽입되었는지 확인하기

참고로 Google 태그가 제대로 추가되었는지는 구글 크롬 등 브라우저에서 페이지 소스를 체크하여 확인할 수 있습니다. 구글 크롬에서 Ctrl+U를 누르면 페이지 소스가 표시됩니다. Ctrl+F를 눌러 googletagmanager를 검색할 수 있습니다.

또한, 구글 애널리틱스 계정 관리 페이지의 설치 안내 페이지에서도 "웹사이트 테스트" 섹션의 테스트 버튼을 눌러 체크할 수 있습니다.

Google 태그가 감지되지 않으면 "웹사이트에서 Google 태그가 감지되지 않았습니다" 오류가 표시됩니다.

[경고*티스토리에서 제공하는 구글 애널리틱스 플러그인을 사용하여 추적 ID를 입력하는 경우 테스트에 통과하고 페이지 소스에서도 코드가 삽입된 것을 확인할 수 있지만, 실제 데이터가 수집되지 않을 것입니다.*]

애널리틱스와 연동한 후 48시간 정도 지나면 데이터가 수집되기 시작합니다. 제대로 작동하기 시작하면 실시간 개요 보고서에 실시간 사용자 수가 표시됩니다.

티스토리: 구글 애널리틱스 GA4 연동 방법 (2024년 최신 방법)

참고

https://avada.tistory.com/3046

 

해외웹호스팅: 클라우드웨이즈 vs. 블루호스트 vs. 카페24 비교 (Cloudways vs. Bluehost vs. Cafe24)

저는 오랫동안 블루호스트(Bluehost)를 이용해 왔으며 2021년부터는 클라우드웨이즈(Cloudways) 웹호스팅 서비스도 함께 이용하고 있습니다. 현재 일부 중요하지 않는 블로그는 Bluehost에서 호스팅되고

avada.tistory.com

https://avada.tistory.com/2897

 

엘리멘터 무료 버전 vs. 프로 버전 비교

엘리멘터(Elmentor)는 500만 개가 넘는 사이트에 설치되어 사용되고 있는 인기 워드프레스 페이지 빌더 플러그인입니다. 엘리멘터는 무료 버전과 프로 버전으로 제공됩니다. Elementor 프로 버전에서

avada.tistory.com

https://avada.tistory.com/2647

 

구글 애널리틱스 GA4 내부 IP 통계 트래픽 제외하기

내년 7월 1일부터 유니버설 애널리틱스 기능이 중단될 예정이며, 유니버설 애널리틱스 속성을 사용하고 있는 경우 Google 애널리틱스 4 속성으로 전환하라는 알림이 표시됩니다. 저는 2023년 7월 1

avada.tistory.com

 

워드프레스 네이버 카페