Как создать форму пользовательского поиска в WordPress

Последнее обновление Июл 12, 2021

Содержание

Вы хотите создать настраиваемую форму поиска на веб-сайте WordPress? Раньше мы создавали темы с нуля, чтобы можно было добавлять собственные стили в разделы на веб-сайте. Возможно, вы создали дизайн красивой формы поиска и теперь хотите встроить ее в WordPress.

WordPress предоставляет метод, get_search_form()который отображает форму поиска. Если вы используете этот метод в своей пользовательской теме, вы получите форму поиска по умолчанию, созданную в ядре WordPress. И вам не нужна форма поиска по умолчанию, поскольку дизайн вашей формы отличается. Чтобы преодолеть эту ситуацию, вам необходимо создать настраиваемую форму поиска, которая заменяет форму по умолчанию.

Создав настраиваемую форму поиска, вы можете добавить в нее свою разметку и стиль. В этой статье я покажу вам, как создать настраиваемую форму поиска в WordPress.

Метод get_search_form()ищет searchform.phpфайл в каталоге вашей активной темы. Если этот файл не существует, WordPress использует форму поиска по умолчанию, которая включена в его ядро.

Создать форму пользовательского поиска

Создайте searchform.phpфайл в каталоге вашей активной темы. В этом файле добавьте свою разметку формы поиска. Например, в моем случае форма поиска выглядит следующим образом.

<form id="searchform" method="get" action="<?php echo esc_url( home_url( '/') ); ?>">
    <input type="text" class="search-field" name="s" placeholder="Search" value="<?php echo get_search_query(); ?>">
    <input type="submit" value="Search">
</form>

В приведенном выше коде нет ничего необычного или сложного. Я только что дал id ‘searchform’ тегу формы и class ‘search-field’ в текстовое поле поиска. Используя этот идентификатор и класс, я могу добавить стиль в форму поиска. Как и в вашем случае, вы должны использовать собственную разметку.

Показать поисковую форму

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

С помощью функции get_search_form()можно отобразить форму поиска в любом месте на сайте. Все, что вам нужно сделать, это вызвать этот метод из того места, где вы хотите отобразить форму поиска.

<?php get_search_form(); ?>

После размещения вышеуказанного кода в желаемом месте перейдите в браузер. Теперь вы должны увидеть форму поиска на веб-сайте.

Настроить результат поиска

Возможно, на вашем веб-сайте больше ресурсов, таких как книги, журналы, электронные книги, PDF-файлы и т.д., И вам нужно отображать контент из всех этих ресурсов в результатах поиска. Это легко сделать.

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

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

<form id="searchform" method="get" action="<?php echo esc_url( home_url( '/') ); ?>">
    <input type="text" class="search-field" name="s" placeholder="Search" value="<?php echo get_search_query(); ?>">
    <input type="hidden" name="post_type[]" value="book" />
    <input type="hidden" name="post_type[]" value="magazine" />
    <input type="hidden" name="post_type[]" value="ebook" />
    <input type="hidden" name="post_type[]" value="pdf" />
    <input type="submit" value="Search">
</form>

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

Надеюсь, вы понимаете, как создать собственную форму поиска в WordPress. Я хотел бы услышать ваши мысли и предложения в разделе комментариев ниже.

Статьи по Теме

Источник записи: artisansweb.net