[목차 링크] 티스토리 내부 목차 링크 만들기 (HTML 기본 서식 파일 및 내부 링크 코드 첨부)

서식 작성 이전, 기본 셋팅에 대하여는 아래 링크를 통해 확인해볼 수 있다. 

[에드센스 도전기 01] 티스토리 블로그 시작.. : 네이버블로그 (naver.com)

[에드센스 도전기 01] 티스토리 블로그 시작에 앞서 기본 셋팅 방법

 

 

목차

---

 Ⅰ. 내부 링크를 걸 수 있는 기본 목차 서식 만들기 

1. 내부 링크 및 기본 서식의 필요성
2. HTML로 정리되어 있는 기본 서식 파일 다운 받기

Ⅱ. 서식에 내부 링크 적용하기

1. 설정  > 서식관리 > 서식쓰기 
2. HTML 모드 > HTML 코드 붙여넣기 
3. HTML 모드 > "a href" 코드 파일 다운로드, 목차 부분에 붙여넣기 
4. 포스팅 편집 중에는 링크 작동이 안되니, 포스팅 완료 후 확인해보기 

 

티스토리 내부 목차 링크 만들기

 

먼저 티스토리는 목차를 만들어 내 성향에 맞게 조절이 가능하다는 장점이 잇다. 

 

티스토리 목차는 자동으로 만드는 방법과 서식을 만들어 활용하는 방법이 있는데, 

자동 목차는 파일을 씌워 HTML 과 CSS를 편집해 만들 수 있다. 

편리하다는 장점이 있지만, 가끔 오류가 나면 전체적으로 모두 수정해야 한다는 번거로움이 있어, 

필자는 서식을 이용하여 목차를 만들고 있다. 

 

해당 서식의 전체적인 포스팅을 확인하려면 아래를 클릭하면  일목요연하게 정리되어 있다. 

 

---

Ⅰ. 내부 링크를 걸 수 있는 기본 목차 서식 만들기 

 

1.  내부 링크 및 기본 서식의 필요성

 

티스토리 블로그를 작성할 때 "H 태그" 라는 말을 많이 들었을 것 같다. 

H 태그는 다음과 같이 정리할 수 있다. 

H1 - 전체 제목 (여기서 한 포스팅에 H1이 여러번 중복되면 색인이 되지 않으니 주의 ※ )
H2 - 제목 1
H3 - 제목 2
H4 - 제목 3

 

이 부분이 정리되어 있어야, 좋은 품질의 포스팅으로 평가되기 때문에,

에드센스의 승인을 위해서라면 가희 필수적이라 할 수 있을 것 같다. 

 

티스토리 블로그에서 내부 링크를 달기 위해서는 먼저 상기 H태그의 이해를 바탕으로

직접 HTML 코드를 수정해야 가능한 부분이기 때문에, 

상당히 번거롭다. 

 

때문에, 목차와 링크를 달기 위해서는 서식이 필수적이라 할 수 있겠다. 

---

2. HTML로 정리되어 있는 기본 서식 파일 다운 받기

 

기본적인 서식 작성 방법에 관하여는 이 곳에서 말한바와 같이 정리되어 있는 포스팅을 확인하면 

쉽게 접근할 수 있다. 

 

우선 간단하게 기본적인 서식 파일을 정리해놓았다. 

 

티스토리 서식- 기본.txt

0.01MB

 

 

 

---

Ⅱ. 서식에 내부 링크 적용하기

 

1.  설정  > 서식관리 > 서식쓰기 

 

설정  > 서식관리 > 서식쓰기

 

우선 상기와 같이 서식 쓰기를 눌러주어 서식을 작성하도록 한다. 

 

---

 

2.  HTML 모드 > HTML 코드 붙여넣기 

HTML 모드 > HTML 코드 붙여넣기

 

 HTML 모드에서  HTML 코드가 적혀져 있는 텍스트 파일의 내용을  붙여넣는다.  

 이후 기본모드로 잘 적용되었는지 확인해본다. 

잘 적용된 것

상기 이미지와 같다면 잘 적용된 것이다. 

 

 

---

 

3. HTML 모드 > "a href" 코드 파일 다운로드, 목차 부분에 붙여넣기 

 

다시 HTML 모드로 가서 목차 부분을 확인해본다. 

(글씨 사이즈를 취향에 맞게 바꿀 수 있다. )

아래 네모 박스에 붙여넣을 예정이다. 

 

a href 코드.txt

0.00MB

 

 상기 첨부되어 있는 파일을 다운로드 한 뒤, 해당 부분에 적용하면 다음과 같다. 

 

해당 링크가 옮겨질 부분을 찾아

다음 첨부된 코드를 넣어준다. 

 

p id=01brP.txt

0.00MB

 

#01 = id 01이 되고, 

#02 = id 02가 되는 형태이다. 

 

원하는 부분에 삽입해주면 된다. 

 

---

 

4. 포스팅 편집 중에는 링크 작동이 안되니, 포스팅 완료 후 확인해보기 

 

말 그대로, 

포스팅 편집 중에는 링크 작동이 안되니, 포스팅 완료 후 확인할 수 있다. 

잘 작동이 되는지 확인해보면 된다. 

 

 

 

 

 

 

---

 

이외 티스토리 블로그 검색 엔진 최적화(SEO)에 관한 내용은 아래 포스팅을 통해 확인해볼 수 있다. 

[에드센스 도전기 02 ] 티스토리 블로그 검.. : 네이버블로그 (naver.com)

[에드센스 도전기 02 ] 티스토리 블로그 검색 엔진 최적화(SEO)

 

[에드센스 도전기 03 ] 티스토리 줌(Zum.. : 네이버블로그 (naver.com)

[에드센스 도전기 03 ] 티스토리 줌(Zum)엔진, 빙(Bing)엔진, 네이트(Nate)엔진 최적화(SEO)

 

 

---