티스토리 뷰

마이크로소프트 clarity 히트맵은 사용자가 블로그를 사용했을 때 스크롤을 어디까지 내려서 봤는지, 클릭을 어디서 많이 했는지 파악가능합니다. 또한 영상이 녹화되어 운영자가 체크할 수 있어 향후 블로그나 자사 쇼핑몰을 운영할 때 도움이 됩니다.

 

 

 

 

 

목차

     

     

    마이크로소프트 Clarity 설명

    마이크로소프트 clarity는 현재 무료로 운영이 되고 있습니다. 간단한 설치로 내 블로그나 자사 홈쇼핑에 들어온 방문자의 클릭수와 체류시간을 간편하게 체크하므로 추후 관리에 도움을 줄 수 있습니다. 신청방법과 설치방법, 내 티스토리에 연동되는 방법을 정리해 놨습니다. 소요시간은 대략 5분이면 되니 설치로 도움이 되었으면 합니다.

     

     

     

     

     

    clarity 신청방법

    • 하단에 마이크로소트 clarity로 들어가셔서 무료 등록을 하시면 됩니다.
    • https://clarity.microsoft.com/로 접속하시면 됩니다.

     

     

    Microsoft Clarity - Free Heatmaps & Session Recordings

    Clarity is a free user behavior analytics tool that helps you understand how users are interacting with your website through session replays and heatmaps.

    clarity.microsoft.com

     

     

     

     

     

    clarity 설치 방법

    • 마이크로소프트 clarity로 접속하시면 하단과 같은 이미지가 나옵니다.
    • 무료로 등록하세요 클릭합니다.

     

     

    출처 마이크로소프트 clarity

     

     

    • 하단과 같은 clarity에 등록이 나오면 구글 google로 로그인을 합니다.

     

     

    출처 마이크로소프트 clarity

     

     

    • 이름은  사용자가 원하는 이름을 넣을 수 있습니다. 추후 변경 가능합니다.
    • 분석하고자 하는 URL주소를 입력해 주시면 됩니다.
    • 연동하고자 하는 내 티스토리 블로그 URL 주소를 입력해 주시면 됩니다. 

     

     

     

    출처 마이크로소프트 clarity

     

     

    • 입력 후 하단에 거의 다 됐습니다 라는 박스가 나오면 원하는 추적코드 받기를 클릭하시면 됩니다.
    • 보통은 수동으로 설치를 클릭합니다.
    • 이 코는 추후 내 블로그 또는 자사 쇼핑몰이나 그 외 등록시켜야 됩니다.

     

     

    출처 마이크로소프트 clarity

     

     

    • 수동으로 설치를 클릭하면 아래와 같은 코드가 나옵니다.
    • 코드를 복사합니다. 하단 클립보드에 복사를 클릭하면 복사됩니다.

     

     

    출처 마이크로소프트 clarity

     

     

     

    여기까지 마이크로 소프트에서 할 일은 끝났습니다. 위에 있는 수동 코드를 내 티스토리 또는 블로그에 붙여 넣기 해야 연동이 됩니다. 

     

     

     

     

     

    clarity 내 티스토리 연동방법

    • 연동하고자 하는 내 티스토리 블로그에 스킨 편집에 들어갑니다.
    • html 편집에 클릭합니다.

     

     

    티스토리 이미지 블로그홈
    티스토리 이미지

     

     

     

    티스토리 이미지 html
    티스토리 이미지

     

     

     

    • html에 들어가셔서 <head> 아래에다 clarity의 수동 코드를 붙여 넣기 합니다.
    • 반드시 적용을 클릭해 주셔야 합니다.

     

     

    티스토리 이미지 html
    티스토리 이미지

     

     

     

     

    여기까지 마이크로소프트 clarity 등록과 내 티스토리 연동이 끝났습니다. 등록 후 한 시간 이상 정도 처리 시간이 걸릴 수 있습니다. 

     

     

     

    clarity 간단 사용방법

    상단에 보면 내 프로젝트를 클릭하면 전체적인 대시보드가 먼저 나옵니다. 상단에 대시보드, 레코딩, 열전도가 보입니다.

    • 대시보드 : 사용자, 참조 페이지, 인기페이지 등 현재 내 사이트에서 사용자가 반응하는 지수를 전체적으로 볼 수 있습니다.
    • 레코딩 : 현재 또는 과거 내 블로그에 방문했던 방문자가 어떻게 움직이는지 녹화되어 실시간 또는 녹화된 것을 볼 수 있습니다.
    • 열 지도 : 사용자가  블로그에 방문한 지수를 탭, 지수, 영역을 통해 지수를 확인해 볼 수 있습니다.

     

     

     

    마이크로소프트 clarity 이미지2마이크로소프트 clarity 아미지
    출처 마이크로소프트 clarity