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

Как добавить поиск в любом месте темы WordPress

Приклад
  • 2024-03-29
  • 14341 переглядів

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

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

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

Строка поиска

В этом вопросе нам поможет стандартная функция WordPress - get_search_form();. Ее можно подключить в любом месте темы. Если это нужно сделать там, где код HTML, то нужно заключить функцию в PHP теги.

<?php get_search_form(); ?>

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

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

<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e('Что будем искать?'); ?>" />
<input type="submit" class="sim" name="submit"  value="<?php esc_attr_e('Поиск'); ?>" />
</form>

Если у Вас был такой файл, то в нем будет похожий код. По коду видно, что это форма с двумя элементами - input. В моем коде во второй строке - это строка поиска и в конце текст, который будет выводится внутри по умолчанию - Что будем искать?. Можете поменять на - Поиск, или что ищем, ну и тд.

В строке номер три находится элемент input - это кнопка поиск. В конце как и в строке - текст на кнопке. Можете его поменять или удалить, если захотите вместо кнопки установить какую-то картинку.

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

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

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

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

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

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