Плагин статического поиска обеспечивает максимально плавный, быстрый и упрощенный поиск на вашем сайте Publii. Основанный на поисковой библиотеке FlexSearch, Static Search предоставляет мгновенные динамические результаты по любым поисковым запросам и оснащен множеством опций и настроек для точной настройки функциональности, чтобы она идеально соответствовала потребностям посетителей вашего сайта.

Включение раздела поиска

Все официальные темы Publii имеют встроенную в тему область поиска, которую необходимо включить, прежде чем плагин сможет функционировать. Чтобы включить раздел поиска:

1. В главном меню Publii на левой боковой панели нажмите на опцию Тема, чтобы открыть экран настроек.
2. Во втором разделе этого экрана, Пользовательские настройки, нажмите на вкладку Поиск в списке параметров под заголовком "Пользовательские настройки", чтобы открыть параметры поиска.
3. Нажмите на кнопку переключения рядом с параметром Поиск, чтобы включить панель поиска.
4. Теперь эта область включена в вашей теме, и вы можете перейти к включению и настройке плагина статического поиска.

Добавление поддержки плагина статического поиска в вашу тему (для старых или пользовательских тем)

Чтобы отобразить окно поиска на вашем сайте, просто добавьте следующий фрагмент кода туда, где вы хотите, чтобы он отображался. Это приведет к появлению поля ввода для поиска и кнопки, которые посетители могут использовать для поиска на вашем сайте того, что они ищут.

{{{@customSearchInput}}}

Нам также необходимо изменить файл config.json (только если ваша тема не поддерживает плагины поиска), обновив разделы "средство визуализации" и "Поддерживаемые функции" следующими флагами:

"renderer": {    
     "createSearchPage": true,
     "createContentStructure": true
 },
 "supportedFeatures": {
     "searchPage": true,
     "customSearch": true
 },

Включение плагина

Чтобы активировать плагин, откройте раздел Инструменты и плагины приложения Publii через левое меню, чтобы просмотреть список установленных плагинов. Нажмите на кнопку переключения в левом нижнем углу плитки Статический поиск в этом списке, чтобы включить плагин.

Как только плагин и область поиска в теме будут включены, функция поиска будет готова к использованию на вашем сайте, но поскольку статический поиск включает в себя ряд настроек для точной настройки функциональности поиска, рекомендуется открыть настройки плагина и убедиться, что все настроено в соответствии с вашими потребностями.

Чтобы открыть настройки плагина, нажмите на плитку Статический поиск еще раз, в любом месте, кроме кнопки переключения, и откроется экран настроек. Обратите внимание, что этот экран будет недоступен, если плагин не будет включен первым.

Параметры статического поиска

Плагин статического поиска может похвастаться несколькими опциями, которые позволяют пользователям точно указывать, как функция поиска должна работать на их сайте; при желании параметры по умолчанию обеспечат плавный поиск, поэтому изменять эти настройки совершенно необязательно. Доступные настройки следующие:

Настройка поиска

• Открывать всплывающее окно поиска при нажатии кнопки ввода поиска - Когда эта опция включена, когда посетитель нажимает на ввод поиска, немедленно открывается всплывающее окно поиска, которое обычно отображается только после запуска поиска.
• Открывать всплывающее окно поиска с помощью CSS-селектора - Когда эта опция включена, когда посетитель нажимает на любой элемент, например, стеклянную иконку или ссылку, всплывающее окно поиска будет открыто немедленно. Для этой опции требуется CSS-селектор, указанный в поле CSS selector.
• CSS selector - Добавьте сюда любой допустимый CSS-селектор для таргетинга на HTML-элемент, чтобы при нажатии на этот элемент отображалось всплывающее окно поиска. Например, если вы хотите, чтобы при нажатии на кнопку отображалось всплывающее окно, добавьте CSS-класс, называемый, например, "search-popup", к этой кнопке, например, <button class="search-popup"> Open search popup </button>.
• Кнопка отправки - Если эта опция включена, в окне поиска будет отображаться кнопка отправки; посетители могут нажать эту кнопку, чтобы начать поиск, или нажать "Ввод" как обычно.
• Минимальное количество символов для запуска поиска - этот параметр устанавливает минимальное количество символов, которые необходимо ввести при вводе данных поиска перед отображением результатов.
• Максимальное количество результатов поиска - Задает максимальное количество результатов поиска, которые могут отображаться одновременно при запуске поиска, при этом наиболее релевантные отображаются первыми.
• Показывать описание в результатах как - Выберите, отображать ли дополнительную информацию с каждым элементом, указанным в результатах поиска; доступны следующие опции:
  • Нет - В результатах будет отображаться только заголовок публикации / страницы, без какой-либо дополнительной информации.
  • Выдержка - в результатах будет отображен отрывок из содержания статьи; длина отрывка зависит от параметра Длина отрывка в разделе Настройки темы> Основные настройки приложения Publii или от того, где находится дополнительная информация о статье, если используется пользовательский отрывок.
  • Мета-описание - В результатах будет отображаться описание, взятое из мета-описаний записей.
• Заполнитель для ввода при поиске - текст, введенный в это поле, будет отображаться как заполнитель при вводе при поиске.
• Метка кнопки поиска - Текст, введенный в это поле, будет отображаться как название кнопки поиска.
• Заполнитель для ввода во всплывающем поиске - текст, введенный в это поле, будет отображаться по умолчанию во всплывающем поиске при его открытии.
• Состояние поиска пусто - Текст, введенный в это поле, будет отображаться в области результатов экрана, если посетитель не ввел ни одного символа при вводе данных поиска.
• Текст, отображаемый, когда фраза слишком короткая - Текст в этом поле будет отображаться, если посетитель не ввел необходимое количество символов для поиска, как определено в параметре Минимальное количество символов .
• Состояние "Нет результатов" - текст в этом поле будет отображаться в области результатов после запуска поиска, но совпадающих результатов по введенному поисковому запросу нет.
• Кнопка закрытия - Задает текст для кнопки, которая закрывает всплывающее окно поиска (видно только в режиме мобильного просмотра)

Настройка индекса

Раздел настройки индекса содержит наиболее важные параметры плагина статического поиска. Различные настройки в этом разделе сообщают плагину, какой контент на вашем сайте должен быть проиндексирован; то есть, какие части контента вашего сайта, такие как заголовки, выдержки, подзаголовки и т.д. ... должны собираться и храниться плагином, чтобы посетители вашего сайта могли их искать.

Примечание: Большинство пользователей могут оставить все опции в этом разделе включенными, чтобы обеспечить более широкий и точный поиск посетителей своего сайта. Однако, если индексируемый сайт содержит большое количество записей, создаваемый индексный файл может быть относительно большим; в таких случаях может быть полезно ограничить индексацию определенными элементами, чтобы уменьшить общий вес файла. Кроме того, убедитесь, что на вашем сервере активирован GZIP/Brotli; это уменьшит размер поискового индекса.

В этом разделе представлены следующие опции:

• Включить индексацию сообщений - Если включено, выбранные элементы публикации, такие как заголовок сообщения, выдержка, заголовки, будут проиндексированы для поиска.
• Исключить скрытые записи - Если включено, записи, помеченные как скрытые, не будут индексироваться плагином поиска и не будут отображаться в результатах поиска.
• Заголовок публикации - Если включен, заголовки записей будут индексироваться и использоваться при поиске.
• Выдержка - Если он включен, выдержки из сообщений будут индексироваться и использоваться при поиске. Количество индексируемого контента зависит от параметра Длина отрывка в разделе Настройки сайта> Основные настройки приложения Publii, или от того, куда было добавлено "Подробнее", если используется пользовательский отрывок.
• Заголовки (H1-H6) - Если он включен, заголовки в содержимом вашего поста будут индексироваться и использоваться при поиске.
• Имя автора - Если включено, имя автора в сообщениях будет индексироваться и использоваться при поиске; полезно, если вы хотите разрешить посетителям выполнять поиск по имени автора, не переходя на страницу, связанную с конкретным автором.
• Мета-описание - Если включено, содержимое мета-описания каждого поста будет индексироваться и использоваться при поиске.
  
  
• Включить индексацию тегов - Если включено, выбранные элементы тега, такие как название тега, описание, будут проиндексированы для поиска.
• Исключить скрытые теги - Если включено, теги, для которых установлено значение hidden, не будут индексироваться или отображаться в результатах поиска.
• Название тега - Если включено, заголовок тега будет индексироваться и использоваться при поиске.
• Описание тега - Если включено, текст описания каждого тега будет индексироваться и использоваться при поиске.
• Мета-описание - Если включено, мета-описание для каждой страницы с тегом будет проиндексировано и использовано для поиска.
  
  
• Включить индексацию Post Config: если включено, вы можете проиндексировать выбранные параметры Post Config.
• Поля для индексации: Укажите имена полей Post Config для индексации через запятую.

Дополнительные параметры

• Значение параметра Tokenise - этот параметр задает поведение процесса поиска; то есть, как он ищет слова, по которым выполняется поиск, и насколько эффективен поиск. Вообще говоря, полная настройка обеспечит наиболее эффективный поиск, но на крупных веб-сайтах могут использоваться альтернативные, более простые варианты, чтобы ограничить объем памяти, необходимый для поиска. Доступные настройки для этой опции следующие:
  • Строгий - В результатах поиска будут показаны только точные соответствия поисковому запросу.
  • Вперед - поиск слов осуществляется начиная с первой буквы в прямом порядке, что позволяет отображать частичные совпадения; незаконченные слова или слова с орфографическими ошибками в конце все равно будут отображать результаты, например, при поиске "Тестирование" ввод только "Tes" даст некоторые результаты.
  • Обратный - результат будет показан, когда буквы поискового запроса будут встречаться как в прямом, так и в обратном порядке, что обеспечивает еще большую поддержку при орфографических ошибках или неполном поиске, например, при поиске "Testing" ввод либо "Tes", либо "ing" даст некоторые результаты.
  • Полный - Сочетает в себе все вышеперечисленное, плюс частичные совпадения для средней части поискового запроса, например, при поиске "Тестирование" ввод либо "Tes", либо "ing", либо "sti", либо другие их комбинации дадут некоторые результаты.
• Charset - Задает набор символов, который плагин статического поиска должен использовать при поиске. По умолчанию эта опция будет безопасно охватывать все европейские языки, использующие латинский алфавит, включая дополнительные символы для языков с ударением на буквах.
• Язык - Задает язык, который будет использоваться при поиске похожих слов, происходящих от одного и того же базового слова, например, спряжений глагола. Использует соглашение об именовании ISO-3166 для языков. Обратите внимание, что поддерживаются не все языки.
• Включить кэш - Если он включен, плагин статического поиска будет использовать доступный кэш для хранения популярных поисковых запросов, чтобы обеспечить автозаполнение и мгновенный поиск при вводе в строке поиска. В этом разделе доступны следующие опции:
  • Отключен - результаты поиска не будут сохраняться; поиск может выполняться медленнее, чем при включенном кешировании.
  • Включено - нет ограничений по размеру - Результаты поиска будут сохранены для обеспечения динамического поиска при наборе текста и предложений по автозаполнению, если они включены.
  • Включен - с ограничением размера - Результаты поиска будут сохраняться до определенного предела; после чего будут сохранены только самые популярные запросы для обеспечения динамического поиска и предложений.
• Размер кэша - Эта опция доступна только в том случае, если для параметра Включить кэш установлено значение Включено - с ограничением размера. Число, введенное в это поле, определяет максимальное количество поисковых запросов, которое плагин должен сохранять для динамических поисков и предложений. По умолчанию это значение равно 100.
• Включить предложения - Если он включен, поиск будет предлагать посетителям предложения по автозаполнению по мере ввода текста в строке поиска на основе популярных запросов, которые были запущены ранее.
• Относительные URL-адреса - domain - Задает домен, который будет использоваться при поиске для создания соответствующих ссылок в поисковом индексе.

  Примечание: Используйте эту опцию только тогда, когда вы используете относительные URL-адреса в настройках сервера.

Настройка внешнего вида плагина статического поиска

Опытные пользователи или разработчики тем могут пожелать изменить внешний вид окна поиска плагина и всплывающей страницы поиска; информация в этом разделе поможет вам начать настраивать поиск в соответствии с эстетикой вашей темы.

Какой код генерирует окно статического поиска?

При включении плагин статического поиска генерирует "поле ввода", представляющее собой форму с областью ввода, где посетители могут ввести свой поисковый запрос, и кнопкой для отправки запроса. Эта форма добавлена на главную страницу в теме. Код, который генерируется для этого поля ввода, выглядит следующим образом:

он сгенерирует следующий результат:

<form action="#search" class="search__form">
   <input class="search__input" type="search" placeholder="Search" aria-label="Search"> 
   <button type="submit" class="search__button">
      <span>Search</span>
   </button>
</form>

Этот код может быть полезен, если вы захотите оформить окно поиска в соответствии с вашей темой.

Изменение внешнего вида результатов поиска

Результаты данного поиска отображаются в модальном всплывающем окне; используя инструмент Custom CSS , который можно найти в разделе Tools & Plugins главного меню Publii, пользователи могут изменять внешний вид всплывающего окна результатов в соответствии со своими потребностями.

Доступные переменные CSS

Ниже вы найдете список доступных переменных CSS, которые используются для оформления всплывающего окна результатов; вы можете скопировать весь блок кода в свой пользовательский инструмент CSS и внести изменения или внести изменения только в определенные переменные CSS из списка.

:root {    
    --pss-width: 672px; 
    --pss-popup-min-height: 210px; 
    --pss-popup-max-height: 576px; 
    --pss-popup-input-height: 70px; 
    --pss-border-radius: 4px; 
    --pss-spacing: 20px; 
    --pss-font-base-size: 15px; 
    --pss-font-family: inherit; 
    --pss-results-title-font-weight: 500; 
    --pss-results-excerpt-line-height: 1.2; 
    
    --pss-bg: #fff; 
    --pss-overlay: rgba(184, 186, 193, 0.9); 
    --pss-border-color: #e7e8ea; 
    --pss-color: #0079f2; 
    --pss-msg-text-color: #6A7082; 
    --pss-input-bg: #fff; 
    --pss-input-text-color: #32353e; 
    --pss-input-placeholder-color: #7f8596; 
    --pss-button-close-bg: #6A7082; 
    --pss-button-close-color: #fff; 
    --pss-results-title-color: #32353e; 
    --pss-results-title-color-hover: #fff; 
    --pss-results-excerpt-color: #6A7082; 
    --pss-results-excerpt-color-hover: #fff; 
    --pss-results-icon-color: #969faf; 
    --pss-results-icon-color-hover: #fff; 
    --pss-results-highlight-bg: #0079f2; 
  } 
    
  @media (prefers-color-scheme: dark) { 
    :root { 
      --pss-bg: #191a1f; 
      --pss-overlay: rgba(10, 10, 12, 0.8); 
      --pss-border-color: #2A2B34; 
      --pss-color: #1089ff; 
      --pss-msg-text-color: #7f8596; 
      --pss-input-bg: #191a1f; 
      --pss-input-text-color: #d9d9e0; 
      --pss-input-placeholder-color: #7f8596; 
      --pss-button-close-bg: #393A47; 
      --pss-button-close-color: #fff; 
      --pss-results-title-color: #d9d9e0; 
      --pss-results-title-color-hover: #fff; 
      --pss-results-excerpt-color: #8c8ea3; 
      --pss-results-excerpt-color-hover: #fff; 
      --pss-results-icon-color: #7f8596; 
      --pss-results-icon-color-hover: #fff; 
      --pss-results-highlight-bg: #1089ff; 
    } 
  }