Расширенный поиск по сайту

Поиск по сайту, который встроен в движок WordPress, впрочем, как и в большинстве других движков, весьма неплохо выполняет свою задачу. Ищет и находит всё, что ему положено и, казалось бы, что ещё желать?

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

Например, если Вы забыли переключить раскладку клавиатуры с английской на русскую и набрали в поисковом поле  вместо слова «кухня» слово «re[yz», то стандартный поиск WordPress и будет искать этот непонятный набор символов. Естественно, что ничего не найдёт, хотя по слову «кухня» у Вас в выдачу могло бы попасть множество материалов.

Или просто допустили опечатку и, вместо «мама» набрали «мпма», то, как и в первом случае, ничего найдено не будет.

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

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

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

Расширять возможности поиска мы будем при помощи сервиса Яндекс.

Кликните по картинке, чтобы увидеть её в нормальном масштабе и посмотреть хотя-бы тот минимум, который Ва получите воспользовавшись этим сервисом. Впечатляет, правда?

На самом деле возможностей и настроек там гораздо больше - это и настройка синонимов для поиска, и поисковые подсказки и прочее, и прочее, и прочее... Но нет смысла тут перечислять и расписывать их все - Яндекс объясняет очень подробно и доступно. А мы с Вами давайте начнём уже реализовывать этот замечательный функционал.

Делать будем все применительно к WordPress, но в принципе это можно реализовать на любом сайте.

Итак, что нам для этого понадобится?

• Аккаунт в Яндекс. У большинства он уже есть, если нет - регистрируйтесь, это не сложно, но полезно.
• FTP-клиент. Я пользуюсь FileZilla, но кому, как удобнее. Кто-то может быть предпочитает TotalCommander - без разницы.
• Текстовый редактор. Настоятельно рекомендую Notepad++, но и здесь дело личных предпочтений.

Вот, пожалуй, и всё. Приступаем.

Шаг № 1. Определяемся с тем, что-же нам на самом деле надо

Это очень важный момент, так-как от него и будут зависеть наши дальнейшие действия. Дело в том, что реализация такого расширенного поиска многовариантна. Например, можно вывести результаты поиска на отдельной странице Яндекс, а можно на странице своего блога. Можно дать пользователю выбор искать-ли только по блогу, либо вообще прошерстить Интернет. И это как минимум, что надо для себя решить в самом начале. Ну, и еще можно подумать над тем, будем ли мы менять стандартную форму поиска WordPress на ну, которую создадим с помощью сервиса от Яндекс.

У меня есть три различных реализации:

Первый, очень старый, делал несколько лет назад... Форма поиска своя, в случае неудачи показывается расширенная форма с возможностью выбора области поиска (сайт/интернет). Результаты выводятся на странице Яндекс. Можно посмотреть по этой ссылке.

Второй, на этом самом блоге. Делал по мотивам своей-же статьи Страница 404 и страница текст не найден. Форма поиска стандартная от WordPress, в случае неудачи выводится специальная страница, где уже присутствует расширенная форма. Так-же имеется выбор области поиска (сайт/интернет), но результат выводится прямо на блоге. Это очень удобно, так-как при любом раскладе посетитель не покидает блог. И время его тут пребывания заметно увеличивается, что для блога очень полезно. Попробуйте набрать какую-нибудь несуразицу в поисковой форме - увидите всё воочию.

Надо будет наверное и первый вариант сделать по этому-же принципу. Видимо в те года мозгов не хватило на это. Хотя, ситуации могут быть всякие...

И, наконец, третий вариант, стандартная форма поиска заменена на форму от Яндекс, выбора области поиска нет, но поиск ведется не только по блогу, но и ещё по двум сайтам, ради продвижения которых, собственно, блог и создавался. Результат поиска выводится на блоге. Можете сами попробовать что-нибудь там поискать. Как вариант наберите слово «торт». Ну, или что угодно.

Шаг № 2. Создаём форму

Заходим на http://site.yandex.ru/

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

Все изображение увеличиваются по клику на них. Описание рядом.

Попадаем на страницу область поиска:

	Техническое название - произвольно, главное, чтобы было понятно Вам. Название поиска для стандарта Opensearch - адрес моего блога для которого делался этот поиск info.ddw.kz, ну я так и написал. На скриншоте видно... Семейный фильтр - не трогал. Оставил по умолчанию. Из описания понятно для чего он нужен.
	Тут можно просто добавить адреса сайтов, на которых будет осуществляться поиск. В моём случае все нужные сайты находятся на одном домене, в корне и субдоменах, поэтому я просто указал свой домен. Но в исключения добавил вот этот самый блог, так-как он личный и не подходит под тематику блога, для которого создавался поиск.
	Каталоги Яндекс я не добавлял, Вы смотрите сами, по необходимости. Внизу надо выбрать свой почтовый адрес...
Жмём кнопку Далее и переходим к оформлению формы поиска.
	Дизайном формы рулите по своему усмотрению. Настраивается практически всё. Здесь-же можно выставить галочку «Выбор области поиска...» и тогда Ваша форма предоставит возможность пользователю искать либо по сайту, либо по Интернет
Сохраняем форму и переходим к настройке результатов поиска.
	Если Вы выбираете вариант показа результатов на Яндексе, то тогда всё проще и следующий шаг можно пропустить. Но, на мой взгляд, намного эффективнее, когда результаты выводятся непосредственно на странице блога.
Здесь-же, щелкая по вкладкам, можно настроить и вид вывода результатов, и порядок их сортировки, и многое другое. Я ничего не менял. Предварительная подготовка страницы вывода результатов поиска
	Есть несколько способов создать такую страницу, но я просто создал пустую страницу, с соответствующим заголовком и её ссылку (смотрите скриншот) разместил в Яндекс. Есть нюанс: эту страницу необходимо исключить из навигации блога.
Делается это при помощи плагина Exclude Pages from Navigation, этот замечательный плагин должен быть установлен на каждом уважающем себя (и посетителей!) блоге. В окне редактирования страницы просто снимаем галку...

На этом предварительная подготовка страницы показа результатов поиска завершена. Я говорю «предварительная» потому, что мы ещё вернёмся к этой странице и внесём некоторые изменения. Но пока мы к ним ещё не готовы.

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

Проверка поиска

Это следующая страница, которую нам предлагает Яндекс. Здесь все просто и понятно. Наша поисковая форма, вводим запрос и получаем результат. Правда, ещё пока не на нашей странице. Но это-же просто тест. Убеждаемся в работоспособности поиска и идём дальше.

Код для вставки на сайт

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

В настройках, доступных на этой странице, я не менял ровным счётом ничего. Просто копировал оттуда код.

На этом настройку сервиса Яндекс мы закончили и теперь переходим к заключительным действиям - настройке своего блога.

Помните в самом начале статьи я говорил про FTP-клиент и текстовый редактор? Ну так сейчас самое время для них.

Все файлы, которые будем изменять находятся в папке вашей темы!

http://Ваш-сайт/wp-content/themes/Ваша-тема/

Шаг № 3. Вставляем форму

В рассматриваемом варианте я менял стандартную форму поиска WordPress на ту, которую создал в Яндекс.

У меня форма расположена в хидере, поэтому открываем файл header.php. Если у Вас форма где-то в сайд баре, то открывать нужно соответствующий sidebar.php.

Ищем код, отвечающий за вывод формы поиска. Надо понимать, что разные шаблоны могут использовать разные коды и если у Вас он не такой, как у меня, то ничего страшного - он всё-равно там есть! Просто вдумчиво рассмотрите файл и по смыслу найдёте нужное место.

Так, например, на вот этом блоге используется стандартный код движка WordPress:

<?php get_search_form(); ?>

А вот на блоге, пример которого мы рассматриваем, было сделано по иному:

Как видим, тут просто был код формы вместо функции её вызова. Но, что в первом случае, что во втором, что у Вас в шаблоне с вероятностью в 99.9% будет присутствовать некое ключевое слово, по которому легко найти этот код в любых вариантах. Это - search. Присмотритесь еще раз внимательнее и Вы в этом убедитесь сами.

Блок, в который код заключён оставляем - он отвечает за общее форматирование вывода, а код меняем.

У меня в результате получилось:

Строчка там длиннее - не стал всю её показывать. Тут главное принцип. Вместо того, что подсвечено жёлтым на предыдущем скриншоте, вставляем код формы Яндекс (Первый код) и получаем то, что на последнем скриншоте подсвечено зеленоватым цветом.

Естественно, Вам нужно заменить свой соответствующий код.

Сохраняем, закачиваем на сервер и переходим к последнему шагу...

Шаг № 4. Завершаем подготовку страницы показа результатов поиска

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

Не пугайтесь, на самом деле это совсем не сложно.

Шаблон будем делать на основе файла page.php. Скачиваем его к себе на компьютер и переименовываем, например, в my-result.php, или как Вам нравится. Мне вот такое имя пришло в голову...

Давайте немного отвлечёмся...

Как уже сто раз говорилось - у каждого шаблона файлы могут быть разные, с одной стороны это так. Но на самом деле они все одинаковые. Потому, что, несмотря на возможную разницу в коде у них единая структура!

Постараюсь пояснить. Вот структура - основа:

• Загрузить хидер
• Загрузить левый сайдбар, если есть
• Загрузить возможно ещё что-то
• Загрузить контент
• Загрузить правый сайдбар, если есть
• Загрузить возможно ещё что-то
• Загрузить футер

Каким кодом это реализовано - это уже не важно.  Даже без знания PHP, представляя структуру, можно вычленить блок контента. Зачастую, в сокращённом варианте, он может выглядеть так:

<?php get_header(); ?>
<div id="contentwrap">
    <?php get_sidebars('left'); ?>
    <div>
        <div id="content">    
            Здесь какой-то код...
        </div>
    </div>
<?php get_sidebars('right'); ?>
</div>
<?php get_footer(); ?>

Мы, по своей задаче, должны заменить содержимое блока, в котором выводится контент, тем вторым кодом, предоставленного нам Яндексом. Заметьте, не блок, а его содержимое...

Думаю, что по аналогии, и зная структуру, Вы легко найдёте это место у себя...

Вставляем второй код.

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

Метка выглядит так:

<?php
/*
Template Name: My Result
*/
?>

Обратите внимание на название шаблона. желательно его делать сопоставимым с названием самого файла, что-бы потом не запутаться.

В итоге шаблон, файл my-result.php у меня получился вот такой:

<?php
/*
Template Name: My Result
*/
?>
<?php get_header(); ?>

<div id="container">
        
    <div id="content">
       <!-- Здесь код поискового сервиса (Второй код) -->
    </div><!--end #content-->

</div> <!--end #container-->
<div style="display:none"><a href="http://morestyle.ru/" title="Wordpress Themes">wordpress themes</a>.</div>
<?php get_sidebar(); ?>

<?php get_footer(); ?>

У Вас может и отличаться… Сохраняем и заливаем на сервер в папку темы. И остался самый последний штрих — указать нашей странице результатов, что ей нужно использовать вот этот самый шаблон. Для этого открываем нашу подготовленную страницу на редактирование и указываем наш новый шаблон.

Страница по-прежнему остаётся пустой! Все настройки для неё мы сделали в шаблоне. Обновляем страницу.

И с этого момента мы получаем шикарный поиск на своём блоге.

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

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

На этом всё.

Удачи Вам и до встречи на моём блоге!

Материалы по теме:

Как привлечь посетителей на сайт бесплатно

Оптимизация сайта с помощью сервиса PageSpeed Insights

Как закрыть внешние ссылки правильно

OptiPic – сервис эффективного сжатия изображений на сайте

Как я менял шаблон или мистика WordPress

Буквица в статьях WordPress без плагина