hugo search fuse js

Живой поиск Hugo с использованием Fuse.js и Mark.js

Это не отдельная тема. Это компонент темы Hugo.

Чтобы использовать этот компонент,

1. Добавьте это в файл конфигурации TOML вашего сайта:

   [ module ]
     [[ module . imports ]]
       path = " github.com/kaushalmodi/hugo-search-fuse-js "

2. Запустите hugo mod tidy в основном каталоге вашего сайта. Репозиторий основного сайта также должен быть модулем Hugo (у него должен быть собственный go.mod ). Чтобы сделать это, запуститеhugo hugo mod init <your site url or any unique string> в репозитории вашего сайта, прежде чем выполнять этот шаг.

3. Создайте content/search.md с параметром layout , установленным на «поиск», и параметром output , установленным на ["html", "json"] . Содержимое или тело этого search.md не используется шаблоном search.html , который является частью этого компонента темы.

   Вот пример search.md :

    +++
   title = " Search "
   layout = " search "
   outputs = [ " html " , " json " ]
   [ sitemap ]
     priority = 0.1
   +++

Требования

Вам необходимо установить последнюю версию Go с https://go.dev/doc/install, поскольку для работы этого компонента темы требуются hugo mod ..

Это обновление при переходе на использование модулей Hugo последний раз тестировалось с Hugo v0.92.0.

1. Ваша основная тема должна быть структурирована с использованием базового шаблона и блоков.
2. base шаблон должен определить блоки main и footer (показаны в предыдущей ссылке).

Если основная тема не соответствует этим требованиям, вам нужно будет отредактировать часть search.html , чтобы поиск работал. Вы можете найти его в layouts/_default/search.html этого компонента.

Что делать, если в основной теме нет baseof.html ?

У вас есть два варианта:

1. Отредактируйте search.html , чтобы он соответствовал вашей теме.
2. Обновите тему, чтобы использовать новый подход «базовый шаблон и блоки».

Что делать, если основная тема имеет baseof.html , но не имеет main блока и/или footer ?

Добавить эти блоки очень легко, не нарушая существующую тему.

Чтобы добавить main блок, добавьте его в свой baseof.html в соответствующем месте:

 {{ block "main" . }}{{ end }}

Аналогично добавьте следующее, если блок footer отсутствует:

 {{ block "footer" . }}{{ end }}

Пример см. в фрагменте baseof.html в документации Hugo.

Кредиты

• Функциональность поиска с помощью предохранитель.js.
• Подсветка ключевых слов с помощью mark.js.
• Первоначальная реализация Hugo от @eddiewebb в этой сути.
• Упаковка компонентов темы Hugo от @kaushalmodi.
• Удаление jQuery и интеграция полифилов IE с помощью @lpar.
• Полифиллы совместимости IE:
  • Обещания
  • Принести
  • URLSearchParams
  • API шаблонов и фрагментов
  • Узел.удалить