Добавление панели поиска / формы к пользовательской HTML навигации в Wordpress с помощью функции get_search_form ()

Question

Моя проблема в том, что я построил навигационное меню внутри раздела 'top' в области виджетов в WordPress (что, возможно, является ошибкой, поскольку я не могу добавить туда php). Предположим, мое меню построено следующим образом:

<nav>
<div class="title-and-logo">...</div>
<div class="menu-links">...</div>
<div class="search-bar">   </div>
</nav>

Соответствующее css:

nav{
display: flex;
}

Мне нужно добавить панель поиска в div .search-bar. Мое решение состоит в том, чтобы переместить все меню навигации из области виджетов в функции. php. (Мне пока не очень удобно с PHP, поэтому я не хочу с ним возиться).

Мой вопрос: есть ли способ добавить панель поиска, сгенерированную get_search_form (), в раздел с class = "search-bar" без необходимости удалять мой код где-то, что позволяет PHP?

Или: можно ли сгенерировать обычную строку поиска, используя HTML, без необходимости использовать get_search_form (), предоставляемую WordPress? (но, возможно, функция поиска WordPress лучше?).

Любая помощь приветствуется. Вы можете предложить javascript и jquery исправления.

Answer 1

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

<?php
/**
 * Register our sidebars and widgetized areas.
 *
 */
function my_custom_widget_area_init() {

    register_sidebar( array(
        'name'          => 'Top Nav - Search',
        'id'            => 'top_nav_search',
        'before_widget' => '',
        'after_widget'  => '',
        'before_title'  => '',
        'after_title'   => '',
    ) );

}
add_action( 'widgets_init', 'my_custom_widget_area_init' );
?>

Затем вы настраиваете свою тему для отображения виджета:

<nav>
    <div class="title-and-logo">...</div>
    <div class="menu-links">...</div>
    <?php if ( is_active_sidebar( 'top_nav_search' ) ) : ?>
    <div class="search-bar"><?php dynamic_sidebar( 'top_nav_search' ); ?></div>
    <?php endif; ?>
</nav>

Answer 2

Хорошо, у меня была очень конкретная c проблема, которая, я сомневаюсь, у кого-то еще, но в любом случае вот как я ее решил:

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

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

Так что все, что мне нужно было сделать, это получить шорткод поискового виджета (так как у нас есть поисковый виджет по умолчанию в Wordpress) и вставьте его в HTML моего Nav.

Проблема: оказывается, мы не можем поставить шорткоды по умолчанию внутри html виджетов. Решение: поместите однострочный код в функции. php, что позволит нам сделать это. Задача решена.