Как добавить поиск в меню сайта

30.12.2018 0 Автор Редакция

Как добавить поиск (search) в меню сайта. Меню сайта настраивается в Консоль - Внешний вид - Меню. Вы называете меню так, как вам удобно и выбираете, что оно будет отображать - страницы сайта, рубрики, произвольные ссылки - все, что угодно. Можно сделать несколько видов меню, а затем выбирать его в качестве главного меню, которое будет отображаться под шапкой сайта, как чаще всего задано темой сайта. Не все темы WordPress дают возможность вставить в него строку поиска. Чаще поиск располагается в области виждетов справа или слева от основной колонки.

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

Для того, чтобы вставить поиск в главное меню существует два способа:

  • С помощью кода
  • С помощью плагинов WordPress

Первый способ вставки поиска осуществляется максимально просто, через Редактор файлов. Консоль - Внешний вид - Редактор. Выбираем справа в списке файлов - файл Функции темы (function.php) и вставляем код вывода поиска в файл. Исходный код вывода формы поиска:

add_filter('wp_nav_menu_items','add_search_box', 10, 2);

function add_search_box($items, $args) {

ob_start();

get_search_form();

$searchform = ob_get_contents();

ob_end_clean();

$items .= '<li class = "my_search">' . $searchform . '</li>';

return $items;

}

Скопировав данный код, вставляйте его в файл Функции темы. Можно прямо на вторую строчку, после открытия тега <?php, который поможет интерпретатору php обработать код.

форма поиска в меню код

Сохраняйте/Обновляйте файл и смотрите на результат.


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

  • Плагин Ajax Search Lite (бесплатная версия плагина Ajax Search PRO) - один из мощных плагинов поиска, после интуитивно понятных настроек (огромный выбор внешнего вида и функционала) генерирует короткий код поиска shortcode и короткий код поиска для шаблонов <?php, который можно вставить куда угодно в любом месте страницы. Также вставляется, как виджет. Однако, вставить его в главное меню - задача не из легких, поэтому пока отбросим его. Поскольку тема статьи не поиск, а вставка его формы в главное меню. А сам плагин - великолепный.
  • Плагин - Ivory Search (рассмотрен, как пример, ниже):

Скачайте  и  активируйте плагин Ivory Search. Перейдите к настройкам.

Консоль - Ivory Search - Menu Search - Select Menu - включите ползунок у Главного меню - Сохраните изменения. 

Обновляйтесь и смотрите на результат в меню сайта.

форма поиска в меню

 

Лично мне больше подходит вставка кода в файл Функции темы. Лишними плагинами мусорить консоль неохота, к тому же за ними необходимо приглядывать, чтобы они были совместимы с обновлениями темы и версиями WordPress. Меня пока устраивает стандартный встроенный поиск WordPress, который хорошо справляется со своим функционалом. Возможно, в дальнейшем мне потребуется что-то большее.