Функция get_search_form() в WordPress. Примеры и советы.

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

get_search_form( $args );

Параметры

• $args(bool|array) (необязательный)*: Аргументы для управления выводом формы. В версиях до 5.2 параметр был логическим и назывался $echo. Начиная с версии 5.2 параметр превратился в массив аргументов.
  • echo (bool): Определяет, нужно ли выводить HTML-код формы сразу. По умолчанию true.
  • aria_label (string): Значение атрибута aria-label для формы. Полезно для различения нескольких форм на одной странице. По умолчанию пустая строка.

Возвращаемое значение

Функция возвращает строку с HTML-кодом формы поиска, если параметр $echo установлен в false. В противном случае, функция выводит HTML-код напрямую.

Безопасность

Важно помнить о безопасности при работе с пользовательскими вводами. Например, пользователь может ввести вредоносный скрипт <script>alert('JS CODE');</script>. Если не обработать строку запроса правильно, такой скрипт может быть выполнен браузером, что приведет к XSS атаке и потенциальному взлому вашего сайта.

Для безопасного вывода запроса поиска используйте функцию get_search_query(), которая защитит вас от XSS атак:

<?php echo get_search_query(); ?>

Вы также можете дополнительно очистить выводимые данные с помощью функций esc_attr() и esc_html().

Хуки из функции

Функция get_search_form() предоставляет несколько хуков, которые позволяют изменять или дополнять функциональность формы поиска:

• pre_get_search_form
• search_form_args
• search_form_format
• get_search_form

Пример 1: Вывод формы поиска через файл searchform.php

Создайте файл searchform.php в папке вашей темы и добавьте следующий код:

<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
    <label>
        <span class="screen-reader-text"><?php _x( 'Search for:', 'label' ); ?></span>
        <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search …', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" />
    </label>
    <button type="submit" class="search-submit"><?php echo esc_html_x( 'Search', 'submit button' ); ?></button>
</form>

Затем в любом месте вашего шаблона вызовите функцию get_search_form():

<?php get_search_form(); ?>

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

Пример 2: Изменение HTML кода формы через хук

Вы можете изменить HTML код формы, не создавая файл searchform.php, используя хук get_search_form. Добавьте следующий код в файл functions.php вашей темы:

add_filter( 'get_search_form', 'genius_search_form' );
function genius_search_form( $form ) {
    $form = '
    <form role="search" method="get" id="searchform" action="' . home_url( '/' ) . '" >
        <label class="screen-reader-text" for="s">Что будем искать?</label>
        <input type="text" value="' . get_search_query() . '" name="s" id="s" />
        <input type="submit" id="searchsubmit" value="Найти" />
    </form>';
    return $form;
}

Пример 3: Фильтр результатов поиска

Для фильтрации поиска по типу записи добавьте скрытое поле post_type в форму. (Очень часто, добавив кастомный тип поста, например «книги», есть необходимость добавить форму поиска только по книгам):

<input type="hidden" value="book" name="post_type" />

Теперь форма будет искать только записи типа book. Вы также можете использовать событие pre_get_posts для более сложной фильтрации результатов поиска. По умолчанию WordPress будет искать и в постах и на страницах (это 2 разных типа постов, post и page).

Пример 4: Вывод формы поиска по умолчанию

Если в вашей теме нет файла searchform.php, вызов функции get_search_form() выведет стандартный HTML-код формы поиска:

<form role="search" method="get" id="searchform" class="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
    <div>
        <label class="screen-reader-text" for="s"><?php _x( 'Search for:', 'label' ); ?></label>
        <input type="text" value="<?php echo get_search_query(); ?>" name="s" id="s" />
        <input type="submit" id="searchsubmit" value="<?php echo esc_attr_x( 'Search', 'submit button' ); ?>" />
    </div>
</form>

При включенной поддержке HTML5 в вашей теме через функцию add_theme_support( 'html5', array( 'search-form' ) ); код формы изменится на:

<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
    <label>
        <span class="screen-reader-text"><?php echo _x( 'Search for:', 'label' ); ?></span>
        <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search …', 'placeholder' ); ?>" value="<?php echo get_search_query(); ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ); ?>" />
    </label>
    <input type="submit" class="search-submit" value="<?php echo esc_attr_x( 'Search', 'submit button' ); ?>" />
</form>

Тип поля изменится с text на search, что более предпочтительно для HTML5 форм.

Заключение

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