jekyll tipue search

Джекилл Типу Поиск

Полнотекстовый поиск в Jekyll с помощью Tipue Search. Никакого плагина не требуется. Полностью совместим с Github Pages.

Индекс поиска по адресу tipuesearch/tipuesearch_content.js создается с помощью Liquid. Плагин Tipue Search jQuery использует Javascript для поиска по индексу и отображения списка результатов.

Посмотрите живую демонстрацию, работающую на Github Pages. Код и конфигурация демо-версии находятся в ветке gh-pages.

Установка

1. Добавьте папку assets/tipuesearch и все ее содержимое на свой сайт.

2. Добавьте скрипты и стили Tipue Search в заголовок темы. Некоторые из этих строк являются необязательными, информацию см. в документации:

 {% 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, отображение результатов и скрипт. Для справки используйте пример страницы поиска search.html . Установите tipue_search_active: true в начале каждой страницы или макета, где вы хотите отображать результаты поиска. См. документацию Tipue Search для настройки формы поиска и отображения результатов поиска:

 <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]