如何显示特定的 css 样式 wp_nav_menu()答案

【问题标题】：How to display specific css styles wp_nav_menu()如何显示特定的 css 样式 wp_nav_menu()
【发布时间】：2018-06-08 06:13:28
【问题描述】：

我对 wordpress 真的很陌生。我有一个自定义菜单，我只想在用户浏览器登陆特定页面时显示特定菜单项。

wp_nav_menu(array('theme_location' => 'menu-main'));

有没有办法让 wp_nav_menu() 挂钩只显示具有特定 css 类项的特定菜单项？

【问题讨论】：

不，没有。但是，研究wp_nav_menu - 您会发现您可以拥有多个菜单，具体取决于您所在的页面，此外，您可以“过滤”菜单，因此使用自定义代码，您可以构建一个过滤器来限制在给定情况下显示哪些菜单项。

标签： css wordpress menu

【解决方案1】：

如果我能很好地理解你的问题，是的，有办法。你可以使用条件句。 PHP if 语句。 WordPress 允许您在执行命令之前检查页面标题、ID、类别，例如

if( is_page( array( 'about-us', 'contact', 'management' ) ) {

     //either in about us, or contact, or management page is in view
     //execute something

} else {

     //none of the page about us, contact or management is in view
     //execute something

}

您可以将类/ID 添加到wp_nav_menu

所以加入这两个想法，你可以有：

// When Page 42 (ID) is being displayed.
if ( is_page( 42 ) ) {

    wp_nav_menu(array('menu_id' => 'pines', 'menu_class' => 'pnav'));

} elseif( is_page( array( 'about-us', 'contact', 'management' ) ) {

     wp_nav_menu(array('menu_id' => 'bananas', 'menu_class' => 'nav'));

} else {

     wp_nav_menu(array('menu_id' => 'main-id', 'menu_class' => 'main-nav'));

}

添加了唯一的 ID 和类后，您可以按照自己的方式设置样式。参考https://codex.wordpress.org/Conditional_Tags

【讨论】：

【解决方案2】：

考虑在编写自定义函数之前搜索现有插件。对于您的特定功能，我会使用Page Specific Menu Items 插件。

如果您想添加到现有函数，请考虑使用body_class 过滤器。使用此功能，您可以向 body 元素添加一个 css 类，然后编写 css 来更改菜单在任何特定页面上的显示方式。

【讨论】：