Tech-Logs of Data-Scientist

[github.io 블로그만들기 6편] Google Analytics 연동하기 본문

Github

[github.io 블로그만들기 6편] Google Analytics 연동하기

Mini-Step 2023. 12. 3. 06:43

    SMALL

    이전글

    이전글에서는 로고, 사이드바 등의 이미지를 변경해보았습니다.

     

    이미지 변경 - 로고, 사이드바 등 (github.io 블로그만들기 5편)

    이전글 이전 포스팅에서는 github.io를 운영하면서 main branch에서 수정을 하는 실수를 방지하도록 dev branch에서 수정하는 방법을 알아봤습니다. main branch가 아닌 다른 branch를 바라보도록 설정 (github.

    data-scientist-techlog.tistory.com

     

    이번 포스팅에서는 조회수 등을 확인하기위해 github.io에 Google Analytics를 연동해보겠습니다.

     

     


    1. Google Analytics 설정

     

     

    Redirecting...

     

    analytics.google.com

    먼저, 위의 링크를 통해 Google Analytics에 접속해줍니다.

     

    저는 Google에 한글로 "구글 애널리틱스"라고 검색하고 들어가려고 했는데,

    이렇게하게되면 최상단에 링크로 들어가게되면 저희가 원하는 Google Analytics가 아닌 태그관리자가 뜹니다...

    이것때문에 버전이 변경된 것인 줄 알고 한참 헤맸네요... 여러분들은 실수하지마세요!

     

    그리고 (가입하지않았다면 가입 후) 아래의 캡쳐본과 같이 측정시작을 눌러주고 기본적인 설정들을 해줍니다.

     

     


    2. _config.yml 및 my-head.html 수정

     

    Google Analytics를 다 설정하고나면, 위의 그림과 같이 웹 스트림 세부정보가 보여집니다.

    여기서 우측에 측정 ID를 복사해서 "_config.yml"의 "3rd Party Integrations" 부분에 있는 "google_analytics"에 넣어주시고 주석을 제거해줍니다.

    아래는 "_config.yml" 수정예시입니다.

    # ----------------------------------------------------------------------------------------
    # 3rd Party Integrations
    # ----------------------------------------------------------------------------------------
    
    # Set your Google Analytics id to receive `pageview` events.
    # To remove Google Anaylics from your page, remove the line below.
    google_analytics:      G-JR9VFSTE3T

     

    다음으로 웹 스트림 세부정보의 우측상단에 있는 태그안내보기를 클릭 후, 아래와 같이 나오는 코드들을 복사해서,

    "_includes/my-head.html"에 붙여넣어줍니다.

     

    html 파일을 수정하는 방법은 Window에서는 메모장, Mac에서는 TextEditor로 열어서 수정해주시거나,

    아래와 같이 Jupyter를 사용하는 경우에는 우클릭 후 Open With > Editor를 통해 수정해주시면 됩니다.

    (저는 html 관련해서는 지식이 얕아서.. 이 간단한걸 수정하는데 아주 헤메었습니다..)

     

     


    3. Google Analytics 사용자수 확인

     

    마지막으로, Google Analytics에 들어가서 사용자수가 1이 되었는지 확인해줍니다.

    제가 검색해보기론, 수집이 활성화되면 그 자체가 1으로 카운팅된다고 하던데,

    혹시모르니 github.io에 들어가서 카운팅을 올려줍시다!

     

    위의 그림과 같이 "데이터 수집이 활성화되었습니다" 라고 뜨고, 카운팅이 1 이상으로 나오면 성공입니다!

     

     


    2. _config.yml 및 my-head.html 수정

    다음 포스팅에서는 github.io에서 새로운 포스팅을 작성하는 방법을 알려드리겠습니다!

    반응형
    LIST
    Comments