jekyll tipue search

지킬 티푸 검색

Tipue 검색을 사용하여 Jekyll에서 전체 텍스트 검색을 수행합니다. 플러그인이 필요하지 않습니다. Github 페이지와 완벽하게 호환됩니다.

tipuesearch/tipuesearch_content.js 의 검색 색인은 Liquid를 사용하여 생성됩니다. Tipue 검색 jQuery 플러그인은 Javascript를 사용하여 색인을 검색하고 결과 목록을 표시합니다.

Github 페이지에서 실행되는 라이브 데모를 확인하세요. 데모의 코드와 구성은 gh-pages 분기에 있습니다.

설치

1. assets/tipuesearch 폴더와 모든 콘텐츠를 사이트에 추가하세요.

2. 테마 헤드에 Tipue 검색 스크립트 및 스타일을 추가하세요. 이 줄 중 일부는 선택 사항입니다. 자세한 내용은 문서를 참조하세요.

 {% if page.tipue_search_active or layout.tipue_search_active %}
<link rel="stylesheet" href="{{ "/assets/tipuesearch/css/normalize.css" | relative_url }}">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="{{ "/assets/tipuesearch/tipuesearch_content.js" | relative_url }}"></script>
<link rel="stylesheet" href="{{ "/assets/tipuesearch/css/tipuesearch.css" | relative_url }}">
<script src="{{ "/assets/tipuesearch/tipuesearch_set.js" | relative_url }}"></script>
<script src="{{ "/assets/tipuesearch/tipuesearch.min.js" | relative_url }}"></script>
{% endif %}

3. Tipue 검색 검색 양식, 결과 표시 및 스크립트를 사이트에 추가하세요. 참조용으로 예제 검색 페이지 search.html 을 사용하세요. 검색 결과를 표시하려는 모든 페이지 또는 레이아웃의 머리말에 tipue_search_active: true 설정하세요. 검색 양식 구성 및 검색 결과 표시에 대해서는 Tipue 검색 설명서를 참조하세요.

 <form action="{{ page.url | relative_url }}">
  <div class="tipue_search_left"><img src="{{ "/assets/tipuesearch/search.png" | relative_url }}" class="tipue_search_icon"></div>
  <div class="tipue_search_right"><input type="text" name="q" id="tipue_search_input" pattern=".{3,}" title="At least 3 characters" required></div>
  <div style="clear: both;"></div>
</form>

<div id="tipue_search_content"></div>

<script>
$(document).ready(function() {
  $('#tipue_search_input').tipuesearch();
});
</script>

용법

Tipue Search 문서를 참조하고 코드를 탐색하여 Tipue Search의 작동 방식과 이를 사이트에 가장 잘 통합하는 방법을 이해하세요.

페이지 및 컬렉션 포함

기본적으로 게시물만 검색 색인에 포함됩니다. 페이지와 컬렉션은 포함되지 않습니다.

페이지와 컬렉션을 포함하려면 _config.yml 에 다음을 추가하세요. collections 포함하려는 컬렉션 목록이 포함된 배열입니다.

 tipue_search:
  include:
    pages: true
    collections: [apples, oranges]

검색 색인에서 제외

머리말 변수를 사용하여 검색 색인에서 단일 문서를 제외합니다.

 exclude_from_search: true

_config.yml 의 설정을 사용하여 여러 파일, 태그 또는 카테고리를 제외합니다. files 제외할 파일 경로 목록이 포함된 배열입니다. tags 및 categories 제외하려는 태그 및 카테고리 목록이 포함된 배열입니다.

 tipue_search:
  exclude:
    files: [search.html, _apples/gragg.md, _oranges/valencia.md]
    tags: [tag1, tag2]
    categories: [category1, category2]