본문 바로가기
수익형 블로그 챌린지/티스토리 꾸미기

티스토리 목차 만드는 가장 쉬운 방법

by 빅픽쳐 2023. 1. 6.

 

썸네일: 티스토리 목차 만드는 가장 쉬운 방법

 

 

블로그에 목차를 추가하면 전체적인 내용을 서두에서 볼 수 있다는 장점이 있다. 또한 글의 내용이 길면 길어질수록 목차 링크를 이용해서 가독성을 높여줄 수 있을 뿐만 아니라 구글이 원하는 검색 노출에도 도움이 된다. 이번 포스팅에서는 티스토리 서식을 이용한 본문 목차 추가하는 방법에 대해 소개하고자 한다.

 

 

<목차>

본문 목차 추가하는 방법
서식 1. 출발 링크

서식 2. 도착 링크
목차 링크 확인하는 방법

 

 

본문 목차 추가하는 방법

 

예를 들어 위의 목차 제목을 누르면 해당 항목으로 이동되는 것을 확인할 수 있다.

 

블로그 관리 홈 > 콘텐츠 > 서식 관리로 이동해서 ‘서식 쓰기’ 버튼을 클릭한다. 총 2개의 서식을 작성해야 하는데 첫 번째는 목차 부분이고(출발 링크), 두 번째는 그 목차의 이동 위치이다(도착 링크).

 

 

 

서식 1. 출발 링크

 

기본모드를 HTML로 변경해서

 

<a href="#01">1.첫번째 제목</a><br

<a href="#02">1.두번째 제목</a><br

<a href="#03">1.세번째 제목</a><br

              ....

 

이런 식으로 입력해주고 5개 정도만 세팅해 준다.

 

HTML 편집화면

 

다시 기본모드로 돌아오면 다음과 같이 출발 링크가 만들어졌음을 확인할 수 있고

완료’ 버튼을 눌러 저장해 준다.

 

목차 &#39;출발 링크&#39; 완성된 모습

 

 

 

서식 2. 도착 링크

 

이제 이동할 곳에 ‘id 태그’를 입력해주면 되는데,

 

<br> <p id="1.제목"><br></p>

<br> <p id="2.제목"><br></p>

<br> <p id="3.제목"><br></p>

              ....

 

목차 &#39;도착 링크&#39; 완성된 모습

 

마찬가지로 5개 정도만 생성해 주고 ‘완료’ 버튼을 눌러 저장한다. 앞서 만든 출발 링크 1. 첫번째 제목을 클릭하면 도착 링크 1. 제목으로 이동할 수 있다.

 

 

목차 링크 확인하는 방법

 

앞서 만든 목차 링크를 서식으로 불러다가 글을 작성하고 나면 쉽게 완성되지만, 글쓰기 상태에서는 해당 링크가 눌리지 않기 때문에 제대로 작동이 되는 건지 확인해 볼 수가 없다.

 

이는 미리 보기를 해도 마찬가지이지만, 예약발행을 해서 확인해볼 방법이 있다. 특히나 예약발행은 아직 글이 발행된 상태가 아니기 때문에, 마음 놓고 글의 수정을 마음대로 할 수 있다.

 

이상 별도 스킨 편집 없이 티스토리 서식만을 이용한 손쉽게 목차를 만드는 방법에 대해 알아보았습니다.

 

 

 

구글 최적화 - 구글이 좋아하는 사진이 있다고?

구글이 좋아하는 사진은 반드시 있다. 그 말은 페이지 로드하는 시간이 길어질수록 구글은 싫어한다는 것이다. 그렇다면 어떻게 하면 평균 페이지 로드 시간을 줄일 수 있을까? 바로 이미지 사

chalchalchallenge.tistory.com

 

 
 

댓글