меню

Встроенный поиск в WordPress

В CMS WordPress существует встроенный поиск, с которым можно сделать поиск по сайту практический любого вида.

Вставка формы поиска в WordPress

Для того чтобы вставить форму поиска в вашу тему WordPress, нужно вставить следующий код в любое место:
<?php get_search_form(); ?>
Если теперь посмотреть код сайта с встроенным поиском от WordPress, то можно увидеть что этот PHP код генерирует следующий HTML код:
<form role="search" method="get" id="searchform"
class="searchform" action="https://example.com">
<div>
<label class="screen-reader-text" for="s">Найти:</label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Поиск" />
</div>
</form>

Теперь уберем отсюда все не нужное и мы получим следующий компактный HTML код (вместо action="/" можно поставитьaction="<?php echo home_url('/'); ?>" если форма не будет работать, например на мулти сайте):
<form role="search" method="get" id="searchform"
class="searchform" action="/">
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Поиск" />
</form>
Эту HTML форму можно стилизовать с помощью CSS, например так:
#searchform input {
height: 23px;
border: 1px solid #66CCFF !important;
-webkit-appearance: none;
border-radius: 3px;
}

input[type="text"]:focus { outline: none; }

#searchsubmit {
padding: 0 5px 0 5px;
background: #66CCFF;
color: white;
}

#searchsubmit:hover {
border: 1px solid red !important;
background: red;
}

Результат будет таков:
Форма поиска в WordPress

Вывод результатов поиска в WordPress

Мы создали систему поиска в WordPress, теперь если вы будете искать через этот поиск на вашем сайте, то результаты поиска будут выводится через шаблон index.php.

Что не всегда удобно!
Поэтому в WordPress можно создать специальный шаблон страницы предназначенный для вывода результатов поиска. Вот код этого шаблона:
<?php
/*
Template Name: search
*/
?>
<h1><?php echo 'Результат поиска: ' . '<span>' . get_search_query() . '</span>'; ?></h1>
<?php
if (have_posts()) :
while (have_posts()) : the_post();
?>
<div id="posts">
<h2><a href="<?php the_permalink() ?>"><?php the_title() ?></a></h2>
<p><?php the_excerpt() ?></p>
<div>Дата добавления: <?php the_date() ?></div>
</div>
<?php endwhile; ?>
<?php
else :
echo "Извините по Вашему результату ничего не найдено";
endif;
?>
Этот код будет выводить результаты поиска по сайту с ссылками на ваши страницы.

Синтаксис шаблона страницы с результатами поиска

<a href="<?php the_permalink() ?>"><?php the_title() ?></a> дает ссылку на страницу;

<?php the_title() ?> выводит название страницы;

<?php the_permalink() ?> выводит адрес страницы;

<?php the_excerpt() ?> выводит краткое описание страницы;

<?php the_date() ?> выводит дату публикации страницы.

Вам остается только поработать над дизайном и все страница готова! Ну конечно же сюда можно добавить разные вещи, например выводить миниатюру записи. За это отвечает вот такой кусок кода: <?php the_thumbnail(); ?>, но только для этого сперва добавьте всем записям и страницам миниатюры.

WordPress поиск по записям

Есть случаи когда нужно сделать поиск только по определенным типам записей. Например если нужно сделать поиск только по записям то ставим вот такую форму:

<form role="search" method="get" id="searchform"
class="searchform" action="/">
<input type="text" value="" name="s" id="s" />
<input type="hidden" value="post" name="post_type" />
<input type="submit" id="searchsubmit" value="Поиск" />
</form>

Это так называемый WordPress поиск по записям который ищет только в записях а не на страницах. Для этого мы добавили только одно поле:

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

Здесь value="post" имеет значение post, то есть запись. А если у вас есть произвольное поле book то ставите вот так:

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

Еще здесь стоит тип поля hidden, ну вы наверное знаете что это означает, это означает что поле должно быть не видимым. Если хотите чтобы было видимо то ставите вместо hidden другое значение, например text.