在 wordpress 的导航菜单中添加搜索栏

Posted

技术标签:

【中文标题】在 wordpress 的导航菜单中添加搜索栏【英文标题】:adding search bar to the nav menu in wordpress 【发布时间】:2015-10-27 15:48:22 【问题描述】:

http://www.lundarienpress.com/(这是一个wordpress网站)

这是我的网站,我正在尝试在导航菜单中添加一个搜索栏并将其放在右侧。有任何想法吗 ?

我还没有找到办法。我希望论坛中的某个人可以帮助我。

【问题讨论】:

分享你的尝试。那么,如果您遇到了一些确切的问题,我们将为您提供帮助。请参阅这些链接以提出正确的问题 (***.com/help/how-to-ask) 、 (***.com//help/mcve) 和 (sscce.org) 我不知道怎么做,我想从这里得到一些帮助。 我正在使用一个插件,所以我所要做的就是设置它的样式。 也可以使用这个插件wordpress.org/plugins/add-search-to-menu来实现。 【参考方案1】:

@rockmandew 是对的 - 如果不将 get_search_form() 设置为 false,此代码将无法运行。但是即使在进行了更改之后,该功能也无法正常工作。

我最初通过将它添加到我的函数文件中来在导航菜单中添加了一个搜索表单:

/**
 * Add search box to nav menu
 */
function wpgood_nav_search( $items, $args ) 
    $items .= '<li>' . get_search_form( false ) . '</li>';
    return $items;

add_filter( 'wp_nav_menu_items','wpgood_nav_search', 10, 2 );

如果您有一个菜单或希望将搜索框添加到所有菜单,这是一个很好的解决方案。就我而言,我只想在主菜单中添加一个搜索框。为了实现这一点,我采用了以下方法:

/**
 * Add search box to primary menu
 */
function wpgood_nav_search($items, $args) 
    // If this isn't the primary menu, do nothing
    if( !($args->theme_location == 'primary') ) 
    return $items;
    // Otherwise, add search form
    return $items . '<li>' . get_search_form(false) . '</li>';

add_filter('wp_nav_menu_items', 'wpgood_nav_search', 10, 2);

值得注意的是,我的主导航在我的函数文件中被命名为“primary”。这可能因主题而异,因此需要相应地更改,即“main”或初始解决方案中的“header_menu”。

【讨论】:

二十七号叫'top',花了我整整一个小时才知道。【参考方案2】:

Function.php 代码:

function add_last_nav_item($items, $args) 
  if ('header_menu' === $args->menu_id) 
        $homelink = get_search_form(false);
        $items .= '<li>'.$homelink.'</li>';
        return $items;
  
  return $items;

add_filter( 'wp_nav_menu_items', 'add_last_nav_item', 10, 2 );

这里get_search_form()是获取搜索框的功能。

【讨论】:

我应该把这个添加到function.php文件吗? 是的,你可以在function.php文件中添加这个。 欢迎您,批准有效的回复。它对其他人有帮助。 这实际上不能正常工作,您需要将 get_search_form() 设置为 false 以生成正确的标记。【参考方案3】:

两个答案都让我走上了正确的道路,但似乎 args 的值取决于 Wordpress 版本(我运行 5.5)或主题(我正在使用 https://underscores.me/ )或其他任何东西(不是超级 WP 专家在这里,刚刚开始深入研究此类 WP 主题)。

如果上述方法对您不起作用,有什么帮助是转储 args 并相应地修改代码。

args 对我的价值:

stdClass::__set_state(array( 'menu' => WP_Term::__set_state(array( 'term_id' => 7, 'name' => 'Menu 1', 'slug' => 'menu-1', 'term_group' => 0, 'term_taxonomy_id' => 7, 'taxonomy' => 'nav_menu', 'description' => '', 'parent' => 0, 'count' => 5, 'filter' => 'raw', )), 'container' => 'div', 'container_class' => '', 'container_id' => '', 'container_aria_label' => '', 'menu_class' => 'menu', 'menu_id' => 'primary-menu', 'echo' => true, 'fallback_cb' => 'wp_page_menu', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '', 'items_wrap' => '
%3$s
', 'item_spacing' => 'preserve', 'depth' => 0, 'walker' => '', 'theme_location' => 'menu-1', ))

所以我去检查taxonomy(也清理了一点代码):

function add_last_nav_item($items, $args) 
    // just to show you how to dump it out - remove that line afterwards ofcs
    var_export($args);

    // If this is the menu you are looking for, add search form
    if (isset($args->menu->taxonomy) && $args->menu->taxonomy === 'nav_menu') 
        $items .= '<li>' . get_search_form(false) . '</li>';
    
    return $items;

add_filter( 'wp_nav_menu_items', 'add_last_nav_item', 10, 2);

【讨论】:

以上是关于在 wordpress 的导航菜单中添加搜索栏的主要内容,如果未能解决你的问题,请参考以下文章

PHP 如何自动将搜索字段添加到导航菜单中| WordPress的

在一个 WordPress 主题上调整浏览器窗口的大小以及添加 JS 代码移动菜单关闭按钮后,导航栏不起作用

Wordpress 导航栏中的自定义简码

如何自动将搜索字段添加到导航菜单| Wordpress

导航菜单在 Wordpress 的管理面板中不起作用

将 Bootstrap 导航栏转换为 WordPress 菜单