jekyll tipue search

Pesquisa Jekyll Tipue

Pesquisa de texto completo no Jekyll com Tipue Search. Nenhum plugin é necessário. Totalmente compatível com páginas do Github.

O índice de pesquisa em tipuesearch/tipuesearch_content.js é gerado com Liquid. O plugin Tipue Search jQuery usa Javascript para pesquisar o índice e exibir uma lista de resultados.

Veja uma demonstração ao vivo em execução nas páginas do Github. O código e a configuração da demonstração estão no branch gh-pages.

Instalação

1. Adicione a pasta assets/tipuesearch e todo o conteúdo ao seu site.

2. Adicione os scripts e estilos do Tipue Search ao cabeçalho do seu tema. Algumas dessas linhas são opcionais, consulte a documentação para obter informações:

 {% 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. Adicione o formulário de pesquisa Tipue Search, exibição de resultados e script ao seu site. Use a página de pesquisa de exemplo search.html para referência. Defina tipue_search_active: true no início de cada página ou layout onde você deseja exibir os resultados da pesquisa. Consulte a documentação do Tipue Search para configuração do formulário de pesquisa e exibição dos resultados da pesquisa:

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

Uso

Consulte a documentação do Tipue Search e navegue no código para entender como o Tipue Search funciona e como integrá-lo melhor ao seu site.

Incluindo páginas e coleções

Por padrão, apenas as postagens são incluídas no índice de pesquisa. Páginas e coleções não estão incluídas.

Adicione o seguinte a _config.yml para incluir páginas e coleções. collections é uma matriz contendo uma lista de coleções que você deseja incluir.

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

Excluindo do índice de pesquisa

Exclua documentos únicos do índice de pesquisa com uma variável inicial:

 exclude_from_search: true

Exclua vários arquivos, tags ou categorias usando uma configuração em _config.yml . files é uma matriz contendo uma lista de caminhos de arquivos a serem excluídos. tags e categories são matrizes contendo listas de tags e categorias que você deseja excluir.

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