티스토리 블로그 자동 목차 만들기

내 블로그 글이 구글에서 검색이 잘되게 하기 위해서 목차를 만들면 좋습니다. html이 좀 어렵긴 하지만 차근차근 따라만 하시면 자동 목차를 만들 수 있습니다. 오늘은 티스토리에서 자동으로 목차 만들기를 해보겠습니다. 

 

 

목차를 만드는 법은 두가지가 있습니다. '모든 글에 자동으로 목차가 들어가는 방법'과 '글마다 목차를 만들어주는 방법'입니다. 아래 장단점을 보시고 둘중 하나를 선택해서 설정하세요. 

1. 자동목차 만들기의 두가지 방법과 장단점, 해결법

1-1. 모든글 목차 자동 삽입의 장단점

• 장점 : 한번 html 코드 삽입으로 모든 글에 목차가 자동으로 나옵니다. 이전에 쓴 모든 글에 적용됩니다. 
• 단점 : 목차가 필요없는 글에도 목차가 생깁니다. 

1-2. 글마다 목차 수동 삽입의 장단점

• 장점 : 목차가 필요없는 포스팅에는 안나오게 할수 있습니다. 
• 단점 : 항상 소스 코드 파일을 가지고 있다가 넣어주어야 합니다. 이전글은 적용이 안됩니다.   

• 나의 해결법 : 1번으로 자동으로 나오게 하고, 목차가 필요없는 글에는 포스팅의 맨 아래에 나오게 해서 글을 읽을 때 방해가 되지 않도록 합니다. 

※ 위의 두 방법을 함께 사용할 수는 없습니다. 둘중 하나를 선택해서 사용하세요. 

 

11개 포스팅으로 10일만에 애드센스 광고 승인받는 비결

2. '티스토리 블로그 자동목차코드' 다운로드

아래 파일을 다운로드 받은 후 열어두세요. 

티스토리블로그목차코드.txt

0.01MB

3. 모든글에 목차 자동 삽입하는 방법

3-1. 관리자 화면에서 '자동목차코드' 삽입하기 

티스토리 블로그의 관리자화면으로 갑니다. 

왼쪽 메뉴 중 '꾸미기/스킨편집' 클릭합니다. 

오른쪽 스킨편집에서 'html 편집'을 클릭합니다. 

스크롤을 가장 하단으로 내리면 </body>가 있습니다. </body> 위에 다운받았던 '티스토리블로그목차코드'를 넣습니다. 

한줄로 들어가기 때문에 전체가 다 보이진 않을꺼예요. 

만약 </body>를 잘 못찾겠으면 키보드에서 'Ctrl+F'를 누른후 '</body>' 라고 검색해서 찾습니다. 

오른쪽 상단에 '적용' 클릭합니다. 버튼 색이 잠시 진해졌다 다시 그대로 돌아갑니다. 적용된 것입니다. 

3-2. 목차가 나오는지 테스트 하기 

글쓰기 창을 열어서 아래와 같이 작성해 봅니다. 일단 목차로 만들어 줄 것에 '제목태그'를 넣어야 합니다.

아래 왼쪽과 같이 글을 작성 한 후, 상단 에디터에서 각각의 대목차에 '제목1'을 적용시킵니다. 중목차에는 '제목2'를 적용시킵니다. 소목차가 있다면 '제목3'을 하면 됩니다. 그런데 보통 소목차까지는 만들지 않습니다. 

아래는 대목차에 '제목1'을 적용 시키고, 보기 편하도록 빨간색으로 바꾼 것입니다. 색 적용은 안하셔도 됩니다. 

상단 에디터 제목1,2,3을 적용하는 모습니다. 

'발행'을 하시면 자동으로 목차가 가장 위에 생성이 됩니다. 글 발행을 해야 목차는 보여요. 예전에 작성한 글에도 제목태그를 넣어서 포스팅했다면 자동으로 목차가 생성 되어 있을 겁니다. 

3-3. 목차 위치를 변경하고 싶을때 

자동목차는 항상 제일 위에 뜨게 됩니다. 보통 포스팅을 할때 개요를 쓰고, 썸네일을 넣고, 목차를 뜨게 경우가 많아요. 이렇게 목차의 위치를 변경하고 싶으면 아래와 같이 원하는 곳에 [ 목차 ] 라고 써주고 '발행'을 누르면 목차의 위치가 변경 됩니다. 

 

 

돈버는 수익형 티스토리 블로그 셋팅법

4. 원하는 글에만 목차를 삽입하는 방법

4-1. 글 작성 화면에서 '자동목차코드' 삽입하기 

아래와 같이 '제목태그'를 사용해서 글을 작성 후 오른쪽 상단 '기본모드->HTML' 로 변경 합니다. 

맨 위에서 다운받은 '티스토리블로그 목차코드' 파일을 연 후 내용을 복사합니다. 어디에 넣어도 상관없지만 보기 편하게 맨 아래에 넣어주세요. 이번에는 여러줄로 보이네요. 

오른쪽 상단에 'HTML->기본모드' 로 변경하세요. 아래와 같이 나오는게 정상입니다. 

오른쪽 하단의 '발행'을 누르면 이제 제대로 된 목차를 보실 수 있습니다. 목차의 위치를 변경하고 싶을땐 3-3처럼 해주면 됩니다. 

※ 참고 : 티스토리 스마트폰 앱에서는 목차가 안나옵니다. 그런데 보통 네이버, 구글에서 검색해서 들어오지 티스토리 앱을 사용해서 들어오시는 분들이 없으니 신경 안쓰셔도 됩니다. 카카오톡으로 여러분의 글을 공유하셨다면 카톡에서 들어올때는 잘 보입니다. 

 

이렇게 티스토리 자동목차만들기를 함께 해보았습니다. Html을 수정하는거라서 좀 어렵지요. 그래도 그대로 따라하니 목차가 자동으로 생성돼서 좋았습니다. 다음에도 수익형 블로그 운영 시 필요한 정보를 계속 업로드 하겠습니다. 감사드립니다. 

수익형 블로그 무료 로고 만드는 법 : 해치풀(Hatchful)

수익형 블로그 무료 로고 만드는 법 : 해치풀(Hatchful)