지킬 블로그에 검색창 달기

제가 지킬 블로그를 시작하면서 원하는 기능 중에 최근까지 구현하지 못한 것이 하나 있었습니다. 바로 검색창이었어요. 사이트 안에서 원하는 글을 빨리 찾을 수 있으면 좋겠는데, 태그만으로는 성에 차지 않았습니다. telemachus님의 블로그에 검색창이 있는 것을 확인하고 거의 그대로 가져왔습니다. 이제 검색 페이지의 검색창에서 한량넷의 글을 검색할 수 있습니다.

검색 기능을 어떻게 구현했는지는 여기에서 확인하실 수 있습니다. 저는 잘 몰라요.

제가 한 것은 다음과 같습니다.

  1. 지킬의 루트 폴더에 search2.json, Simple-Jekyll-Search.sublime-project를 넣기
  2. 지킬의 루트 폴더 아래 dest라는 폴더를 만들고 jekyll-search.js, jekyll-search.min.js 넣기
  3. 지킬의 루트 폴더 아래 _plugins라는 폴더를 만들고 simple_search_filter.rb 넣기
  4. 지킬의 루트 폴더 아래 search.html 파일 만들어 넣기
    • 위의 파일 내용에서 <div id="results"> 부터 </div>까지의 내용은 이미 쓰고 있던 tag 검색을 위한 것으로 이 글에서 이야기하는 simple-jekyll-search와는 관계가 없는 코드입니다.
  5. images/icon/폴더에 적당한 아이콘을 search.png로 저장하기
  6. 지킬의 _layout 폴더 아래 default.html 파일의 적당한 곳에 <a href="/search/"><img src="/images/icon/search.png" /></a>로 링크 넣기

이제 한량넷에서 봤는데 어딨었더라 하는 글이 있다면 가장 상단 우측의 돋보기 아이콘을 누르고 편하게 검색하세요! :)


이 글은 2016-11-18에 작성되었습니다.