반응형

Notion 페이지에 방문자 수를 표시하는 글을 앞서 작성했었어요.

그리고 이번에는 그 페이지의 URL을 줄여서 공유하는 방법을 간략하게 정리했습니다.

 

 

 

Notion 페이지에 방문자 수 표시하기

나는 자기 소개 페이지를 Notion으로 만들어서 인스타 프로필에 등록했다. 아무래도 나를 여러 방면으로 알리고 싶지만, 한가지 URL로 여러 정보를 전달하기 위해서는 이게 최선이었다. Notion은 작

yung.tistory.com

 

제가 위의 글에서 방문자 수 표시용 페이지를 Notion으로 만들었는데요.

URL은 아래와 같습니다.

https://spectacular-phlox-2bf.notion.site/4bd8e01b43a744b2bd4af348e923a364

 

방문자 수 표시용 페이지

안녕하세요~ 방문자 수 표시용 페이지에요😆

spectacular-phlox-2bf.notion.site

 

링크를 클릭해보시면 아래처럼 방문자 수를 확인하실 수 있어요.

 

 

이제 이 URL을 공유하기 좋게 짧게 줄이려고 해요.

이를 위해서 필요한게 Bitly라는 서비스입니다.

 

 

Bitly. The power of the link.

 

bitly.com

 

위의 링크를 클릭하셔서 회원가입 후에 사용하시면 돼요.

예시로 보여드렸던 Notion 페이지 URL을 짧게 줄여볼게요.

Bitly 서비스에 로그인하셔서 상단의 CREATE 버튼을 클릭하세요.

 

 

그러면 아래처럼 CREATE LINK라는 창이 노출돼요.

여기서 PASTE LONG URL 하단에 줄이고 싶은 Notion 페이지의 URL을 입력해 주세요.

 

 

URL을 복사/붙여넣기 하시면 자동으로 아래처럼 화면이 바뀝니다.

여기서 COPY 버튼을 클릭하시면 짧아진 URL을 복사해서 사용하실 수 있어요.

 

 

변경 전/후의 url은 아래와 같아요.

 

 

각각의 url을 직접 확인해보시면 알겠지만, 아래처럼 같은 화면을 보여주고 있어요.

참고로, Notion 페이지의 url 외에도 Bitly 서비스로 변환해서 사용하실 수 있습니다.

 

https://spectacular-phlox-2bf.notion.site/4bd8e01b43a744b2bd4af348e923a364

 

방문자 수 표시용 페이지

안녕하세요~ 방문자 수 표시용 페이지에요😆

spectacular-phlox-2bf.notion.site

 

https://bit.ly/3zHATXU

 

방문자 수 표시용 페이지

안녕하세요~ 방문자 수 표시용 페이지에요😆

spectacular-phlox-2bf.notion.site

 


해당 글이 유용하셨다면 댓글을 남겨주세요:)

또한, 수정이 필요한 부분이나 개선점 같은 내용도 댓글로 남겨주시면 여러모로 도움이 될 것 같습니다.

앞서 작성했었던 글을 보니 독백 형식의 글을 제외하고는 앞으로 이렇게 작성할 것 같아요.

수정할 부분이 더 있지만, 딱딱한 말투보다는 대화하듯이 정보를 전달하는게 더 좋은 것 같다는 생각이 들었어요.

반응형
반응형

나는 자기 소개 페이지를 Notion으로 만들어서 인스타 프로필에 등록했다.

아무래도 나를 여러 방면으로 알리고 싶지만, 한가지 URL로 여러 정보를 전달하기 위해서는 이게 최선이었다.

Notion은 작년에 일을 하면서 알게 되었는데, 다양하게 활용하기 좋은 서비스라고 생각했다.

그래서 시간이 날 때마다 독학을 하면서 기능을 조금씩 익히고 무료 강의도 수강했다.

그리고 지금은 Notion을 잘하는 것은 아니지만 여러 방면으로 활용하고 있으며,

윈도우용 PC와 맥북, 아이폰, 아이패드에 전부 설치해서 사용하고 있다.

 

내 Notion 페이지를 보면 아래처럼 방문자 수가 표시되고 있다.

내가 페이지에 접근한 기록은 제외되었으면 하지만, 간단하게 사용하기에는 좋다.

이 서비스는 Notion으로 개인 블로그를 만들어 볼까 고민하던 중에 알게되었다.

그리고 나처럼 Notion 페이지를 활용하고 싶은 분들을 위해서 아래에 정리하였다.

 

Notion 페이지에 방문자 수 표시 (예시)

 

방문자 수를 표시하기 위해서는 HITS 서비스를 사용하면 된다.

아래 링크를 클릭하자.

 

 

HITS

Easy way to know how many visitors are viewing your Github, Website, Notion.

hits.seeyoufarm.com

 

HITS 페이지로 이동하면 아래와 같은 화면을 볼 수 있다.

TARGET URL에 방문자 수를 표시하고 싶은 페이지의 URL을 입력하자.

나는 예시를 보여주기 위해서 티스토리 블로그의 URL을 사용했으며,

Notion 페이지에 적용하려면 그 페이지의 공유 링크를 입력하면 된다.

그리고 아래에 빨간색으로 표시된 상자에 있는 hits 0 / 0 부분이 바로 방문자 수를 나타내는 badge가 되겠다.

 

방문자 수 표시 badge 설정 화면

 

옵션이 다양한건 아니지만, 원하는 모양과 색상으로 badge의 스타일을 변경할 수 있다.

그리고 TITLE도 변경할 수 있는데, 한글도 사용할 수 있다.

badge에 표시되는 숫자는 앞 부분이 그 날의 방문자 수를 의미하며, 뒷 부분이 전체 방문자 수를 나타낸다.

그래서 나는 간단하게 "Today / Total"로 변경해서 사용 중이다.

 

방문자 수 badge 색상 변경 (예시)

 

badge를 원하는 스타일로 설정하면 스크롤을 아래로 살짝 내려보자.

그러면 아래처럼 badge를 원하는 방식으로 사용할 수 있도록 3개의 코드가 준비되어 있다.

우리는 그 중에서 "EMBED URL (NOTION)"으로 적힌 곳의 코드를 사용할 것이다.

copy를 눌러서 해당 코드를 복사하자.

 

 

아래는 예시를 위해서 만든 Notion 페이지이다.

위에서 복사한 코드를 사용하기 위해서 "/em"을 입력하여 임베드를 선택하자.

 

임베드 선택 화면

 

그러면 아래와 같이 임베드 정보를 입력할 수 있는 창이 노출되며,

앞서 복사했던 방문자 수 badge의 코드를 여기에 입력하면 된다.

입력 후에는 반드시 링크 임베드를 클릭하자.

 

임베드 입력 화면

 

복사한 코드가 제대로 입력되었다면 아래처럼 방문자 수 badge가 노출되는 것을 확인할 수 있다.

컴퓨터 상태가 안좋아서 크롬을 재실행하는 김에 한글도 반영해 보았다.

 

방문자 수 badge 코드가 적용된 화면

 

참고로, badge의 양 옆에 커서를 올리면 크기를 조절할 수 있다.

 

 

나는 아래처럼 가독성있게 적절한 크기로 badge를 조절했다.

 

 

이제는 방문자 수가 제대로 갱신되는지 확인해볼 차례이다.

Notion에서 오른쪽 상단에 있는 공유 버튼을 클릭하면 아래와 같은 창이 노출된다.

"웹에서 공유 항목"을 활성화시켜주자.

 

Notion 페이지 공유 기능

 

그러면 "웹에서 공유 항목" 아래에 Notion 페이지의 링크가 생성된다.

복사 버튼을 클릭해서 URL을 복사하자.

 

Notion 페이지 공유가 활성화 된 상태

 

복사한 URL을 크롬 같은 웹 브라우저에 입력하여 해당 페이지로 이동하면,

방문자 수가 증가한 것을 확인할 수 있다.

 

 

 


해당 글이 유용하셨다면 댓글을 남겨주세요:)

또한, 수정이 필요한 부분이나 개선점 같은 내용도 댓글로 남겨주시면 여러모로 도움이 될 것 같습니다.

반응형

'IT > 노션' 카테고리의 다른 글

노션 카테고리 설명  (0) 2021.06.24
반응형

지난 6월 24일, 구글 서치 콘솔에서 받은 메일에 관한 글을 작성했었다.

간략하게 정리하면 구글 서치 콘솔에서 보낸 메일에는 이 블로그에 문제가 있다는 것이었다.

오류 내용은 "‘itemListElement’ 입력란이 누락되었습니다."이며,

오류를 확인하고 해결하기 위한 내용들을 앞서 작성했었다.

자세한 내용이 궁금하다면 아래 링크를 클릭하면 확인할 수 있다.

구글 서치 콘솔 메일 - ‘itemListElement’ 입력란이 누락되었습니다.

 

그리고 오늘은 오류를 처리하고 난 이후의 결과를 정리하기 위해서 글을 쓰려고 한다.

원래는 앞서 작성했던 글에 추가로 후기를 작성할까 생각했었다.

그러나 기존 글이 너무 길어지면 모바일로 읽기 불편할 것 같아서 새로 글을 작성하기로 했다.

사설이지만, 내가 직장인이었을 때, 나는 주로 출/퇴근 시간에 업무 중 발생한 이슈들을 검색했었다.

이슈 해결을 위해서 구글에서 관련 정보들을 검색하면 티스토리 블로그가 자주 보였다.

문제는 스마트폰에서 티스토리 블로그의 글을 보면 가독성이 떨어지는 글들이 꽤 많았다.

어떤 글은 원하는 내용이 담겨있었지만, 그 내용을 찾기 위해서 스크롤을 한참 동안 아래로 내려야 했다.

 

아무튼, 이제 본론을 얘기하자면 나는 24일날 문제 해결 확인을 요청했으며,

정확히 25일 오후 11시 47분에 아래와 같은 메일을 받을 수 있었다.

빈 카테고리가 없도록 글들을 작성했던 방법은 다소 귀찮은 해결책이었지만, 이슈 해결을 위한 정답이었다.

 

 

메일에서 문제 세부정보 보기 버튼을 클릭하면, 구글 서치 콘솔 화면으로 넘어가면서 아래와 같은 정보가 나온다.

내용을 보면 유효성 검사 상태가 통과된 것으로 나오며, 확인 요청과 확인 완료된 날짜가 나온다.

그리고 앞으로는 같은 이슈가 발생하지 않도록 카테고리를 생성하면 무조건 해당 카테고리를 설명하는 글을 작성할 생각이다.

 

반응형
반응형

화요일 밤, 취침을 위해서 침대 위로 올라가는 도중에 메일을 하나 받았다.

발신인은 구글 서치 콘솔이었다.

이 블로그에 무언가 문제가 있다는 것 같은데, 정확히 무슨 이슈인지 모르겠어서 일단 잠들었다.

그리고 오늘 휴식 시간에 생각이 나서 메일을 확인했다.

메일에는 아래 내용이 기재되어 있었다.

 

 

오류 내용은 "‘itemListElement’ 입력란이 누락되었습니다."이다.

이게 도대체 무슨 뜻인지 모르겠지만 문제 해결을 위해서 검색을 해보았다.

검색을 해보니 글이 하나도 없이 비어있는 카테고리 때문에 발생하는 문제라고 한다.

일단, 탐색경로 문제 해결하기 버튼을 눌러보았다.

버튼을 누르니까 구글 서치 콘솔 화면으로 이동한다.

 

 

새로 노출된 구글 서치 콘솔 화면에는 위에처럼 오류 메시지처음 감지된 날짜가 표시되고 있다.

그리고 그 아래의 그래프를 보면 6월 22일부터 23일까지 오류 상태라는 것을 확인할 수 있다.

아마 오늘도 오류 상태가 해결되지 않는다면 내일은 저 그래프에 6월 24일 목요일 항목이 추가될 것이다.

 

 

그래프 아래에는 위에처럼 예라는 패널이 존재한다.

그래서 URL을 클릭해보았는데, 그러면 아래처럼 HTML 코드가 보인다.

일단, 저 화면에서 붉은색으로 표시된 곳이 오류와 관련이 있을 것 같다.

그래서 BreadcrumbList를 검색해보았다.

BreadcrumbList는 우리말로 "탐색경로"라고 이해하면 된다. (구글 검색 센터에서도 그렇게 표기하고 있다.)

BreadcrumbList는 사이트의 계층 구조에서 페이지의 위치를 나타낸다.

그리고 사용자가 사이트를 효과적으로 이해하고 탐색하는데 도움이 된다.

참고로, 2021년 1월 29일부터는 data-vocabulary.org 마크업이 아닌 schema.org 마크업으로 교체해야 된다고 한다.

자세한 내용은 아래 링크를 참고하자.

Sunsetting support for data-vocabulary

 

 

 

아무튼 실제로 문제가 있는 부분은 BreadcrumbList가 아니라 오류 메시지에 나오는 "itemListElement" 이다.

위의 HTML 코드에서는 BreadcrumbList 바로 옆에 있다.

보면 itemListElement가 []로 표시되어 있는데, 이는 itemListElement가 비어있다는 뜻이다.

이제서야 오류 메시지가 이해가 된다.

구글 검색 센터에서 예제를 찾아보면 itemListElement의 데이터는 아래와 같은 형식으로 필요하다.

그리고 표준이 어떤지 찾아보지는 않았지만, 에러를 보면 itemListElement는 반드시 최소 1개의 데이터가 필요한 것으로 보인다.

 

 

현재 이 블로그에는 왼쪽처럼 카테고리가 구성되어 있으며, 총 11개의 카테고리가 게시글이 0이다.

그리고 구글 서치 콘솔에서는 "C# 문법" 카테고리에서 오류가 발견되었지만,

이 카테고리만 수정하면 다른 카테고리에서도 동일한 오류들이 발생할 것이다.

그래서 문제를 해결하기 위해서는 게시글이 없는 11개의 카테고리 모두에 게시글을 1개씩 작성하거나, 카테고리를 삭제해 주면 된다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

나는 문제해결을 위해서 게시글을 1개씩 작성해줬다.

그리고 아직은 각 카테고리별로 작성할 내용이 없기 때문에 아래처럼 카테고리 설명을 하나씩 작성했다.

 

 

게시글을 작성해서 빈 카테고리가 없다면 오류 패널의 수정 결과 확인 버튼을 클릭하면 된다.

그러면 아래처럼 구글 서치 콘솔에서 새로운 메일을 보내준다.

이제 확인이 끝날 때까지 기다리는 일만 남았다.

 

반응형
반응형

이 카테고리는 노션 사용 중에 작성한 수식이나 팁 등을 기록하기 위해서 만들었다.

누군가에게 도움이 되었으면 하는 바램도 있지만, 기억력이 예전 같지는 않기 때문에 나를 위해서도 필요한 것 같다.

반응형

'IT > 노션' 카테고리의 다른 글

Notion 페이지에 방문자 수 표시하기  (0) 2021.07.26
반응형

이 카테고리는 IT 트렌드, 정보, 이슈 등을 기록하기 위해서 만들었다.

퇴사를 하고 뉴스 마저 띄엄 띄엄 보기 때문에 요즘은 세상이 어떻게 돌아가는지도 잘 모르겠다.

그런데 IT는 변화하는 속도가 빠르기 때문에 주기적으로 정보를 찾고 공부할 필요가 있다.

그래서 매일은 힘들겠지만, 적어도 일주일에 한번 정도는 IT 정보들을 찾아서 새로운 것들을 정리하려고 한다.

반응형
반응형

오늘은 아주 오랜만에 맥북 프로의 OS를 새로 설치하기로 했습니다.

2014년에 구입한 오래된 맥북이지만, 외출 시 간단한 업무 처리를 위해서는 아직도 쓸만한 것 같습니다.

우선, 맥OS를 새로 설치하기 위해서 맥북의 사양을 확인해 봤습니다.

 

TIP. 맥북의 사양 확인 방법
1) 화면 상단의 사과 아이콘 클릭
2) "이 Mac에 관하여"를 클릭

 

 

저의 맥북에는 모하비가 설치되어있네요.

그리고 마지막으로 출시된 맥OS를 찾아보니 이름이 Big Sur입니다.

그럼 제 맥북에 Big Sur가 설치 가능한지 확인해볼까요?

Big Sur를 지원하는 모델은 아래 링크를 클릭해서 확인하실 수 있습니다.

macOS Big Sur와 호환되는 컴퓨터

 

제가 사용하는 맥북 프로는 제일 마지막에 기재되어 있습니다.

어쩌면 다음에 출시되는 맥OS는 제 맥북에서 사용하지 못할 것 같다는 생각이 드네요.

 

 

기왕이면 Big Sur 설치용 USB를 만들어서 클린 설치를 하고싶지만, 현재 저에게 용량이 큰 USB가 없네요.

그래서 번거롭지만 Big Sur를 두번 설치해서 USB로 클린 설치하는 것과 동일한 결과를 보려고 합니다.

그리고 시간이 꽤 소요되기 때문에 귀찮으신 분들은 설치용 USB를 만들어서 진행하세요.

 

Big Sur 설치를 위해서 맥북의 앱스토어에서 "macos big sur"를 검색해 주세요.

그러면 아래처럼 검색 결과가 3건이 나옵니다.

macOS Big Sur의 "보기" 버튼을 클릭해 주세요.

 

 

그리고 "받기" 버튼을 눌러서 Big Sur 11.3.1 버전을 다운로드 받아주세요.

 

 

다운로드 받는데 시간이 좀 걸립니다.

 

 

저는 다운로드 후에 바로 설치를 진행했습니다.

설치하고 재부팅 하기까지 시간이 오래 걸리네요.

저는 아이패드로 모바일 게임을 하면서 기다렸습니다.

 

 

드디어 Big Sur가 설치 완료되었습니다.

 

 

그럼 이제 클린 설치하는 것처럼 하드를 포맷할 차례네요.

맥북을 재부팅하고 애플 로고가 나오기 전까지 command + R키를 동시에 누르고 계세요.

그리고 사용자 선택 화면이 노출되면 사용자 선택 후 암호를 입력하시면 됩니다.

제 맥북은 Intel 프로세서를 사용하기 때문에 간단하게 복구 모드로 진입할 수 있지만, 아닌 분들은 아래의 링크를 참고하시면 됩니다.

macOS를 다시 설치하는 방법

 

그리고 아래 화면에서 디스크 유틸리티를 선택해서 디스크를 포맷하시면 됩니다.

제가 찍은 화면이 잘 안보여서 애플에서 제공하는 이미지를 함께 추가했습니다.

 

 

디스크 유틸리티 화면에서 포맷하시려는 디스크를 선택하신 후에 "지우기" 버튼을 클릭하세요.

저는 기본인 APFS 포맷으로 디스크를 포맷했네요.

 

 

그리고 포맷하신 후에 맥OS 설치를 안해주시면 맥북이 부팅된 후에 아래처럼 나옵니다.

반드시 OS 설치를 해주세요!

 

 

디스크 포맷 후 앞의 화면으로 돌아간 후에 "macOS Big Sur 다시 설치"를 선택해 주세요.

약관에 동의하신 후에 OS를 설치할 디스크를 선택해주시면 설치 과정이 진행됩니다.

 

 

OS 설치가 완료되면 아래처럼 초기 설정 화면이 노출됩니다.

저는 게임하면서 기다리다가 갑자기 맥에서 Siri 같은 음성이 나와서 깜짝 놀랐네요.

 

 

기본 설정 완료 후에 맥북의 사양을 확인해보면 Big Sur로 설치된 것을 확인하실 수 있습니다.

그런데 설치 후에 확인해보니 250GB인 디스크의 사용 가능 용량이 90GB 정도 밖에 안남았네요.

어차피 간단한 업무만 처리할 생각이기 때문에 괜찮지만, 기본적으로 설치되는 것들이 용량을 많이 차지하네요.

 

 

복구 모드에서 바로 모하비 대신 Big Sur를 설치하면, 위에처럼 번거롭지 않고 좋을 것 같은데 확인을 못해봤네요.

그래도 누군가에게는 도움이 되었기를 바라면서 글을 남깁니다.

반응형

+ Recent posts