티스토리 블로그 목차 만들기 (내부 링크 이용 a href 태그 활용 방법)

인터넷을 하다보면 티스토리 블로그 목차가 있어서 내가 원하는 내용이 있는 부분으로 바로 이동이 되는 블로그를 보신 분들 있으실 겁니다. 그래서 검색해서 찾아오셨겠죠? 이 기능은 블로그 자체에서 html 태그를 이용해서 내부 링크처럼 연결을 하는 기능입니다. 한번 알아두면 편리하게 사용하실 수 있습니다.

 

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

1. 티스토리 블로그 내부 링크 걸기 태그

2. 티스토리 블로그 내부 링크 예제

3. 티스토리 블로그 내부 링크 연결시 팁

 

 

티스토리 블로그 내부 링크 걸기 태그

티스토리 블로그 안에 링크를 걸어 사용할 때는 아래 형식을 사용합니다.

목차에 적어야 하는 html <a href="#01">  목차 텍스트 </a>

목차에 연결될 소제목에 적어야하는 html <p id=01"> </p>

 

 a href태그를 이용해서 위에 #01 부분을 #01, #No01등의  형태로 적어주시면 됩니다. 아무 글자나 상관없습니다. 그리고 목차 텍스트 뒤에 </a>를 적어주시면 링크가 달립니다. 그리고 id=01 부분은 위에 #01에 댕응될 수 있도록 #부분을 빼고 01, No01 등으로 적으면 됩니다.

 

 

티스토리 블로그 내부 링크 예제

html 처음 사용해보시는 분들이라면 위에 글만 보고는 이게 무슨 소리인가 싶으실 것 같아 좀 풀어서 적어보겠습니다. 저도 html 잘 모릅니다. 그냥 적어야 하는 부분에 잘 적어 놓으면 잘 동작되더라고요. 뭔가 안되면 안적은게 있는겁니다. 

 

예를 들어서 위에 내용처럼 목차를 만들고 싶다면 

 

다음팟인코더 목차

1. 다음팟인코더 다운로드

2. 다음팟인코더 설치방법

 

이렇게 적어놓으시고

 

 

이렇게 내용을 추가하기 시작합니다. 소제목에 같은 글자로 안 해도 됩니다. 하지만 같은 글자로 해야 목차 기능이 잘 사용되겠죠? 아무튼 그리고 내용들을 쭉 다 적습니다. 소제목 달고 밑에 글도 적고 다 작업하신 다음에 티스토리 블로그 오른쪽 상단에 기본 모드를 클릭하셔서 html을 클릭해줍니다.

 

그러면 html 화면이 나오는데 뭐가 복잡하지만 거기서 목차로 위에 적어뒀던 "1. 다음팟인코더 다운로드"를 찾습니다. 잘 안보이면 Ctrl+F 찾기 기능을 이용해서 검색해서 찾으셔도 됩니다.

 

 

그리고 <a href="#01"을 "1. 다음팟인코더 다운로드" 글자 앞쪽에 적으시고 </a>를 글자 뒤에 적습니다.

그 다음은 이동할 소제목에 글자 부분에 위에 대응하는 id=01을 적어줍니다. <p> 부분에 적으라고 되어 있지만 h2를 소제목으로 해놨기 때문에 h2부분에 적어 넣으면 됩니다.

 

 

티스토리 블로그 내부 링크 연결 시 팁

저도 다른 티스토리 블로그들을 찾아다니다 보니 글을 읽을 때 편해서 제 블로그를 찾는 분들도 편하게 보시면 좋을 것 같아 사용하고 있습니다. 저는 일단 모든 내용들을 다 작성하고 html 모드로 들어가 a href태그를 넣어줍니다. html을 처음 사용해 보시는 분들은 조금 헷갈릴 수 있지만 천천히 따라 하실 수 있도록 최대한 풀어서 적어봤습니다. 블로그에 목차를 달아 조금 더 편하게 이용해 보면 좋겠습니다.

 

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

1. 티스토리 블로그 내부 링크 걸기 태그

2. 티스토리 블로그 내부 링크 예제

3. 티스토리 블로그 내부 링크 연결시 팁