[How To] Jekyll post에 TOC 적용하기

• TOC

  toc는 table of contents의 줄임말으로 해당 post의 목차를 보여준다고 생각하면 된다.

  바로 위에 있는 목차가 바로 이 post의 toc이다.

  toc를 설정함으로써 이 post를 보는 사람에게 전체적인 정보를 미리 제공할 수 도 있고 해당 목차로 바로 이동 할 수 도 있다.

• TOC 설정

  설정 방법은 생각보다 아주 간단한다. 해당 post의 front matter에 이 부분만 추가해주면 된다.

  toc: true
  

  post width 설정에 따라 다를텐데 default 일 경우 toc가 오른쪽 사이드에 나타날 것이다.

  이 blog 같은 경우는 post width를 wide로 설정해두어 위에 나타난다.

  
  

  toc_sticky: true
  

  이 설정을 추가하면 toc가 스크롤바를 따라 내려오지 않고 고정된다. post width가 wide 일때는 따로 stickt 설정을 안해주어도

  알아서 맨 위에 고정되는 것 같다 !

  
  

  toc_label: "넣고 싶은 내용"
  

  이 설정은 toc의 이름을 바꿔준다. default 값은 on this page 이다. 이 post 같은 경우 목차로 바꾸어 두었다.

• TOC 범위 설정

  toc는 앞서 말했듯이 해당 post의 목차를 가져온다고 했다. 바로 H1 ~ H6 태그를 읽어와서 만들어 주는 것이다.

  _layouts/single.html 파일에서 범위를 수정할 수 있다. toc 클래스를 찾아가면 h_min, h_max 값이 있을 것 이다.

  이 값을 본인이 원하는 범위에 맞게 수정해주면 된다.