X
  • Дизайн та розробка сайту
  • Дизайн і створення сайтів. Розробка тем для WordPress. Створення Landing Page.
  • office@gnatkovsky.com.ua
  • @vgnat
  • Написати мені
Замовити послугу

Функция get_search_query() результат поиска в WordPress

Приклад
  • 2024-04-19
  • 4154 переглядів

  • Дизайн та розробка сайту

Доброго времени суток. 🙂

Хочу написать небольшую статью про маленькую функцию, которая выводит то что Вы набрали в строке поиска, на странице поиска. Когда я создавал курс по создании темы WordPress, я уже писал как осуществить такой вывод. Но все же, хочу сделать отдельной статьей, чтобы Вы могли увидеть и в случаи надобности использовать у себя на сайте.

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

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

Посетителям, в некотором даже смысле будет приятно видеть такое. Потому, что они будут знать, что они видят результаты того что они ищут, а не просто какие-то странные записи. Чтобы добавить на свой сайт такой элемент, Вам нужно чтобы у Вас был файл search.php. Он по содержанию такой же как category.php или index.php. WordPress, может отлично работать и без этого файла, но лично я его создаю в своих темах и добавляю тот элемент, о котором мы говорим.

В общем, открываем search.php и над выводом цикла, который начинается примерно так - if (have_posts(), добавляем вызов функции get_search_query(). Перед вызовом можно добавить текст и все это заключить в теги и присвоить класс, чтобы добавить стилей и задать внешний вид. Код получится следующего вида:

<span class="top_text">Результаты поиска: <strong><? echo get_search_query();?></strong></span>

Вывод слова или фразы, которую Вы ввели в строку поиска, уже будет осуществляться, в заданном Вами месте. Как я писал и видно по коду, мы присвоили класс нашему элементу - top_text. Теперь добавим ему стили, как пример я покажу свои. Вы можете конечно же изменять под себя.

Открываем файл стилей - style.css и добавляем в него вот такие строки.

.top_text{
	padding:10px 0;
	font-size:13px;
	color:#888;
	margin-bottom:20px;
	border-bottom:1px solid #eee;
}

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

На этом все, спасибо за внимание. 🙂

Якщо Вам була корисна моя праця, можете фінансово підтримати сайт або відключити блокувальник реклами, що займе 2 хвилини :)

Хочу підтримати фінансово Хочу відключити блокувальник

Оцініть статтю
  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
Проголосовало: 3, в среднем: 5 из 5
Читайте також