Как добавить панель поиска на сайт WordPress

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

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

Зачем добавлять панель поиска на свой сайт?

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

Позвольте мне представить некоторые из основных преимуществ, которые вы можете получить, добавив панель поиска на свой сайт ниже:

• Облегчает усилия ваших клиентов по поиску информации
• Упрощает взаимодействие с пользователем
• Повышает вовлеченность
• Снижает показатель отказов
• Отображает необходимые элементы или информацию с помощью нескольких ключевых слов, сокращая усилия

Добавление панели поиска в меню с помощью виджета поиска WordPress по умолчанию:

Можете ли вы добавить панель поиска в меню с виджетом поиска WordPress по умолчанию? Нет, ты не можешь. Потому что WordPress позволяет добавлять панель поиска только в области, готовые для виджетов.

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

Вот почему в этом уроке я расскажу вам о 3 различных методах добавления панели поиска на ваш сайт WordPress.

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

Добавьте панель поиска с виджетом поиска WordPress по умолчанию:

Самый простой и удобный способ внедрить панель поиска на ваш сайт — через панель управления WordPress. Как это сделать? Давай проверим-

Перейдите к виджетам из панели инструментов:

Для начала перейдите в панель управления вашей админ-панели и найдите Внешний вид. Перейдите и нажмите «Виджеты» в списке элементов в разделе «Внешний вид».

Панель управления > Внешний вид > Виджеты

Добавьте виджет поиска из доступных виджетов:

Это приведет вас к новой странице с различными разделами страницы. Теперь нажмите кнопку «Добавить блок» (отображается со знаком +), чтобы просмотреть все существующие виджеты.

Прокрутите вниз, чтобы найти виджет поиска, или вы можете написать «Поиск» в поле поиска, чтобы найти виджет поиска.

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

Сделайте необходимые настройки:

Панель поиска теперь появится под выбранным разделом. Вы можете внести необходимые изменения в различные элементы, такие как выравнивание панели поиска, положение кнопки, цвет текста и т. д.

Вы также можете добавить собственный ярлык в строку поиска в соответствии с вашими требованиями. Наконец, нажмите кнопку «Обновить».

Просмотрите панель поиска на своей странице:

Теперь, если вы посещаете любую из своих опубликованных страниц или сообщений, вы можете заметить панель поиска или окно поиска, отображаемое на главной боковой панели.

Добавьте панель поиска с помощью виджета поиска ElementsKit:

Теперь я покажу вам еще один простой способ добавить панель поиска на ваш сайт WordPress. И это с помощью виджета поиска по заголовку ElementsKit. Добавить окно поиска через ElementsKit очень просто.

Без лишних слов, давайте проверим это -

Перейдите к любой из ваших существующих публикаций или страниц с панели управления:

Прежде всего, перейдите на панель инструментов и найдите сообщения или страницы. Здесь я покажу, как виджет ElementsKit работает с сообщением «Hello World!»

Перейдите в «Сообщения», а затем выберите «Все сообщения», чтобы отображались все ваши сообщения. Оттуда вы можете выбрать сообщение, в которое вы хотите добавить панель поиска. Если у вас нет существующей публикации или страницы, вам необходимо добавить новую публикацию или страницу.

Панель управления > Сообщения > Все сообщения > Ваше сообщение

Переключитесь в окно Elementor:

Теперь нажмите «Редактировать с помощью Elementor», расположенную вверху посередине. Это приведет вас к окну Elementor.

Перетащите виджет поиска по заголовку:

В окне Elementor вы получите доступ к множеству виджетов. Введите виджет «Поиск по заголовку» в поле поиска, чтобы найти виджет. Кроме того, вы также можете прокрутить вниз и найти виджет.

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

Установите параметры панели поиска:

Как только панель поиска появится на странице, пришло время установить параметры панели в соответствии с вашими предпочтениями. На вкладке «Содержимое» у вас будет раздел «Поиск по заголовку», где вы помещаете текст-заполнитель, выбираете значок поиска и настраиваете размер шрифта.

На вкладке «Стиль» у вас будет 2 раздела: «Поиск по заголовку» и «Контейнер поиска». В разделе «Поиск по заголовку» вы можете настроить такие параметры, как цвет фона, тип границы, тень окна поиска, поля и т. Д. Строки поиска.

В разделе «Контейнер поиска» вы можете выбрать тип фона и установить текст-заполнитель и цвет границы.

Наконец, вы готовы к работе!

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

Добавьте окно поиска с кодом CSS:

Есть еще один способ добавить панель поиска на свой сайт, используя код CSS. Хотя для этого вам нужно немного технических знаний, это не ракетостроение. Я покажу вам процесс здесь, и после этого это будет очень легко.

Перейдите в редактор тем:

Прежде всего, нажмите «Внешний вид» на панели инструментов и перейдите в «Редактор тем».

Откройте файл header.php или sidebar.php:

При этом вы перейдете к файлу style.css по умолчанию. Оттуда откройте файл header.php или sidebar.php в зависимости от того, где вы хотите, чтобы панель поиска отображалась.

Добавить функцию панели поиска:

Теперь добавьте эту функцию <?php get_search_form(); ?> в коде вашего файла header.php или sidebar.php. Я добавил функцию в код файла header.php.

Просмотрите панель поиска на своем сайте:

Наконец, откройте любую из ваших опубликованных страниц, и вы заметите, что панель поиска появляется вверху. Если вы добавили функцию в файл sidebar.php, панель поиска появится на боковой панели.

Завершение:

Это оно!!! Я показал вам 3 очень простых метода добавления панели поиска на ваш сайт WordPress. В зависимости от ваших требований, вы можете выбрать любой из них. Однако, если вы добавите панель поиска с виджетом поиска в заголовке ElementsKit, вы получите дополнительное преимущество.

Что это? Бездонные возможности настройки!!! Следовательно, если вы любите настройку, используйте виджет поиска в заголовке ElementsKit. Благодаря этому вы можете придать своей панели поиска завораживающий вид.