어쩐지 요즘 블로그에 손을 많이 대고 있는 것 같은 느낌이다.

Bigfoot은 jQuery를 이용한 각주 플러그인이다. 사용성도 훨씬 좋고 보기도 훨씬 예쁘다.

단점은 역시 셋업하는데 시간이 오래 걸린다는 것…

초보인 내가 설치하기에는 많은 어려움이 따랐다. 그중에 가장 큰 이유는 사이트가 만들어지는 형식이 자유롭기 때문이다. 그러니까 모든 사람들의 사이트 구조가 동일하지 않기 때문에 다른 사람이 설치한 것을 보고 그대로 따라하다가는 중간에 오류가 발생하기 쉽상이다. 나 또한 그랬다.

- Gisadan 블로그, Bigfoot(빅풋) 설치하는 법

십상을 쉽상이라고 적으신 건 역시 열받으셨다는 흔ㅈ…

이론적으로는 1. bigfoot.js 파일과 bigfoot.min.js 파일을 자바스크립트 파일있는 곳에 위치시켜주고 2. main.html 파일 헤더 부분에 스크립트 삽입 코드만 작성해주면 될… 것이었다.

###문제

1. 내 블로그는 기존에 js 파일을 쓰고 있지 않았다. 고로 js 파일이 위치할 js 디렉터리조차 없는 상황. 2. 내 블로그에는 main.html 파일 자체가 없었다…

해결

1. 마찬가지로 js 디렉터리가 없는 경우 그냥 최상위 경로에 js 폴더를 만들고 그 안에 파일을 넣어주면 된다고 한다. 1 2. 내 경우 블로그의 기본 골격을 결정해주는 head.html 파일에 집어넣었다. 사실 어느 .html 파일에 넣어도 될 것 같지만 가능하면 모든 페이지에 들어가는 파일을 찾아서 넣는 게 좋을 것 같다. 2


여기서 끝났으면 좋았을텐데 저렇게 하고 나니까 동그라미 세 개 크기가 포스트 너비만큼 현출이 되는 사태가 발생했다… bigfoot이 jQuery 3.0 이상에서는 오류를 내뿜는다는 글이 있어서3 버전 문제인 줄 알고 2.2.4로 낮추었지만 그러고도 문제는 해결되지 않았다.

요소 너비가 설정이 안 되는 문제였으니 .css 파일이 정상적으로 import되지 않는 문제라고 보고 head.html 파일4에서 강제로 bigfoot-number.css파일을 불러오는 코드를 삽입했다.

<link rel="stylesheet" href="https://canorus.github.io//public/css/bigfoot-number.css">

원래는 bigfoot-default.css여야 하지만 나는 bigfoot-number 스크립트를 썼기 때문에 적절히 맞춰서 이름을 변경해주어야 한다.

그러고나니 이제 정상적으로 나타난다.


결론은 Github으로 블로그하려면 어느 정도 코딩 실력이 있거나 시간을 왕창 투자하게 된다는 것이다. 물론 본인은 후자다.

  1. Bigfoot footnote in Jekyll 

  2. 무슨 about.md 같은 파일에만 안 넣으면 될 것 같기는 하다… 

  3. 사실 이건 jQuery 3.0 이상에서 max-width가 너무 작게 설정된다는 이야기였다… 내 문제랑은 아예 상관없는 이야기 

  4. 원래였다면 main.html이 되었을 그 파일