使用 wp_nav_menu_items 更改 wordpress 菜单项的位置答案

【问题标题】：change position of wordpress menu items using wp_nav_menu_items使用 wp_nav_menu_items 更改 wordpress 菜单项的位置
【发布时间】：2016-08-05 17:56:03
【问题描述】：

我在 wordpress 主菜单的顶部添加了一个搜索框和一个“加入电子邮件列表”按钮。搜索框按预期显示，但电子邮件按钮显示在菜单的 UL 中——我可以在完整菜单中通过定位进行补偿，但当响应式移动菜单出现时，它会完全隐藏按钮。不知道如何正确地将其从 UL 中取出。

我发现，如果您需要将电子邮件按钮作为外部文件，它将出现在 UL 之外——但这也会导致“1”出现在非移动版本的主菜单之前。令人费解...

这是我的代码，同时显示了 string 方法和 require 方法（已注释掉）。

add_filter('wp_nav_menu_items','add_search_box_to_menu', 10, 2);
function add_search_box_to_menu( $items, $args ) {
    if( $args->theme_location == 'main-nav-menu' ) {
        $search_form = get_search_form();
//      $email_button = require_once('emailbutton.php');
        $email_button = '<button id="btn_emaillist">Join Our Email List</button>';
        $items = $search_form . $email_button . $items;
    }
    return $items;
}

您可以在http://example.wdev05.com/ 现场观看。如何使按钮出现在 UL 之外，以便在桌面和移动设备中都可见，而不会产生任何奇怪的副作用？

【问题讨论】：

实际上，使用 require_once 方法，它只出现在 Chrome 的移动布局中——而不是在 Firefox、Safari 或 Edge...

标签： wordpress menu

【解决方案1】：

wp_nav_menu_items 将在 UL 中添加内容。

使用wp_nav_menu过滤器在ul外插入内容

function _wp_nav_m_filter( $nav, $args ) {
    if( $args->theme_location == 'main-nav-menu' ) {
        $search_form = get_search_form( false ); // do not echo the form
        $search_form .= '<button id="btn_emaillist">Join Our Email List</button>';
        return $search_form . $nav;
    }
    return $nav;
}
add_filter('wp_nav_menu', '_wp_nav_m_filter', 10, 2);

结帐https://core.trac.wordpress.org/browser/tags/4.5/src/wp-includes/nav-menu-template.php#L451

【讨论】：

非常好……现在我知道了。谢谢！